@pnx-mixtape/mxds 0.0.7 → 0.0.8

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.
Files changed (79) hide show
  1. package/dist/build/accordion.css +108 -0
  2. package/dist/build/accordion.entry.js +139 -0
  3. package/dist/build/accordion.entry.js.map +1 -0
  4. package/dist/build/base.css +996 -0
  5. package/dist/build/breadcrumb.css +51 -0
  6. package/dist/build/button.css +132 -0
  7. package/dist/build/callout.css +11 -0
  8. package/dist/build/card.css +149 -0
  9. package/dist/build/chunks/disclosure-widget-CQLPJ8Ta.js +124 -0
  10. package/dist/build/chunks/disclosure-widget-CQLPJ8Ta.js.map +1 -0
  11. package/dist/build/chunks/drop-menu.entry-BC6x9vst.js +132 -0
  12. package/dist/build/chunks/drop-menu.entry-BC6x9vst.js.map +1 -0
  13. package/dist/build/chunks/keyboard-C73DHu0c.js +101 -0
  14. package/dist/build/chunks/keyboard-C73DHu0c.js.map +1 -0
  15. package/dist/build/chunks/polyfills-CJ5uTmUJ.js +749 -0
  16. package/dist/build/chunks/polyfills-CJ5uTmUJ.js.map +1 -0
  17. package/dist/build/chunks/popover-wbPSyFRj.js +654 -0
  18. package/dist/build/chunks/popover-wbPSyFRj.js.map +1 -0
  19. package/dist/build/chunks/utilities-B4YZb689.js +243 -0
  20. package/dist/build/chunks/utilities-B4YZb689.js.map +1 -0
  21. package/dist/build/constants.css +120 -0
  22. package/dist/build/container-grid.css +208 -0
  23. package/dist/build/content-block.css +36 -0
  24. package/dist/build/dialog.css +98 -0
  25. package/dist/build/dialog.entry.js +113 -0
  26. package/dist/build/dialog.entry.js.map +1 -0
  27. package/dist/build/drop-menu.css +78 -0
  28. package/dist/build/drop-menu.entry.js +2 -0
  29. package/dist/build/drop-menu.entry.js.map +1 -0
  30. package/dist/build/drupal.css +74 -0
  31. package/dist/build/footer.css +151 -0
  32. package/dist/build/form.css +517 -0
  33. package/dist/build/global-alert.css +60 -0
  34. package/dist/build/global-alert.entry.js +68 -0
  35. package/dist/build/global-alert.entry.js.map +1 -0
  36. package/dist/build/grid.css +200 -0
  37. package/dist/build/header.css +138 -0
  38. package/dist/build/header.entry.js +103 -0
  39. package/dist/build/header.entry.js.map +1 -0
  40. package/dist/build/hero-banner.css +62 -0
  41. package/dist/build/icon.css +399 -0
  42. package/dist/build/in-page-alert.css +94 -0
  43. package/dist/build/in-page-navigation.css +17 -0
  44. package/dist/build/in-page-navigation.entry.js +89 -0
  45. package/dist/build/in-page-navigation.entry.js.map +1 -0
  46. package/dist/build/link-list.css +72 -0
  47. package/dist/build/list-item.css +114 -0
  48. package/dist/build/masthead.css +30 -0
  49. package/dist/build/navigation.css +392 -0
  50. package/dist/build/navigation.entry.js +124 -0
  51. package/dist/build/navigation.entry.js.map +1 -0
  52. package/dist/build/page.css +80 -0
  53. package/dist/build/pagination.css +130 -0
  54. package/dist/build/section.css +163 -0
  55. package/dist/build/side-navigation.css +88 -0
  56. package/dist/build/sidebar.css +105 -0
  57. package/dist/build/social-links.css +20 -0
  58. package/dist/build/steps.css +118 -0
  59. package/dist/build/steps.entry.js +2 -0
  60. package/dist/build/steps.entry.js.map +1 -0
  61. package/dist/build/sticky.css +47 -0
  62. package/dist/build/sticky.entry.js +60 -0
  63. package/dist/build/sticky.entry.js.map +1 -0
  64. package/dist/build/tabs.css +109 -0
  65. package/dist/build/tabs.entry.js +202 -0
  66. package/dist/build/tabs.entry.js.map +1 -0
  67. package/dist/build/tag.css +67 -0
  68. package/dist/build/tiles.css +61 -0
  69. package/dist/build/utilities.css +178 -0
  70. package/package.json +2 -2
  71. package/src/Component/Card/Card.tsx +7 -7
  72. package/src/Component/Card/__snapshots__/Card.stories.ts.snap +1 -1
  73. package/src/Component/Card/__snapshots__/Card.stories.tsx.snap +5 -5
  74. package/src/Component/Card/card.css +3 -3
  75. package/src/Component/ContentBlock/ContentBlock.tsx +1 -1
  76. package/src/Component/ContentBlock/__snapshots__/ContentBlock.stories.tsx.snap +1 -1
  77. package/src/Component/ListItem/__snapshots__/ListItem.stories.ts.snap +1 -1
  78. package/src/Component/ListItem/list-item.css +1 -1
  79. package/src/Layout/Footer/Footer.stories.ts +1 -1
