@primer/css 0.0.0-20220520180541 → 0.0.0-20220520223210

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 CHANGED
@@ -1,10 +1,10 @@
1
1
  # @primer/css
2
2
 
3
- ## 0.0.0-20220520180541
3
+ ## 0.0.0-20220520223210
4
4
 
5
5
  ### Minor Changes
6
6
 
7
- - [#2087](https://github.com/primer/css/pull/2087) [`0f16cee8`](https://github.com/primer/css/commit/0f16cee819405d81a849b2a3b2eb88bc53bf172c) Thanks [@vdepizzol](https://github.com/vdepizzol)! - Changing `PageLayout--isPaneSticky` to `PageLayout--sticky`.
7
+ - [#2087](https://github.com/primer/css/pull/2087) [`8354de5c`](https://github.com/primer/css/commit/8354de5c5eeb60e447712c04e25c2ef370206488) Thanks [@vdepizzol](https://github.com/vdepizzol)! - Changing `PageLayout--isPaneSticky` to `PageLayout--sticky`.
8
8
 
9
9
  ### Patch Changes
10
10
 
package/app/README.md ADDED
@@ -0,0 +1,25 @@
1
+ ---
2
+ bundle: "app"
3
+ generated: true
4
+ ---
5
+
6
+ # Primer CSS: `app` bundle
7
+
8
+ ## Usage
9
+
10
+ Primer CSS source files are written in [SCSS]. To include this Primer CSS module in your own build, ensure that your `node_modules` directory is listed in your Sass include paths, then import it with:
11
+
12
+ ```scss
13
+ @import "@primer/css/app/index.scss";
14
+ ```
15
+
16
+ ## Build
17
+
18
+ The `@primer/css` npm package includes a standalone CSS build of this module in `dist/app.css`.
19
+
20
+ ## License
21
+
22
+ [MIT](https://github.com/primer/css/blob/main/LICENSE) © [GitHub](https://github.com/)
23
+
24
+
25
+ [scss]: https://sass-lang.com/documentation/syntax#scss
File without changes
@@ -0,0 +1,170 @@
1
+ // stylelint-disable max-nesting-depth
2
+ // stylelint-disable selector-max-specificity
3
+ // stylelint-disable no-duplicate-selectors
4
+
5
+ .AppFrame {
6
+
7
+ // Accessibility navigation
8
+
9
+ .AppFrame-a11yNav {
10
+ position: absolute;
11
+ padding: var(--base-size-16) var(--base-size-16) var(--base-size-8);
12
+ top: calc(var(--base-size-128) * -1);
13
+ left: 0;
14
+ background: #F6F8FA; /* fixme */
15
+ z-index: 1000;
16
+ width: 100%;
17
+
18
+ ul, li {
19
+ list-style: none;
20
+ margin: 0;
21
+ padding: 0;
22
+ }
23
+
24
+ ul {
25
+ display: flex;
26
+ align-items: center;
27
+ gap: var(--base-size-8);
28
+ }
29
+
30
+ &:focus-within {
31
+ top: 0;
32
+
33
+ // Narrow viewport
34
+ @media (max-width: #{map-get($breakpoints, 'md') - 0.02px}) {
35
+ ul {
36
+ justify-content: center;
37
+ }
38
+ }
39
+ }
40
+ }
41
+
42
+ .AppFrame-a11yLink {
43
+ transition: none;
44
+
45
+ &:not(:focus) {
46
+ width: var(--base-size-8);
47
+ height: var(--base-size-8);
48
+ display: block;
49
+ overflow: hidden;
50
+ text-indent: var(--base-size-128);
51
+ border-radius: 100%;
52
+ background: var(--color-border-default);
53
+ pointer-events: none;
54
+ }
55
+
56
+ &:focus {
57
+ display: grid;
58
+ z-index: 20;
59
+ width: auto;
60
+ height: auto;
61
+ overflow: auto;
62
+ border-radius: var(--base-size-24);
63
+ min-height: var(--base-size-32);
64
+ align-items: center;
65
+ padding: 0 var(--base-size-16);
66
+ background: var(--color-accent-fg);
67
+ color: var(--color-fg-on-emphasis);
68
+
69
+ @media (pointer: coarse) {
70
+ &:after {
71
+ // pull from minTouchTarget design token
72
+ @include minTouchTarget(var(--primer-control-minTarget-coarse));
73
+ }
74
+ }
75
+
76
+ @media (prefers-reduced-motion: no-preference) {
77
+ animation: AppFrame-a11yLink-focus 200ms ease-out;
78
+ }
79
+
80
+ @keyframes AppFrame-a11yLink-focus {
81
+ 0% {
82
+ transform: scale(0.3, 0.25);
83
+ color: var(--color-accent-fg);
84
+ }
85
+ 50% {
86
+ transform: scale(1, 1);
87
+ color: var(--color-accent-fg);
88
+ }
89
+ 55% {
90
+ color: var(--color-fg-on-emphasis);
91
+ }
92
+ 100% {
93
+ transform: scaleX(1);
94
+ }
95
+ }
96
+ }
97
+ }
98
+
99
+ .AppFrame-main {
100
+ display: flex;
101
+ flex-direction: column;
102
+ min-height: 100vh;
103
+ }
104
+
105
+ .AppFrame-header-wrapper {
106
+ position: relative;
107
+ overflow: visible;
108
+ height: min-content;
109
+
110
+ .AppFrame-header {
111
+ position: sticky;
112
+ top: 0;
113
+ z-index: 1;
114
+ }
115
+ }
116
+
117
+ .AppFrame-header {
118
+ flex: 0 0 auto;
119
+ }
120
+
121
+ .AppFrame-tray {
122
+ overflow: hidden;
123
+ flex: 0 0 auto;
124
+ background: linear-gradient(to bottom, var(--color-border-default) -#{$spacer-3}, var(--color-canvas-inset) #{$spacer-2});
125
+
126
+ @keyframes flash-tray--appear {
127
+ from {
128
+ opacity: 0;
129
+ transform: translateY(-$spacer-4);
130
+ }
131
+ to {
132
+ opacity: 1;
133
+ }
134
+ }
135
+
136
+ @include breakpoint(md) {
137
+ padding: $spacer-2 $spacer-3;
138
+ border-bottom: $border-width $border-style var(--color-border-default);
139
+
140
+ .Flash {
141
+ animation: flash-tray--appear 160ms 80ms both cubic-bezier(0.33, 1, 0.68, 1);
142
+
143
+ & + .Flash {
144
+ margin-top: $spacer-2;
145
+ animation-delay: 160ms;
146
+ }
147
+ }
148
+ }
149
+
150
+ &:empty {
151
+ display: none;
152
+ }
153
+
154
+ // FIXME: use theme-high-contrast mixin
155
+ @at-root :is([data-color-mode="light"][data-light-theme$='high_contrast'], [data-color-mode="dark"][data-dark-theme$='high_contrast']) & {
156
+ background: var(--color-canvas-inset);
157
+ }
158
+ }
159
+
160
+ .AppFrame-body {
161
+ flex: 1 0;
162
+ height: 100%;
163
+ }
164
+
165
+ .AppFrame-footer {
166
+ border-top: $border-width $border-style var(--color-border-default);
167
+ background: var(--color-canvas-inset);
168
+ padding: $spacer-3;
169
+ }
170
+ }
@@ -0,0 +1,130 @@
1
+ .AppHeader {
2
+ --AppHeader-bg: #F6F8FA; /* bg.subtle? */
3
+
4
+ background: var(--AppHeader-bg);
5
+ color: var(--color-fg-default);
6
+
7
+ // Global bar
8
+
9
+ .AppHeader-globalBar {
10
+ padding: var(--base-size-16); // Replace with `base-size-16`
11
+ display: flex;
12
+ gap: 16px; // Replace with `base-size-16`
13
+
14
+ // GitHub logo + user avatar
15
+
16
+ .AppHeader-logo, .AppHeader-user {
17
+ flex: 0 0 auto;
18
+ display: grid;
19
+
20
+ button, a {
21
+ grid-area: 1 / 1;
22
+ display: block;
23
+ width: var(--base-size-32);
24
+ height: var(--base-size-32);
25
+ }
26
+
27
+ button {
28
+ background: transparent;
29
+ padding: 0;
30
+ border: none;
31
+ border-radius: 100%;
32
+ outline-offset: var(--primer-borderWidth-normal);
33
+ }
34
+
35
+ a {
36
+ grid-area: 1 / 1;
37
+ position: relative;
38
+ overflow: hidden;
39
+ text-indent: var(--base-size-128);
40
+ color: transparent;
41
+
42
+ @media (pointer: coarse) {
43
+ &:after {
44
+ // pull from minTouchTarget design token
45
+ @include minTouchTarget(var(--primer-control-minTarget-coarse), var(--primer-control-minTarget-coarse));
46
+ }
47
+ }
48
+ }
49
+ }
50
+
51
+ .AppHeader-logo svg {
52
+ width: var(--base-size-32);
53
+ height: var(--base-size-32);
54
+ }
55
+
56
+ .AppHeader-user {
57
+ background: var(--color-neutral-muted);
58
+ border-radius: 100%;
59
+
60
+ img {
61
+ display: block;
62
+ width: 100%;
63
+ height: 100%;
64
+ border-radius: 100%;
65
+ }
66
+ }
67
+
68
+ // Context region
69
+ // Breadcrumb, title, any contextual information directly after the logo
70
+
71
+ .AppHeader-context {
72
+ flex: 1 1 auto;
73
+ height: var(--base-size-32);
74
+ //background: #ececec;
75
+ }
76
+ }
77
+
78
+ // Local bar
79
+
80
+ .AppHeader-localBar {
81
+ padding: 0 var(--base-size-16) var(--base-size-16);
82
+ //background: lightcyan;
83
+ box-shadow: inset 0 calc(var(--primer-borderWidth-thin) * -1) var(--color-border-default);
84
+ }
85
+
86
+ // AppHeader items
87
+
88
+ .AppHeader-item {
89
+ flex: 0 0 auto;
90
+ background: lightpink;
91
+ }
92
+
93
+ .AppHeader-item--full {
94
+ flex-grow: 1;
95
+ }
96
+
97
+ .AppHeader-button {
98
+ position: relative;
99
+ display: grid;
100
+ width: var(--base-size-32);
101
+ height: var(--base-size-32);
102
+ border: var(--primer-borderWidth-thin) solid var(--color-border-default);
103
+ border-radius: var(--primer-borderRadius-medium);
104
+ color: var(--color-fg-muted);
105
+ align-items: center;
106
+ justify-content: center;
107
+
108
+ svg {
109
+ display: block !important;
110
+ color: inherit !important;
111
+ width: var(--base-size-16);
112
+ height: var(--base-size-16);
113
+ }
114
+
115
+ &:hover {
116
+ background: var(--color-action-list-item-default-hover-bg);
117
+ }
118
+
119
+ &:active {
120
+ background: var(--color-action-list-item-default-active-bg);
121
+ }
122
+
123
+ @media (pointer: coarse) {
124
+ &:after {
125
+ // pull from minTouchTarget design token
126
+ @include minTouchTarget(var(--primer-control-minTarget-coarse), var(--primer-control-minTarget-coarse));
127
+ }
128
+ }
129
+ }
130
+ }
package/app/index.scss ADDED
@@ -0,0 +1,4 @@
1
+ @import '../support/index.scss';
2
+ @import './app-frame.scss';
3
+ @import './app-header.scss';
4
+ @import './app-footer.scss';
package/dist/app.css ADDED
@@ -0,0 +1,2 @@
1
+ .AppFrame .AppFrame-a11yNav{position:absolute;padding:var(--base-size-16) var(--base-size-16) var(--base-size-8);top:calc(var(--base-size-128)*-1);left:0;background:#f6f8fa;z-index:1000;width:100%}.AppFrame .AppFrame-a11yNav ul,.AppFrame .AppFrame-a11yNav li{list-style:none;margin:0;padding:0}.AppFrame .AppFrame-a11yNav ul{display:flex;align-items:center;gap:var(--base-size-8)}.AppFrame .AppFrame-a11yNav:focus-within{top:0}@media(max-width: 767.98px){.AppFrame .AppFrame-a11yNav:focus-within ul{justify-content:center}}.AppFrame .AppFrame-a11yLink{transition:none}.AppFrame .AppFrame-a11yLink:not(:focus){width:var(--base-size-8);height:var(--base-size-8);display:block;overflow:hidden;text-indent:var(--base-size-128);border-radius:100%;background:var(--color-border-default);pointer-events:none}.AppFrame .AppFrame-a11yLink:focus{display:grid;z-index:20;width:auto;height:auto;overflow:auto;border-radius:var(--base-size-24);min-height:var(--base-size-32);align-items:center;padding:0 var(--base-size-16);background:var(--color-accent-fg);color:var(--color-fg-on-emphasis)}@media(pointer: coarse){.AppFrame .AppFrame-a11yLink:focus:after{position:absolute;top:50%;left:50%;width:100%;height:100%;min-height:var(--primer-control-minTarget-coarse);content:"";transform:translateX(-50%) translateY(-50%)}}@media(prefers-reduced-motion: no-preference){.AppFrame .AppFrame-a11yLink:focus{animation:AppFrame-a11yLink-focus 200ms ease-out}}@keyframes AppFrame-a11yLink-focus{0%{transform:scale(0.3, 0.25);color:var(--color-accent-fg)}50%{transform:scale(1, 1);color:var(--color-accent-fg)}55%{color:var(--color-fg-on-emphasis)}100%{transform:scaleX(1)}}.AppFrame .AppFrame-main{display:flex;flex-direction:column;min-height:100vh}.AppFrame .AppFrame-header-wrapper{position:relative;overflow:visible;height:min-content}.AppFrame .AppFrame-header-wrapper .AppFrame-header{position:sticky;top:0;z-index:1}.AppFrame .AppFrame-header{flex:0 0 auto}.AppFrame .AppFrame-tray{overflow:hidden;flex:0 0 auto;background:linear-gradient(to bottom, var(--color-border-default) -16px, var(--color-canvas-inset) 8px)}@keyframes flash-tray--appear{from{opacity:0;transform:translateY(-24px)}to{opacity:1}}@media(min-width: 768px){.AppFrame .AppFrame-tray{padding:8px 16px;border-bottom:1px solid var(--color-border-default)}.AppFrame .AppFrame-tray .Flash{animation:flash-tray--appear 160ms 80ms both cubic-bezier(0.33, 1, 0.68, 1)}.AppFrame .AppFrame-tray .Flash+.Flash{margin-top:8px;animation-delay:160ms}}.AppFrame .AppFrame-tray:empty{display:none}:is([data-color-mode=light][data-light-theme$=high_contrast],[data-color-mode=dark][data-dark-theme$=high_contrast]) .AppFrame .AppFrame-tray{background:var(--color-canvas-inset)}.AppFrame .AppFrame-body{flex:1 0;height:100%}.AppFrame .AppFrame-footer{border-top:1px solid var(--color-border-default);background:var(--color-canvas-inset);padding:16px}.AppHeader{--AppHeader-bg: #F6F8FA;background:var(--AppHeader-bg);color:var(--color-fg-default)}.AppHeader .AppHeader-globalBar{padding:var(--base-size-16);display:flex;gap:16px}.AppHeader .AppHeader-globalBar .AppHeader-logo,.AppHeader .AppHeader-globalBar .AppHeader-user{flex:0 0 auto;display:grid}.AppHeader .AppHeader-globalBar .AppHeader-logo button,.AppHeader .AppHeader-globalBar .AppHeader-logo a,.AppHeader .AppHeader-globalBar .AppHeader-user button,.AppHeader .AppHeader-globalBar .AppHeader-user a{grid-area:1/1;display:block;width:var(--base-size-32);height:var(--base-size-32)}.AppHeader .AppHeader-globalBar .AppHeader-logo button,.AppHeader .AppHeader-globalBar .AppHeader-user button{background:transparent;padding:0;border:none;border-radius:100%;outline-offset:var(--primer-borderWidth-normal)}.AppHeader .AppHeader-globalBar .AppHeader-logo a,.AppHeader .AppHeader-globalBar .AppHeader-user a{grid-area:1/1;position:relative;overflow:hidden;text-indent:var(--base-size-128);color:transparent}@media(pointer: coarse){.AppHeader .AppHeader-globalBar .AppHeader-logo a:after,.AppHeader .AppHeader-globalBar .AppHeader-user a:after{position:absolute;top:50%;left:50%;width:100%;height:100%;min-height:var(--primer-control-minTarget-coarse);content:"";transform:translateX(-50%) translateY(-50%);min-width:var(--primer-control-minTarget-coarse)}}.AppHeader .AppHeader-globalBar .AppHeader-logo svg{width:var(--base-size-32);height:var(--base-size-32)}.AppHeader .AppHeader-globalBar .AppHeader-user{background:var(--color-neutral-muted);border-radius:100%}.AppHeader .AppHeader-globalBar .AppHeader-user img{display:block;width:100%;height:100%;border-radius:100%}.AppHeader .AppHeader-globalBar .AppHeader-context{flex:1 1 auto;height:var(--base-size-32)}.AppHeader .AppHeader-localBar{padding:0 var(--base-size-16) var(--base-size-16);box-shadow:inset 0 calc(var(--primer-borderWidth-thin)*-1) var(--color-border-default)}.AppHeader .AppHeader-item{flex:0 0 auto;background:#ffb6c1}.AppHeader .AppHeader-item--full{flex-grow:1}.AppHeader .AppHeader-button{position:relative;display:grid;width:var(--base-size-32);height:var(--base-size-32);border:var(--primer-borderWidth-thin) solid var(--color-border-default);border-radius:var(--primer-borderRadius-medium);color:var(--color-fg-muted);align-items:center;justify-content:center}.AppHeader .AppHeader-button svg{display:block !important;color:inherit !important;width:var(--base-size-16);height:var(--base-size-16)}.AppHeader .AppHeader-button:hover{background:var(--color-action-list-item-default-hover-bg)}.AppHeader .AppHeader-button:active{background:var(--color-action-list-item-default-active-bg)}@media(pointer: coarse){.AppHeader .AppHeader-button:after{position:absolute;top:50%;left:50%;width:100%;height:100%;min-height:var(--primer-control-minTarget-coarse);content:"";transform:translateX(-50%) translateY(-50%);min-width:var(--primer-control-minTarget-coarse)}}
2
+ /*# sourceMappingURL=app.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["file:///home/runner/work/css/css/src/app/index.scss%23sass"],"names":[],"mappings":"AAkjBE,4BAAA,iBAAA,CAAA,kEAAA,CAAA,iCAAA,CAAA,MAAA,CAAA,kBAAA,CAAA,YAAA,CAAA,UAAA,CAAA,8DAAA,eAAA,CAAA,QAAA,CAAA,SAAA,CAAA,+BAAA,YAAA,CAAA,kBAAA,CAAA,sBAAA,CAAA,yCAAA,KAAA,CAAA,4BAAA,4CAAA,sBAAA,CAAA,CAAA,6BAAA,eAAA,CAAA,yCAAA,wBAAA,CAAA,yBAAA,CAAA,aAAA,CAAA,eAAA,CAAA,gCAAA,CAAA,kBAAA,CAAA,sCAAA,CAAA,mBAAA,CAAA,mCAAA,YAAA,CAAA,UAAA,CAAA,UAAA,CAAA,WAAA,CAAA,aAAA,CAAA,iCAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,6BAAA,CAAA,iCAAA,CAAA,iCAAA,CAAA,wBAAA,yCAAA,iBAAA,CAAA,OAAA,CAAA,QAAA,CAAA,UAAA,CAAA,WAAA,CAAA,iDAAA,CAAA,UAAA,CAAA,2CAAA,CAAA,CAAA,8CAAA,mCAAA,gDAAA,CAAA,CAAA,mCAAA,GAAA,0BAAA,CAAA,4BAAA,CAAA,IAAA,qBAAA,CAAA,4BAAA,CAAA,IAAA,iCAAA,CAAA,KAAA,mBAAA,CAAA,CAAA,yBAAA,YAAA,CAAA,qBAAA,CAAA,gBAAA,CAAA,mCAAA,iBAAA,CAAA,gBAAA,CAAA,kBAAA,CAAA,oDAAA,eAAA,CAAA,KAAA,CAAA,SAAA,CAAA,2BAAA,aAAA,CAAA,yBAAA,eAAA,CAAA,aAAA,CAAA,uGAAA,CAAA,8BAAA,KAAA,SAAA,CAAA,2BAAA,CAAA,GAAA,SAAA,CAAA,CAAA,yBAAA,yBAAA,gBAAA,CAAA,mDAAA,CAAA,gCAAA,2EAAA,CAAA,uCAAA,cAAA,CAAA,qBAAA,CAAA,CAAA,+BAAA,YAAA,CAAA,8IAAA,oCAAA,CAAA,yBAAA,QAAA,CAAA,WAAA,CAAA,2BAAA,gDAAA,CAAA,oCAAA,CAAA,YAAA,CAAA,WAAA,uBAAA,CAAA,8BAAA,CAAA,6BAAA,CAAA,gCAAA,2BAAA,CAAA,YAAA,CAAA,QAAA,CAAA,gGAAA,aAAA,CAAA,YAAA,CAAA,kNAAA,aAAA,CAAA,aAAA,CAAA,yBAAA,CAAA,0BAAA,CAAA,8GAAA,sBAAA,CAAA,SAAA,CAAA,WAAA,CAAA,kBAAA,CAAA,+CAAA,CAAA,oGAAA,aAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,gCAAA,CAAA,iBAAA,CAAA,wBAAA,gHAAA,iBAAA,CAAA,OAAA,CAAA,QAAA,CAAA,UAAA,CAAA,WAAA,CAAA,iDAAA,CAAA,UAAA,CAAA,2CAAA,CAAA,gDAAA,CAAA,CAAA,oDAAA,yBAAA,CAAA,0BAAA,CAAA,gDAAA,qCAAA,CAAA,kBAAA,CAAA,oDAAA,aAAA,CAAA,UAAA,CAAA,WAAA,CAAA,kBAAA,CAAA,mDAAA,aAAA,CAAA,0BAAA,CAAA,+BAAA,iDAAA,CAAA,sFAAA,CAAA,2BAAA,aAAA,CAAA,kBAAA,CAAA,iCAAA,WAAA,CAAA,6BAAA,iBAAA,CAAA,YAAA,CAAA,yBAAA,CAAA,0BAAA,CAAA,uEAAA,CAAA,+CAAA,CAAA,2BAAA,CAAA,kBAAA,CAAA,sBAAA,CAAA,iCAAA,wBAAA,CAAA,wBAAA,CAAA,yBAAA,CAAA,0BAAA,CAAA,mCAAA,yDAAA,CAAA,oCAAA,0DAAA,CAAA,wBAAA,mCAAA,iBAAA,CAAA,OAAA,CAAA,QAAA,CAAA,UAAA,CAAA,WAAA,CAAA,iDAAA,CAAA,UAAA,CAAA,2CAAA,CAAA,gDAAA,CAAA","file":"app.css"}
package/dist/app.js ADDED
@@ -0,0 +1 @@
1
+ export {cssstats: require('./stats/app.json')}
package/dist/meta.json CHANGED
@@ -22,6 +22,17 @@
22
22
  "legacy": "primer-support/index.scss",
23
23
  "imports": []
24
24
  },
25
+ "loaders": {
26
+ "name": "loaders",
27
+ "source": "src/loaders/index.scss",
28
+ "sass": "@primer/css/loaders/index.scss",
29
+ "css": "dist/loaders.css",
30
+ "map": "dist/loaders.css.map",
31
+ "js": "dist/loaders.js",
32
+ "stats": "dist/stats/loaders.json",
33
+ "legacy": "primer-loaders/index.scss",
34
+ "imports": []
35
+ },
25
36
  "branch-name": {
26
37
  "name": "branch-name",
27
38
  "source": "src/branch-name/index.scss",
@@ -33,6 +44,28 @@
33
44
  "legacy": "primer-branch-name/index.scss",
34
45
  "imports": []
35
46
  },
47
+ "links": {
48
+ "name": "links",
49
+ "source": "src/links/index.scss",
50
+ "sass": "@primer/css/links/index.scss",
51
+ "css": "dist/links.css",
52
+ "map": "dist/links.css.map",
53
+ "js": "dist/links.js",
54
+ "stats": "dist/stats/links.json",
55
+ "legacy": "primer-links/index.scss",
56
+ "imports": []
57
+ },
58
+ "header": {
59
+ "name": "header",
60
+ "source": "src/header/index.scss",
61
+ "sass": "@primer/css/header/index.scss",
62
+ "css": "dist/header.css",
63
+ "map": "dist/header.css.map",
64
+ "js": "dist/header.js",
65
+ "stats": "dist/stats/header.json",
66
+ "legacy": "primer-header/index.scss",
67
+ "imports": []
68
+ },
36
69
  "blankslate": {
37
70
  "name": "blankslate",
38
71
  "source": "src/blankslate/index.scss",
@@ -55,15 +88,26 @@
55
88
  "legacy": "primer-alerts/index.scss",
56
89
  "imports": []
57
90
  },
58
- "loaders": {
59
- "name": "loaders",
60
- "source": "src/loaders/index.scss",
61
- "sass": "@primer/css/loaders/index.scss",
62
- "css": "dist/loaders.css",
63
- "map": "dist/loaders.css.map",
64
- "js": "dist/loaders.js",
65
- "stats": "dist/stats/loaders.json",
66
- "legacy": "primer-loaders/index.scss",
91
+ "dropdown": {
92
+ "name": "dropdown",
93
+ "source": "src/dropdown/index.scss",
94
+ "sass": "@primer/css/dropdown/index.scss",
95
+ "css": "dist/dropdown.css",
96
+ "map": "dist/dropdown.css.map",
97
+ "js": "dist/dropdown.js",
98
+ "stats": "dist/stats/dropdown.json",
99
+ "legacy": "primer-dropdown/index.scss",
100
+ "imports": []
101
+ },
102
+ "overlay": {
103
+ "name": "overlay",
104
+ "source": "src/overlay/index.scss",
105
+ "sass": "@primer/css/overlay/index.scss",
106
+ "css": "dist/overlay.css",
107
+ "map": "dist/overlay.css.map",
108
+ "js": "dist/overlay.js",
109
+ "stats": "dist/stats/overlay.json",
110
+ "legacy": "primer-overlay/index.scss",
67
111
  "imports": []
68
112
  },
69
113
  "progress": {
@@ -99,28 +143,6 @@
99
143
  "legacy": "primer-truncate/index.scss",
100
144
  "imports": []
101
145
  },
102
- "links": {
103
- "name": "links",
104
- "source": "src/links/index.scss",
105
- "sass": "@primer/css/links/index.scss",
106
- "css": "dist/links.css",
107
- "map": "dist/links.css.map",
108
- "js": "dist/links.js",
109
- "stats": "dist/stats/links.json",
110
- "legacy": "primer-links/index.scss",
111
- "imports": []
112
- },
113
- "header": {
114
- "name": "header",
115
- "source": "src/header/index.scss",
116
- "sass": "@primer/css/header/index.scss",
117
- "css": "dist/header.css",
118
- "map": "dist/header.css.map",
119
- "js": "dist/header.js",
120
- "stats": "dist/stats/header.json",
121
- "legacy": "primer-header/index.scss",
122
- "imports": []
123
- },
124
146
  "subhead": {
125
147
  "name": "subhead",
126
148
  "source": "src/subhead/index.scss",
@@ -176,39 +198,6 @@
176
198
  "legacy": "primer-popover/index.scss",
177
199
  "imports": []
178
200
  },
179
- "tooltips": {
180
- "name": "tooltips",
181
- "source": "src/tooltips/index.scss",
182
- "sass": "@primer/css/tooltips/index.scss",
183
- "css": "dist/tooltips.css",
184
- "map": "dist/tooltips.css.map",
185
- "js": "dist/tooltips.js",
186
- "stats": "dist/stats/tooltips.json",
187
- "legacy": "primer-tooltips/index.scss",
188
- "imports": []
189
- },
190
- "dropdown": {
191
- "name": "dropdown",
192
- "source": "src/dropdown/index.scss",
193
- "sass": "@primer/css/dropdown/index.scss",
194
- "css": "dist/dropdown.css",
195
- "map": "dist/dropdown.css.map",
196
- "js": "dist/dropdown.js",
197
- "stats": "dist/stats/dropdown.json",
198
- "legacy": "primer-dropdown/index.scss",
199
- "imports": []
200
- },
201
- "overlay": {
202
- "name": "overlay",
203
- "source": "src/overlay/index.scss",
204
- "sass": "@primer/css/overlay/index.scss",
205
- "css": "dist/overlay.css",
206
- "map": "dist/overlay.css.map",
207
- "js": "dist/overlay.js",
208
- "stats": "dist/stats/overlay.json",
209
- "legacy": "primer-overlay/index.scss",
210
- "imports": []
211
- },
212
201
  "select-menu": {
213
202
  "name": "select-menu",
214
203
  "source": "src/select-menu/index.scss",
@@ -220,6 +209,17 @@
220
209
  "legacy": "primer-select-menu/index.scss",
221
210
  "imports": []
222
211
  },
212
+ "tooltips": {
213
+ "name": "tooltips",
214
+ "source": "src/tooltips/index.scss",
215
+ "sass": "@primer/css/tooltips/index.scss",
216
+ "css": "dist/tooltips.css",
217
+ "map": "dist/tooltips.css.map",
218
+ "js": "dist/tooltips.js",
219
+ "stats": "dist/stats/tooltips.json",
220
+ "legacy": "primer-tooltips/index.scss",
221
+ "imports": []
222
+ },
223
223
  "marketing-support": {
224
224
  "name": "marketing-support",
225
225
  "source": "src/marketing/support/index.scss",
@@ -286,6 +286,17 @@
286
286
  "legacy": "primer-marketing-type/index.scss",
287
287
  "imports": []
288
288
  },
289
+ "app": {
290
+ "name": "app",
291
+ "source": "src/app/index.scss",
292
+ "sass": "@primer/css/app/index.scss",
293
+ "css": "dist/app.css",
294
+ "map": "dist/app.css.map",
295
+ "js": "dist/app.js",
296
+ "stats": "dist/stats/app.json",
297
+ "legacy": "primer-app/index.scss",
298
+ "imports": []
299
+ },
289
300
  "buttons": {
290
301
  "name": "buttons",
291
302
  "source": "src/buttons/index.scss",
@@ -341,17 +352,6 @@
341
352
  "legacy": "primer-labels/index.scss",
342
353
  "imports": []
343
354
  },
344
- "navigation": {
345
- "name": "navigation",
346
- "source": "src/navigation/index.scss",
347
- "sass": "@primer/css/navigation/index.scss",
348
- "css": "dist/navigation.css",
349
- "map": "dist/navigation.css.map",
350
- "js": "dist/navigation.js",
351
- "stats": "dist/stats/navigation.json",
352
- "legacy": "primer-navigation/index.scss",
353
- "imports": []
354
- },
355
355
  "forms": {
356
356
  "name": "forms",
357
357
  "source": "src/forms/index.scss",
@@ -374,6 +374,17 @@
374
374
  "legacy": "primer-layout/index.scss",
375
375
  "imports": []
376
376
  },
377
+ "navigation": {
378
+ "name": "navigation",
379
+ "source": "src/navigation/index.scss",
380
+ "sass": "@primer/css/navigation/index.scss",
381
+ "css": "dist/navigation.css",
382
+ "map": "dist/navigation.css.map",
383
+ "js": "dist/navigation.js",
384
+ "stats": "dist/stats/navigation.json",
385
+ "legacy": "primer-navigation/index.scss",
386
+ "imports": []
387
+ },
377
388
  "marketing-utilities": {
378
389
  "name": "marketing-utilities",
379
390
  "source": "src/marketing/utilities/index.scss",