@@ -0,0 +1,200 @@
1
+ /**
2
+ * Dynamic Grid
3
+ */
4
+
5
+ @layer design-system.layouts {
6
+ .mx-grid {
7
+ --grid-repeat: auto-fit;
8
+ --grid-min: 20ch;
9
+
10
+ display: grid;
11
+ grid-template-columns: repeat(
12
+ auto-fit,
13
+ minmax(min(100%, 20ch), 1fr)
14
+ );
15
+ grid-template-columns: repeat(
16
+ var(--grid-repeat),
17
+ minmax(min(100%, var(--grid-min)), 1fr)
18
+ );
19
+ grid-template-rows: 1fr;
20
+ grid-gap: var(--grid-gap, var(--gap));
21
+ gap: var(--grid-gap, var(--gap));
22
+ }
23
+
24
+ @media (min-width: 946px) {
25
+ .mx-grid {
26
+ --grid-gap: var(--gap-l);
27
+ }
28
+ }
29
+
30
+ .mx-grid:is(ul, ol) {
31
+ list-style: none;
32
+ padding-inline-start: unset;
33
+ }
34
+
35
+ [class*="mx-grid--cols-"] {
36
+ --grid-repeat: 1;
37
+ }
38
+ @media (min-width: 420px) {
39
+
40
+ .mx-grid--cols-xs-2 {
41
+ --grid-repeat: 2;
42
+ }
43
+ }
44
+ @media (min-width: 540px) {
45
+
46
+ .mx-grid--cols-sm-2 {
47
+ --grid-repeat: 2;
48
+ }
49
+ }
50
+ @media (min-width: 720px) {
51
+
52
+ .mx-grid--cols-md-2 {
53
+ --grid-repeat: 2;
54
+ }
55
+ }
56
+ @media (min-width: 946px) {
57
+
58
+ .mx-grid--cols-lg-2 {
59
+ --grid-repeat: 2;
60
+ }
61
+ }
62
+ @media (min-width: 1100px) {
63
+
64
+ .mx-grid--cols-xl-2 {
65
+ --grid-repeat: 2;
66
+ }
67
+ }
68
+ @media (min-width: 720px) {
69
+
70
+ .mx-grid--cols-md-3 {
71
+ --grid-repeat: 3;
72
+ }
73
+ }
74
+ @media (min-width: 946px) {
75
+
76
+ .mx-grid--cols-lg-3 {
77
+ --grid-repeat: 3;
78
+ }
79
+ }
80
+ @media (min-width: 1100px) {
81
+
82
+ .mx-grid--cols-xl-3 {
83
+ --grid-repeat: 3;
84
+ }
85
+ }
86
+ @media (min-width: 720px) {
87
+
88
+ .mx-grid--cols-md-4 {
89
+ --grid-repeat: 4;
90
+ }
91
+ }
92
+ @media (min-width: 946px) {
93
+
94
+ .mx-grid--cols-lg-4 {
95
+ --grid-repeat: 4;
96
+ }
97
+ }
98
+ @media (min-width: 1100px) {
99
+
100
+ .mx-grid--cols-xl-4 {
101
+ --grid-repeat: 4;
102
+ }
103
+ }
104
+
105
+ .mx-grid--collapse {
106
+ --grid-gap: 0;
107
+ }
108
+
109
+ .mx-grid--collapse-cols {
110
+ grid-column-gap: 0;
111
+ }
112
+
113
+ .mx-grid--collapse-rows {
114
+ grid-row-gap: 0;
115
+ }
116
+ }
117
+
118
+ /**
119
+ * Grid items.
120
+ */
121
+ @layer design-system.layouts {
122
+ [class*="mx-grid-item__span-"] {
123
+ grid-column: auto / auto;
124
+ grid-column: auto / var(--grid-span, auto);
125
+ }
126
+ @media (min-width: 420px) {
127
+
128
+ .mx-grid-item__span-xs-2 {
129
+ --grid-span: span 2;
130
+ }
131
+ }
132
+ @media (min-width: 540px) {
133
+
134
+ .mx-grid-item__span-sm-2 {
135
+ --grid-span: span 2;
136
+ }
137
+ }
138
+ @media (min-width: 720px) {
139
+
140
+ .mx-grid-item__span-md-2 {
141
+ --grid-span: span 2;
142
+ }
143
+ }
144
+ @media (min-width: 946px) {
145
+
146
+ .mx-grid-item__span-lg-2 {
147
+ --grid-span: span 2;
148
+ }
149
+ }
150
+ @media (min-width: 1100px) {
151
+
152
+ .mx-grid-item__span-xl-2 {
153
+ --grid-span: span 2;
154
+ }
155
+ }
156
+ @media (min-width: 720px) {
157
+
158
+ .mx-grid-item__span-md-3 {
159
+ --grid-span: span 3;
160
+ }
161
+ }
162
+ @media (min-width: 946px) {
163
+
164
+ .mx-grid-item__span-lg-3 {
165
+ --grid-span: span 3;
166
+ }
167
+ }
168
+ @media (min-width: 1100px) {
169
+
170
+ .mx-grid-item__span-xl-3 {
171
+ --grid-span: span 3;
172
+ }
173
+ }
174
+ @media (min-width: 720px) {
175
+
176
+ .mx-grid-item__span-md-4 {
177
+ --grid-span: span 4;
178
+ }
179
+ }
180
+ @media (min-width: 946px) {
181
+
182
+ .mx-grid-item__span-lg-4 {
183
+ --grid-span: span 4;
184
+ }
185
+ }
186
+ @media (min-width: 1100px) {
187
+
188
+ .mx-grid-item__span-xl-4 {
189
+ --grid-span: span 4;
190
+ }
191
+ }
192
+ }
193
+
194
+ @media print {
195
+ .mx-grid {
196
+ display: block;
197
+ }
198
+ }
199
+
200
+ /*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImdyaWQuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztFQUVFOztBQUVGO0VBQ0U7SUFDRSx1QkFBdUI7SUFDdkIsZ0JBQWdCOztJQUVoQixhQUFhO0lBQ2I7OztLQUdDO0lBSEQ7OztLQUdDO0lBQ0QsdUJBQXVCO0lBQ3ZCLHFDQUFnQztJQUFoQyxnQ0FBZ0M7RUFVbEM7O0lBUkU7RUFaRjtNQWFJLHdCQUF3QjtFQU81QjtJQU5FOztJQUVBO01BQ0UsZ0JBQWdCO01BQ2hCLDJCQUEyQjtJQUM3Qjs7RUFHRjtJQUNFLGdCQUFnQjtFQUNsQjtJQUdFOztFQURGO01BRUksZ0JBQWdCO0VBRXBCO0lBREU7SUFJQTs7RUFERjtNQUVJLGdCQUFnQjtFQUVwQjtJQURFO0lBSUE7O0VBREY7TUFFSSxnQkFBZ0I7RUFFcEI7SUFERTtJQUlBOztFQURGO01BRUksZ0JBQWdCO0VBRXBCO0lBREU7SUFJQTs7RUFERjtNQUVJLGdCQUFnQjtFQUVwQjtJQURFO0lBSUE7O0VBREY7TUFFSSxnQkFBZ0I7RUFFcEI7SUFERTtJQUlBOztFQURGO01BRUksZ0JBQWdCO0VBRXBCO0lBREU7SUFJQTs7RUFERjtNQUVJLGdCQUFnQjtFQUVwQjtJQURFO0lBSUE7O0VBREY7TUFFSSxnQkFBZ0I7RUFFcEI7SUFERTtJQUlBOztFQURGO01BRUksZ0JBQWdCO0VBRXBCO0lBREU7SUFJQTs7RUFERjtNQUVJLGdCQUFnQjtFQUVwQjtJQURFOztFQUdGO0lBQ0UsYUFBYTtFQUNmOztFQUVBO0lBQ0Usa0JBQWtCO0VBQ3BCOztFQUVBO0lBQ0UsZUFBZTtFQUNqQjtBQUNGOztBQUVBOztFQUVFO0FBQ0Y7RUFDRTtJQUNFLHdCQUEwQztJQUExQywwQ0FBMEM7RUFDNUM7SUFHRTs7RUFERjtNQUVJLG1CQUFtQjtFQUV2QjtJQURFO0lBSUE7O0VBREY7TUFFSSxtQkFBbUI7RUFFdkI7SUFERTtJQUlBOztFQURGO01BRUksbUJBQW1CO0VBRXZCO0lBREU7SUFJQTs7RUFERjtNQUVJLG1CQUFtQjtFQUV2QjtJQURFO0lBSUE7O0VBREY7TUFFSSxtQkFBbUI7RUFFdkI7SUFERTtJQUlBOztFQURGO01BRUksbUJBQW1CO0VBRXZCO0lBREU7SUFJQTs7RUFERjtNQUVJLG1CQUFtQjtFQUV2QjtJQURFO0lBSUE7O0VBREY7TUFFSSxtQkFBbUI7RUFFdkI7SUFERTtJQUlBOztFQURGO01BRUksbUJBQW1CO0VBRXZCO0lBREU7SUFJQTs7RUFERjtNQUVJLG1CQUFtQjtFQUV2QjtJQURFO0lBSUE7O0VBREY7TUFFSSxtQkFBbUI7RUFFdkI7SUFERTtBQUVKOztBQUVBO0VBQ0U7SUFDRSxjQUFjO0VBQ2hCO0FBQ0YiLCJmaWxlIjoiZ3JpZC5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIER5bmFtaWMgR3JpZFxuICovXG5cbkBsYXllciBkZXNpZ24tc3lzdGVtLmxheW91dHMge1xuICAubXgtZ3JpZCB7XG4gICAgLS1ncmlkLXJlcGVhdDogYXV0by1maXQ7XG4gICAgLS1ncmlkLW1pbjogMjBjaDtcblxuICAgIGRpc3BsYXk6IGdyaWQ7XG4gICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiByZXBlYXQoXG4gICAgICB2YXIoLS1ncmlkLXJlcGVhdCksXG4gICAgICBtaW5tYXgobWluKDEwMCUsIHZhcigtLWdyaWQtbWluKSksIDFmcilcbiAgICApO1xuICAgIGdyaWQtdGVtcGxhdGUtcm93czogMWZyO1xuICAgIGdhcDogdmFyKC0tZ3JpZC1nYXAsIHZhcigtLWdhcCkpO1xuXG4gICAgQG1lZGlhICgtLWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtZ2FwOiB2YXIoLS1nYXAtbCk7XG4gICAgfVxuXG4gICAgJjppcyh1bCwgb2wpIHtcbiAgICAgIGxpc3Qtc3R5bGU6IG5vbmU7XG4gICAgICBwYWRkaW5nLWlubGluZS1zdGFydDogdW5zZXQ7XG4gICAgfVxuICB9XG5cbiAgW2NsYXNzKj1cIm14LWdyaWQtLWNvbHMtXCJdIHtcbiAgICAtLWdyaWQtcmVwZWF0OiAxO1xuICB9XG5cbiAgLm14LWdyaWQtLWNvbHMteHMtMiB7XG4gICAgQG1lZGlhICgtLXgtc21hbGwtdXApIHtcbiAgICAgIC0tZ3JpZC1yZXBlYXQ6IDI7XG4gICAgfVxuICB9XG5cbiAgLm14LWdyaWQtLWNvbHMtc20tMiB7XG4gICAgQG1lZGlhICgtLXNtYWxsLXVwKSB7XG4gICAgICAtLWdyaWQtcmVwZWF0OiAyO1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLS1jb2xzLW1kLTIge1xuICAgIEBtZWRpYSAoLS1tZWRpdW0tdXApIHtcbiAgICAgIC0tZ3JpZC1yZXBlYXQ6IDI7XG4gICAgfVxuICB9XG5cbiAgLm14LWdyaWQtLWNvbHMtbGctMiB7XG4gICAgQG1lZGlhICgtLWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtcmVwZWF0OiAyO1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLS1jb2xzLXhsLTIge1xuICAgIEBtZWRpYSAoLS14LWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtcmVwZWF0OiAyO1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLS1jb2xzLW1kLTMge1xuICAgIEBtZWRpYSAoLS1tZWRpdW0tdXApIHtcbiAgICAgIC0tZ3JpZC1yZXBlYXQ6IDM7XG4gICAgfVxuICB9XG5cbiAgLm14LWdyaWQtLWNvbHMtbGctMyB7XG4gICAgQG1lZGlhICgtLWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtcmVwZWF0OiAzO1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLS1jb2xzLXhsLTMge1xuICAgIEBtZWRpYSAoLS14LWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtcmVwZWF0OiAzO1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLS1jb2xzLW1kLTQge1xuICAgIEBtZWRpYSAoLS1tZWRpdW0tdXApIHtcbiAgICAgIC0tZ3JpZC1yZXBlYXQ6IDQ7XG4gICAgfVxuICB9XG5cbiAgLm14LWdyaWQtLWNvbHMtbGctNCB7XG4gICAgQG1lZGlhICgtLWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtcmVwZWF0OiA0O1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLS1jb2xzLXhsLTQge1xuICAgIEBtZWRpYSAoLS14LWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtcmVwZWF0OiA0O1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLS1jb2xsYXBzZSB7XG4gICAgLS1ncmlkLWdhcDogMDtcbiAgfVxuXG4gIC5teC1ncmlkLS1jb2xsYXBzZS1jb2xzIHtcbiAgICBncmlkLWNvbHVtbi1nYXA6IDA7XG4gIH1cblxuICAubXgtZ3JpZC0tY29sbGFwc2Utcm93cyB7XG4gICAgZ3JpZC1yb3ctZ2FwOiAwO1xuICB9XG59XG5cbi8qKlxuICogR3JpZCBpdGVtcy5cbiAqL1xuQGxheWVyIGRlc2lnbi1zeXN0ZW0ubGF5b3V0cyB7XG4gIFtjbGFzcyo9XCJteC1ncmlkLWl0ZW1fX3NwYW4tXCJdIHtcbiAgICBncmlkLWNvbHVtbjogYXV0byAvIHZhcigtLWdyaWQtc3BhbiwgYXV0byk7XG4gIH1cblxuICAubXgtZ3JpZC1pdGVtX19zcGFuLXhzLTIge1xuICAgIEBtZWRpYSAoLS14LXNtYWxsLXVwKSB7XG4gICAgICAtLWdyaWQtc3Bhbjogc3BhbiAyO1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLWl0ZW1fX3NwYW4tc20tMiB7XG4gICAgQG1lZGlhICgtLXNtYWxsLXVwKSB7XG4gICAgICAtLWdyaWQtc3Bhbjogc3BhbiAyO1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLWl0ZW1fX3NwYW4tbWQtMiB7XG4gICAgQG1lZGlhICgtLW1lZGl1bS11cCkge1xuICAgICAgLS1ncmlkLXNwYW46IHNwYW4gMjtcbiAgICB9XG4gIH1cblxuICAubXgtZ3JpZC1pdGVtX19zcGFuLWxnLTIge1xuICAgIEBtZWRpYSAoLS1sYXJnZS11cCkge1xuICAgICAgLS1ncmlkLXNwYW46IHNwYW4gMjtcbiAgICB9XG4gIH1cblxuICAubXgtZ3JpZC1pdGVtX19zcGFuLXhsLTIge1xuICAgIEBtZWRpYSAoLS14LWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtc3Bhbjogc3BhbiAyO1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLWl0ZW1fX3NwYW4tbWQtMyB7XG4gICAgQG1lZGlhICgtLW1lZGl1bS11cCkge1xuICAgICAgLS1ncmlkLXNwYW46IHNwYW4gMztcbiAgICB9XG4gIH1cblxuICAubXgtZ3JpZC1pdGVtX19zcGFuLWxnLTMge1xuICAgIEBtZWRpYSAoLS1sYXJnZS11cCkge1xuICAgICAgLS1ncmlkLXNwYW46IHNwYW4gMztcbiAgICB9XG4gIH1cblxuICAubXgtZ3JpZC1pdGVtX19zcGFuLXhsLTMge1xuICAgIEBtZWRpYSAoLS14LWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtc3Bhbjogc3BhbiAzO1xuICAgIH1cbiAgfVxuXG4gIC5teC1ncmlkLWl0ZW1fX3NwYW4tbWQtNCB7XG4gICAgQG1lZGlhICgtLW1lZGl1bS11cCkge1xuICAgICAgLS1ncmlkLXNwYW46IHNwYW4gNDtcbiAgICB9XG4gIH1cblxuICAubXgtZ3JpZC1pdGVtX19zcGFuLWxnLTQge1xuICAgIEBtZWRpYSAoLS1sYXJnZS11cCkge1xuICAgICAgLS1ncmlkLXNwYW46IHNwYW4gNDtcbiAgICB9XG4gIH1cblxuICAubXgtZ3JpZC1pdGVtX19zcGFuLXhsLTQge1xuICAgIEBtZWRpYSAoLS14LWxhcmdlLXVwKSB7XG4gICAgICAtLWdyaWQtc3Bhbjogc3BhbiA0O1xuICAgIH1cbiAgfVxufVxuXG5AbWVkaWEgcHJpbnQge1xuICAubXgtZ3JpZCB7XG4gICAgZGlzcGxheTogYmxvY2s7XG4gIH1cbn1cbiJdfQ== */
@@ -0,0 +1,138 @@
1
+ /**
2
+ * Global Header
3
+ */
4
+
5
+ @layer design-system.layouts {
6
+ .mx-header__toggles {
7
+ display: flex;
8
+ gap: var(--toggle-gap, var(--spacing-xs));
9
+ padding-inline-end: 0.125rem;
10
+ position: relative;
11
+ z-index: 1;
12
+ }
13
+
14
+ @media (min-width: 720px) {
15
+ .mx-header__toggles {
16
+ display: none;
17
+ }
18
+ }
19
+
20
+ .mx-header__toggles .mx-button--secondary {
21
+ border-color: transparent;
22
+ }
23
+
24
+ .mx-header__toggles [hidden] {
25
+ display: none;
26
+ }
27
+ @media (max-width: 719.98px) {
28
+
29
+ .global-nav-up-only {
30
+ display: none;
31
+ }
32
+ }
33
+ }
34
+
35
+ /**
36
+ * Primary Header
37
+ */
38
+
39
+ @layer design-system.layouts {
40
+ .mx-header__inner {
41
+ position: relative;
42
+ display: grid;
43
+ grid-template-columns: 1fr auto;
44
+ }
45
+
46
+ .mx-header__brand {
47
+ display: flex;
48
+ gap: var(--brand-gap, var(--gap));
49
+ align-items: center;
50
+ margin-inline-end: auto;
51
+ }
52
+
53
+ .mx-header__name {
54
+ display: grid;
55
+ }
56
+
57
+ .mx-header__main {
58
+ display: flex;
59
+ gap: var(--main-gap, var(--gap));
60
+ align-items: center;
61
+ }
62
+
63
+ .mx-header__nav {
64
+ inline-size: 100%;
65
+ transition:
66
+ 0.2s opacity var(--ease),
67
+ 0.2s visibility var(--ease);
68
+ }
69
+
70
+ @media (min-width: 720px) {
71
+
72
+ .mx-header__nav {
73
+ z-index: 2;
74
+ position: relative;
75
+ inline-size: auto;
76
+ block-size: auto;
77
+ }
78
+ }
79
+
80
+ .mx-header__nav[inert] {
81
+ block-size: 0;
82
+ opacity: 0;
83
+ visibility: hidden;
84
+ transition:
85
+ 0.2s opacity var(--ease),
86
+ 0.2s visibility var(--ease);
87
+ }
88
+
89
+ .mx-header__search {
90
+ position: absolute;
91
+ inset-block-start: 2px;
92
+ inset-inline-start: 0;
93
+ inline-size: 100%;
94
+ transition:
95
+ 0.2s opacity var(--ease),
96
+ 0.2s visibility var(--ease);
97
+ }
98
+
99
+ @media (min-width: 720px) {
100
+
101
+ .mx-header__search {
102
+ display: flex;
103
+ position: relative;
104
+ inline-size: auto;
105
+ }
106
+ }
107
+
108
+ .mx-header__search[inert] {
109
+ opacity: 0;
110
+ visibility: hidden;
111
+ transition:
112
+ 0.2s opacity var(--ease),
113
+ 0.2s visibility var(--ease);
114
+ }
115
+
116
+ .mx-header__search input {
117
+ max-inline-size: 150px;
118
+ }
119
+
120
+ /**
121
+ * Primary Header Stacked
122
+ */
123
+ .mx-header__nav-inner {
124
+ display: flex;
125
+ }
126
+
127
+ .mx-header__nav-right {
128
+ margin-inline-start: auto;
129
+ }
130
+ }
131
+
132
+ @media print {
133
+ .mx-header .mx-header__nav {
134
+ display: none;
135
+ }
136
+ }
137
+
138
+ /*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIl90b2dnbGVzLmNzcyIsIl9oZWFkZXIuY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztFQUVFOztBQUVGO0VBQ0U7SUFDRSxhQUFhO0lBQ2IseUNBQXlDO0lBQ3pDLDRCQUF1QjtJQUN2QixrQkFBa0I7SUFDbEIsVUFBVTtFQWFaOztJQVhFO0VBUEY7TUFRSSxhQUFhO0VBVWpCO0lBVEU7O0lBRUE7TUFDRSx5QkFBeUI7SUFDM0I7O0lBRUE7TUFDRSxhQUFhO0lBQ2Y7SUFJQTs7RUFERjtNQUVJLGFBQWE7RUFFakI7SUFERTtBQUVKOztBQzlCQTs7RUFFRTs7QUFFRjtFQUNFO0lBQ0Usa0JBQWtCO0lBQ2xCLGFBQWE7SUFDYiwrQkFBK0I7RUFDakM7O0VBRUE7SUFDRSxhQUFhO0lBQ2IsaUNBQWlDO0lBQ2pDLG1CQUFtQjtJQUNuQix1QkFBdUI7RUFDekI7O0VBRUE7SUFDRSxhQUFhO0VBQ2Y7O0VBRUE7SUFDRSxhQUFhO0lBQ2IsZ0NBQWdDO0lBQ2hDLG1CQUFtQjtFQUNyQjs7RUFFQTtJQUNFLGlCQUFpQjtJQUNqQjs7aUNBRTZCO0VBaUIvQjs7SUFmRTs7RUFORjtNQU9JLFVBQVU7TUFDVixrQkFBa0I7TUFDbEIsaUJBQWlCO01BQ2pCLGdCQUFnQjtFQVdwQjtJQVZFOztJQUVBO01BQ0UsYUFBYTtNQUNiLFVBQVU7TUFDVixrQkFBa0I7TUFDbEI7O21DQUU2QjtJQUMvQjs7RUFHRjtJQUNFLGtCQUFrQjtJQUNsQixzQkFBc0I7SUFDdEIscUJBQXFCO0lBQ3JCLGlCQUFpQjtJQUNqQjs7aUNBRTZCO0VBbUIvQjs7SUFqQkU7O0VBVEY7TUFVSSxhQUFhO01BQ2Isa0JBQWtCO01BQ2xCLGlCQUFpQjtFQWNyQjtJQWJFOztJQUVBO01BQ0UsVUFBVTtNQUNWLGtCQUFrQjtNQUNsQjs7bUNBRTZCO0lBQy9COztJQUVBO01BQ0Usc0JBQXNCO0lBQ3hCOztFQUdGOztJQUVFO0VBQ0Y7SUFDRSxhQUFhO0VBQ2Y7O0VBRUE7SUFDRSx5QkFBeUI7RUFDM0I7QUFDRjs7QUFFQTtFQUNFO0lBQ0UsYUFBYTtFQUNmO0FBQ0YiLCJmaWxlIjoiaGVhZGVyLmNzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogR2xvYmFsIEhlYWRlclxuICovXG5cbkBsYXllciBkZXNpZ24tc3lzdGVtLmxheW91dHMge1xuICAubXgtaGVhZGVyX190b2dnbGVzIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGdhcDogdmFyKC0tdG9nZ2xlLWdhcCwgdmFyKC0tc3BhY2luZy14cykpO1xuICAgIHBhZGRpbmctaW5saW5lLWVuZDogMnB4O1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICB6LWluZGV4OiAxO1xuXG4gICAgQG1lZGlhICgtLWdsb2JhbC1uYXYtdXApIHtcbiAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgfVxuXG4gICAgJiAubXgtYnV0dG9uLS1zZWNvbmRhcnkge1xuICAgICAgYm9yZGVyLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgICB9XG5cbiAgICAmIFtoaWRkZW5dIHtcbiAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgfVxuICB9XG5cbiAgLmdsb2JhbC1uYXYtdXAtb25seSB7XG4gICAgQG1lZGlhICgtLWdsb2JhbC1uYXYtZG93bikge1xuICAgICAgZGlzcGxheTogbm9uZTtcbiAgICB9XG4gIH1cbn1cbiIsIi8qKlxuICogUHJpbWFyeSBIZWFkZXJcbiAqL1xuXG5AbGF5ZXIgZGVzaWduLXN5c3RlbS5sYXlvdXRzIHtcbiAgLm14LWhlYWRlcl9faW5uZXIge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBkaXNwbGF5OiBncmlkO1xuICAgIGdyaWQtdGVtcGxhdGUtY29sdW1uczogMWZyIGF1dG87XG4gIH1cblxuICAubXgtaGVhZGVyX19icmFuZCB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgICBnYXA6IHZhcigtLWJyYW5kLWdhcCwgdmFyKC0tZ2FwKSk7XG4gICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICBtYXJnaW4taW5saW5lLWVuZDogYXV0bztcbiAgfVxuXG4gIC5teC1oZWFkZXJfX25hbWUge1xuICAgIGRpc3BsYXk6IGdyaWQ7XG4gIH1cblxuICAubXgtaGVhZGVyX19tYWluIHtcbiAgICBkaXNwbGF5OiBmbGV4O1xuICAgIGdhcDogdmFyKC0tbWFpbi1nYXAsIHZhcigtLWdhcCkpO1xuICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIH1cblxuICAubXgtaGVhZGVyX19uYXYge1xuICAgIGlubGluZS1zaXplOiAxMDAlO1xuICAgIHRyYW5zaXRpb246XG4gICAgICAwLjJzIG9wYWNpdHkgdmFyKC0tZWFzZSksXG4gICAgICAwLjJzIHZpc2liaWxpdHkgdmFyKC0tZWFzZSk7XG5cbiAgICBAbWVkaWEgKC0tZ2xvYmFsLW5hdi11cCkge1xuICAgICAgei1pbmRleDogMjtcbiAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgIGlubGluZS1zaXplOiBhdXRvO1xuICAgICAgYmxvY2stc2l6ZTogYXV0bztcbiAgICB9XG5cbiAgICAmW2luZXJ0XSB7XG4gICAgICBibG9jay1zaXplOiAwO1xuICAgICAgb3BhY2l0eTogMDtcbiAgICAgIHZpc2liaWxpdHk6IGhpZGRlbjtcbiAgICAgIHRyYW5zaXRpb246XG4gICAgICAgIDAuMnMgb3BhY2l0eSB2YXIoLS1lYXNlKSxcbiAgICAgICAgMC4ycyB2aXNpYmlsaXR5IHZhcigtLWVhc2UpO1xuICAgIH1cbiAgfVxuXG4gIC5teC1oZWFkZXJfX3NlYXJjaCB7XG4gICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgIGluc2V0LWJsb2NrLXN0YXJ0OiAycHg7XG4gICAgaW5zZXQtaW5saW5lLXN0YXJ0OiAwO1xuICAgIGlubGluZS1zaXplOiAxMDAlO1xuICAgIHRyYW5zaXRpb246XG4gICAgICAwLjJzIG9wYWNpdHkgdmFyKC0tZWFzZSksXG4gICAgICAwLjJzIHZpc2liaWxpdHkgdmFyKC0tZWFzZSk7XG5cbiAgICBAbWVkaWEgKC0tZ2xvYmFsLW5hdi11cCkge1xuICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgIGlubGluZS1zaXplOiBhdXRvO1xuICAgIH1cblxuICAgICZbaW5lcnRdIHtcbiAgICAgIG9wYWNpdHk6IDA7XG4gICAgICB2aXNpYmlsaXR5OiBoaWRkZW47XG4gICAgICB0cmFuc2l0aW9uOlxuICAgICAgICAwLjJzIG9wYWNpdHkgdmFyKC0tZWFzZSksXG4gICAgICAgIDAuMnMgdmlzaWJpbGl0eSB2YXIoLS1lYXNlKTtcbiAgICB9XG5cbiAgICAmIGlucHV0IHtcbiAgICAgIG1heC1pbmxpbmUtc2l6ZTogMTUwcHg7XG4gICAgfVxuICB9XG5cbiAgLyoqXG4gICAqIFByaW1hcnkgSGVhZGVyIFN0YWNrZWRcbiAgICovXG4gIC5teC1oZWFkZXJfX25hdi1pbm5lciB7XG4gICAgZGlzcGxheTogZmxleDtcbiAgfVxuXG4gIC5teC1oZWFkZXJfX25hdi1yaWdodCB7XG4gICAgbWFyZ2luLWlubGluZS1zdGFydDogYXV0bztcbiAgfVxufVxuXG5AbWVkaWEgcHJpbnQge1xuICAubXgtaGVhZGVyIC5teC1oZWFkZXJfX25hdiB7XG4gICAgZGlzcGxheTogbm9uZTtcbiAgfVxufVxuIl19 */
@@ -0,0 +1,103 @@
1
+ import { D as DisclosureWidget } from "./chunks/disclosure-widget-CQLPJ8Ta.js";
2
+ import "./chunks/utilities-B4YZb689.js";
3
+ class GlobalToggle extends HTMLElement {
4
+ constructor() {
5
+ super();
6
+ this.closeIconClass = "icon--close";
7
+ this.menuIconClass = "icon--menu";
8
+ this.searchIconClass = "icon--search";
9
+ this.handleBreakpoint = ({
10
+ matches
11
+ }) => {
12
+ if (!this.trigger) return;
13
+ const { signal } = this.controller;
14
+ if (matches) {
15
+ this.widget.attach();
16
+ this.target.setAttribute("inert", "");
17
+ this.trigger.addEventListener(
18
+ "disclosure-toggle",
19
+ this.handleDisclosure,
20
+ { signal }
21
+ );
22
+ } else {
23
+ this.widget.detach();
24
+ this.target.removeAttribute("inert");
25
+ this.trigger.removeEventListener(
26
+ "disclosure-toggle",
27
+ this.handleDisclosure
28
+ );
29
+ }
30
+ };
31
+ this.handleDisclosure = ({ detail }) => {
32
+ const { isOpen } = detail;
33
+ const origText = !isOpen ? "Close" : "Open";
34
+ const replaceText = !isOpen ? "Open" : "Close";
35
+ this.trigger.textContent = this.triggerText.replace(origText, replaceText);
36
+ const isSearch = this.controls === "primary-search";
37
+ if (isSearch) this.handleSearchDisclosure(isOpen);
38
+ this.trigger.classList.toggle(
39
+ isSearch ? this.searchIconClass : this.menuIconClass
40
+ );
41
+ this.trigger.classList.toggle(this.closeIconClass);
42
+ };
43
+ this.handleSearchDisclosure = (isOpen) => {
44
+ if (this.hideMenu) {
45
+ const menuTrigger = document.querySelector(`.${this.menuIconClass}`);
46
+ menuTrigger.toggleAttribute("hidden");
47
+ }
48
+ if (!isOpen) {
49
+ this.trigger.focus();
50
+ } else {
51
+ this.target.querySelector("input")?.focus();
52
+ }
53
+ };
54
+ this.internals_ = this.attachInternals();
55
+ this.controller = new AbortController();
56
+ this.mq = this.getAttribute("mq") || "(max-width: 720px)";
57
+ }
58
+ connectedCallback() {
59
+ if (!this.trigger || !this.target) return;
60
+ this.target?.setAttribute("role", "region");
61
+ this.widget = new DisclosureWidget(this.trigger, this.target);
62
+ this.widget.init();
63
+ const { signal } = this.controller;
64
+ this.handleBreakpoint(this.breakpoint);
65
+ this.breakpoint.addEventListener("change", this.handleBreakpoint, {
66
+ signal
67
+ });
68
+ }
69
+ disconnectedCallback() {
70
+ this.widget.detach();
71
+ this.controller.abort();
72
+ }
73
+ get trigger() {
74
+ const trigger = this.querySelector(":scope > button");
75
+ const controls = trigger.getAttribute("aria-controls");
76
+ if (!trigger || !controls) {
77
+ throw new Error(
78
+ `${this.localName} must contain a <button aria-controls="element-to-trigger"> element.`
79
+ );
80
+ }
81
+ trigger.removeAttribute("disabled");
82
+ this.controls = controls;
83
+ this.triggerText = trigger.textContent;
84
+ return trigger;
85
+ }
86
+ get target() {
87
+ const target = document.querySelector(
88
+ `div[id="${this.controls}"]`
89
+ );
90
+ if (!target) {
91
+ throw new Error(
92
+ `${this.localName} must contain a target <div id="${this.controls}">.`
93
+ );
94
+ }
95
+ target.classList.remove("global-nav-up-only");
96
+ return target;
97
+ }
98
+ get breakpoint() {
99
+ return window.matchMedia(this.mq);
100
+ }
101
+ }
102
+ customElements.define("mx-global-toggle", GlobalToggle);
103
+ //# sourceMappingURL=header.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"header.entry.js","sources":["../../src/Layout/Header/Elements/GlobalToggle.ts"],"sourcesContent":["/**\n * Header\n * @file Handle accessible trigger of menus on small screens.\n */\n\nimport {\n DisclosureWidget,\n DisclosureWidgetEvent,\n} from \"../../../Utility/utilities\"\n\nexport default class GlobalToggle extends HTMLElement {\n internals_: ElementInternals\n controller: AbortController\n widget!: DisclosureWidget\n controls?: string\n mq: string\n triggerText: string\n closeIconClass: string = \"icon--close\"\n menuIconClass: string = \"icon--menu\"\n searchIconClass: string = \"icon--search\"\n hideMenu: boolean\n\n constructor() {\n super()\n this.internals_ = this.attachInternals()\n this.controller = new AbortController()\n this.mq = this.getAttribute(\"mq\") || \"(max-width: 720px)\"\n }\n\n connectedCallback(): void {\n if (!this.trigger || !this.target) return\n\n this.target?.setAttribute(\"role\", \"region\")\n this.widget = new DisclosureWidget(this.trigger, this.target)\n this.widget.init()\n const { signal }: AbortController = this.controller\n this.handleBreakpoint(this.breakpoint)\n this.breakpoint.addEventListener(\"change\", this.handleBreakpoint, {\n signal,\n })\n }\n\n disconnectedCallback(): void {\n this.widget.detach()\n this.controller.abort()\n }\n\n handleBreakpoint = ({\n matches,\n }: MediaQueryList | MediaQueryListEvent): void => {\n if (!this.trigger) return\n const { signal }: AbortController = this.controller\n if (matches) {\n this.widget.attach()\n this.target.setAttribute(\"inert\", \"\")\n this.trigger.addEventListener(\n \"disclosure-toggle\",\n this.handleDisclosure,\n { signal },\n )\n } else {\n this.widget.detach()\n this.target.removeAttribute(\"inert\")\n this.trigger.removeEventListener(\n \"disclosure-toggle\",\n this.handleDisclosure,\n )\n }\n }\n\n handleDisclosure = ({ detail }: CustomEvent<DisclosureWidgetEvent>): void => {\n const { isOpen } = detail\n // Toggle toggle text.\n const origText = !isOpen ? \"Close\" : \"Open\"\n const replaceText = !isOpen ? \"Open\" : \"Close\"\n this.trigger.textContent = this.triggerText.replace(origText, replaceText)\n\n // Search is a little different.\n const isSearch = this.controls === \"primary-search\"\n if (isSearch) this.handleSearchDisclosure(isOpen)\n\n // Toggle trigger classes.\n this.trigger.classList.toggle(\n isSearch ? this.searchIconClass : this.menuIconClass,\n )\n this.trigger.classList.toggle(this.closeIconClass)\n }\n\n handleSearchDisclosure = (isOpen?: boolean): void => {\n if (this.hideMenu) {\n // Search trigger should hide the menu trigger.\n const menuTrigger = document.querySelector(`.${this.menuIconClass}`)\n menuTrigger.toggleAttribute(\"hidden\")\n }\n // Shift focus between search input and trigger.\n if (!isOpen) {\n this.trigger.focus()\n } else {\n this.target.querySelector(\"input\")?.focus()\n }\n }\n\n get trigger(): HTMLButtonElement {\n const trigger: HTMLButtonElement | null =\n this.querySelector(\":scope > button\")\n const controls = trigger.getAttribute(\"aria-controls\")\n if (!trigger || !controls) {\n throw new Error(\n `${this.localName} must contain a <button aria-controls=\"element-to-trigger\"> element.`,\n )\n }\n trigger.removeAttribute(\"disabled\")\n this.controls = controls\n this.triggerText = trigger.textContent\n return trigger\n }\n\n get target(): HTMLDivElement {\n const target: HTMLDivElement | null = document.querySelector(\n `div[id=\"${this.controls}\"]`,\n )\n if (!target) {\n throw new Error(\n `${this.localName} must contain a target <div id=\"${this.controls}\">.`,\n )\n }\n target.classList.remove(\"global-nav-up-only\")\n return target\n }\n\n get breakpoint(): MediaQueryList {\n return window.matchMedia(this.mq)\n }\n}\n\ncustomElements.define(\"mx-global-toggle\", GlobalToggle)\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"mx-trigger\": GlobalToggle\n }\n}\n"],"names":[],"mappings":"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"}
@@ -0,0 +1,62 @@
1
+ /**
2
+ * Page Title
3
+ */
4
+
5
+ @layer design-system.components {
6
+ .mx-hero-banner {
7
+ position: relative;
8
+ z-index: 1;
9
+ }
10
+
11
+ .mx-hero-banner.mx-hero-banner--hero {
12
+ min-block-size: 400px;
13
+ min-block-size: var(--hero-height, 400px);
14
+ align-content: center;
15
+ justify-content: center;
16
+ place-content: center;
17
+ }
18
+
19
+ .mx-hero-banner :is(h1, h2, p) {
20
+ max-inline-size: var(--container-max-width-narrow);
21
+ text-wrap: balance;
22
+ }
23
+
24
+ .mx-hero-banner__inner {
25
+ display: grid;
26
+ grid-template-areas: "content" "aside";
27
+ }
28
+
29
+ @media (min-width: 946px) {
30
+
31
+ .mx-hero-banner__inner {
32
+ grid-template-areas: "content aside";
33
+ grid-template-columns: 50% 50%;
34
+ grid-template-columns: var(--hero-columns, 50% 50%);
35
+ }
36
+ }
37
+
38
+ .mx-hero-banner__content {
39
+ align-content: center;
40
+ }
41
+
42
+ .mx-hero-banner__aside {
43
+ align-content: center;
44
+ }
45
+
46
+ .mx-hero-banner__aside.mx-hero-banner__aside-image {
47
+ overflow: hidden;
48
+ position: relative;
49
+ border-radius: var(--hero-image-radius, var(--border-radius));
50
+ }
51
+
52
+ .mx-hero-banner__aside img {
53
+ inline-size: 100%;
54
+ block-size: 100%;
55
+ -o-object-fit: cover;
56
+ object-fit: cover;
57
+ -o-object-position: center;
58
+ object-position: center;
59
+ }
60
+ }
61
+
62
+ /*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImhlcm8tYmFubmVyLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7RUFFRTs7QUFFRjtFQUNFO0lBQ0Usa0JBQWtCO0lBQ2xCLFVBQVU7RUFXWjs7SUFURTtNQUNFLHFCQUF5QztNQUF6Qyx5Q0FBeUM7TUFDekMscUJBQXFCO01BQXJCLHVCQUFxQjtNQUFyQixxQkFBcUI7SUFDdkI7O0lBRUE7TUFDRSxrREFBa0Q7TUFDbEQsa0JBQWtCO0lBQ3BCOztFQUdGO0lBQ0UsYUFBYTtJQUNiLHNDQUFzQztFQU14Qzs7SUFKRTs7RUFKRjtNQUtJLG9DQUFvQztNQUNwQyw4QkFBbUQ7TUFBbkQsbURBQW1EO0VBRXZEO0lBREU7O0VBR0Y7SUFDRSxxQkFBcUI7RUFDdkI7O0VBRUE7SUFDRSxxQkFBcUI7RUFjdkI7O0lBWkU7TUFDRSxnQkFBZ0I7TUFDaEIsa0JBQWtCO01BQ2xCLDZEQUE2RDtJQUMvRDs7SUFFQTtNQUNFLGlCQUFpQjtNQUNqQixnQkFBZ0I7TUFDaEIsb0JBQWlCO1NBQWpCLGlCQUFpQjtNQUNqQiwwQkFBdUI7U0FBdkIsdUJBQXVCO0lBQ3pCO0FBRUoiLCJmaWxlIjoiaGVyby1iYW5uZXIuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBQYWdlIFRpdGxlXG4gKi9cblxuQGxheWVyIGRlc2lnbi1zeXN0ZW0uY29tcG9uZW50cyB7XG4gIC5teC1oZXJvLWJhbm5lciB7XG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIHotaW5kZXg6IDE7XG5cbiAgICAmLm14LWhlcm8tYmFubmVyLS1oZXJvIHtcbiAgICAgIG1pbi1ibG9jay1zaXplOiB2YXIoLS1oZXJvLWhlaWdodCwgNDAwcHgpO1xuICAgICAgcGxhY2UtY29udGVudDogY2VudGVyO1xuICAgIH1cblxuICAgICYgOmlzKGgxLCBoMiwgcCkge1xuICAgICAgbWF4LWlubGluZS1zaXplOiB2YXIoLS1jb250YWluZXItbWF4LXdpZHRoLW5hcnJvdyk7XG4gICAgICB0ZXh0LXdyYXA6IGJhbGFuY2U7XG4gICAgfVxuICB9XG5cbiAgLm14LWhlcm8tYmFubmVyX19pbm5lciB7XG4gICAgZGlzcGxheTogZ3JpZDtcbiAgICBncmlkLXRlbXBsYXRlLWFyZWFzOiBcImNvbnRlbnRcIiBcImFzaWRlXCI7XG5cbiAgICBAbWVkaWEgKC0tbGFyZ2UtdXApIHtcbiAgICAgIGdyaWQtdGVtcGxhdGUtYXJlYXM6IFwiY29udGVudCBhc2lkZVwiO1xuICAgICAgZ3JpZC10ZW1wbGF0ZS1jb2x1bW5zOiB2YXIoLS1oZXJvLWNvbHVtbnMsIDUwJSA1MCUpO1xuICAgIH1cbiAgfVxuXG4gIC5teC1oZXJvLWJhbm5lcl9fY29udGVudCB7XG4gICAgYWxpZ24tY29udGVudDogY2VudGVyO1xuICB9XG5cbiAgLm14LWhlcm8tYmFubmVyX19hc2lkZSB7XG4gICAgYWxpZ24tY29udGVudDogY2VudGVyO1xuXG4gICAgJi5teC1oZXJvLWJhbm5lcl9fYXNpZGUtaW1hZ2Uge1xuICAgICAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgIGJvcmRlci1yYWRpdXM6IHZhcigtLWhlcm8taW1hZ2UtcmFkaXVzLCB2YXIoLS1ib3JkZXItcmFkaXVzKSk7XG4gICAgfVxuXG4gICAgJiBpbWcge1xuICAgICAgaW5saW5lLXNpemU6IDEwMCU7XG4gICAgICBibG9jay1zaXplOiAxMDAlO1xuICAgICAgb2JqZWN0LWZpdDogY292ZXI7XG4gICAgICBvYmplY3QtcG9zaXRpb246IGNlbnRlcjtcbiAgICB9XG4gIH1cbn1cbiJdfQ== */