@penn-libraries/web 1.2.0-dev.1 → 1.2.0

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 (53) hide show
  1. package/dist/cjs/loader.cjs.js +1 -1
  2. package/dist/cjs/pennlibs-autocomplete.cjs.entry.js +281 -0
  3. package/dist/cjs/pennlibs-autocomplete.entry.cjs.js.map +1 -0
  4. package/dist/cjs/pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.cjs.js.map +1 -0
  5. package/dist/cjs/{pennlibs-autocomplete_4.cjs.entry.js → pennlibs-feedback_3.cjs.entry.js} +33 -301
  6. package/dist/cjs/web.cjs.js +1 -1
  7. package/dist/collection/components/pennlibs-feedback/pennlibs-feedback.css +22 -1
  8. package/dist/collection/components/pennlibs-feedback/pennlibs-feedback.js +25 -21
  9. package/dist/collection/components/pennlibs-feedback/pennlibs-feedback.js.map +1 -1
  10. package/dist/collection/components/pennlibs-footer/pennlibs-footer.css +12 -3
  11. package/dist/collection/components/pennlibs-footer/pennlibs-footer.js +33 -3
  12. package/dist/collection/components/pennlibs-footer/pennlibs-footer.js.map +1 -1
  13. package/dist/components/pennlibs-feedback.js +26 -22
  14. package/dist/components/pennlibs-feedback.js.map +1 -1
  15. package/dist/components/pennlibs-footer.js +9 -4
  16. package/dist/components/pennlibs-footer.js.map +1 -1
  17. package/dist/docs.json +32 -2
  18. package/dist/esm/{index-CNQ9-Wwh.js → index-mkVX9lU0.js} +3 -3
  19. package/dist/esm/{index-CNQ9-Wwh.js.map → index-mkVX9lU0.js.map} +1 -1
  20. package/dist/esm/index.js +1 -1
  21. package/dist/esm/loader.js +3 -3
  22. package/dist/esm/pennlibs-autocomplete.entry.js +279 -0
  23. package/dist/esm/pennlibs-autocomplete.entry.js.map +1 -0
  24. package/dist/esm/pennlibs-banner.entry.js +1 -1
  25. package/dist/esm/pennlibs-chat.entry.js +1 -1
  26. package/dist/esm/pennlibs-fallback-img.entry.js +1 -1
  27. package/dist/esm/pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.js.map +1 -0
  28. package/dist/esm/{pennlibs-autocomplete_4.entry.js → pennlibs-feedback_3.entry.js} +35 -302
  29. package/dist/esm/pennlibs-hero.entry.js +1 -1
  30. package/dist/esm/pennlibs-iiif-img.entry.js +1 -1
  31. package/dist/esm/web.js +3 -3
  32. package/dist/types/components/pennlibs-feedback/pennlibs-feedback.d.ts +1 -1
  33. package/dist/types/components/pennlibs-footer/pennlibs-footer.d.ts +4 -0
  34. package/dist/types/components.d.ts +10 -0
  35. package/dist/web/index.esm.js +1 -1
  36. package/dist/web/{p-a34e1e3e.entry.js → p-0c1113f4.entry.js} +1 -1
  37. package/dist/web/{p-b9538aed.entry.js → p-10931f0a.entry.js} +35 -302
  38. package/dist/web/{p-b6e686d1.entry.js → p-154851d1.entry.js} +1 -1
  39. package/dist/web/{p-c96a3643.entry.js → p-190f0293.entry.js} +1 -1
  40. package/dist/web/{p-eb633f4d.entry.js → p-4fb3e5a4.entry.js} +1 -1
  41. package/dist/web/p-7c6382d0.entry.js +279 -0
  42. package/dist/web/{p-662e4125.entry.js → p-e426fb61.entry.js} +1 -1
  43. package/dist/web/{p-CNQ9-Wwh.js → p-mkVX9lU0.js} +3 -3
  44. package/dist/web/{p-CNQ9-Wwh.js.map → p-mkVX9lU0.js.map} +1 -1
  45. package/dist/web/pennlibs-autocomplete.entry.esm.js.map +1 -0
  46. package/dist/web/pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.esm.js.map +1 -0
  47. package/dist/web/web.esm.js +3 -3
  48. package/hydrate/index.js +35 -26
  49. package/hydrate/index.mjs +35 -26
  50. package/package.json +1 -1
  51. package/dist/cjs/pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.cjs.js.map +0 -1
  52. package/dist/esm/pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.js.map +0 -1
  53. package/dist/web/pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.esm.js.map +0 -1
@@ -1,287 +1,10 @@
1
- import { r as registerInstance, d as createEvent, h, c as getElement, a as getAssetPath } from './index-CNQ9-Wwh.js';
1
+ import { r as registerInstance, c as createEvent, h, d as getAssetPath, a as getElement } from './index-mkVX9lU0.js';
2
2
 
3
- const pennlibsAutocompleteCss = ":host {\n display: block;\n width: 100%;\n border-radius: 1.25rem;\n padding: 0;\n border-top: 0;\n position: relative;\n}\n\n[role=listbox] {\n position: absolute;\n margin-top: var(--pl-space-xs);\n background: var(--pl-color-bg-default);\n border-radius: 1.25rem;\n box-shadow: rgba(140, 149, 159, 0.3) 0px 8px 24px 0px;\n width: 100%;\n overflow: hidden;\n z-index: 1;\n\n display: flex;\n flex-direction: column;\n}\n\np {\n margin: 0;\n font-size: var(--pl-font-size-s);\n color: var(--pl-color-fg-subtle);\n padding: var(--pl-space-xs) calc(var(--pl-space-m) + var(--pl-space-2xs));\n font-size: var(--pl-font-size-s);\n order: 2;\n font-weight: 500;\n background: var(--pl-color-bg-subtle);\n border-radius: 0 0 1.25rem 1.25rem;\n\n display: flex;\n gap: var(--pl-space-s) var(--pl-space-l);\n flex-wrap: wrap;\n}\n\nol {\n list-style: none;\n margin: 0;\n padding: var(--pl-space-xs) 0;\n order: 1;\n}\n\n[role=option] {\n color: var(--pl-color-fg-default);\n padding: var(--pl-space-s) calc(var(--pl-space-m) + var(--pl-space-2xs));\n text-decoration: none;\n font-weight: 700; \n\n &:hover {\n cursor: pointer;\n }\n\n &:hover,\n &:focus {\n text-decoration-thickness: 2px;\n text-underline-offset: 2px;\n text-decoration: underline;\n }\n}\n\n[aria-selected=true] {\n text-decoration-thickness: 2px;\n text-underline-offset: 2px;\n text-decoration: underline;\n}\n\nmark,\nb {\n background: none;\n font-weight: 400;\n}\n\n.suggestion--border {\n border-bottom: solid 1px rgb(from var(--pl-color-fg-default) r g b / 0.2);\n padding-bottom: calc(var(--pl-space-2xs) + var(--pl-space-s));\n margin-bottom: var(--pl-space-2xs);\n}";
3
+ const pennlibsFeedbackCss = ":host{display:block;background:#eeeff4;font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default);line-height:1.4;box-sizing:border-box;padding:0.75em 0}@media print{:host{display:none}}*,*::before,*::after{box-sizing:border-box}.viewport-margins{max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.feedback__content{display:flex;justify-content:space-between;gap:var(--pl-space-s);flex-wrap:wrap}.feedback__inline-question{display:flex;flex-wrap:wrap;gap:0.5em;align-items:center}h2{display:inline-block;margin:0;font-family:var(--pl-font-sans-serif);font-size:1em;font-weight:400}p{margin:0;padding:calc(0.5em + 1px) 0}strong{font-weight:600}a{color:var(--pl-color-fg-accent);text-decoration:underline;text-underline-offset:var(--pl-link-text-underline-offset);text-decoration-thickness:var(--pl-link-hover-text-decoration-thickness)}button{all:unset;display:flex;align-items:center;gap:0.5em;padding:0.25em 1.25em;font-family:var(--pl-font-family);font-weight:500;line-height:1.4;color:var(--pl-color-fg-default);background:var(--pl-color-bg-default);border:solid 1px var(--pl-color-fg-subtle);border-radius:1em;box-sizing:border-box}button:hover{cursor:pointer}button:hover span{text-decoration:underline}button.selected{background:var(--pl-color-bg-accent-emphasis);color:var(--pl-color-fg-on-emphasis);border-color:var(--pl-color-bg-accent-emphasis)}.feedback__inline-question+.feedback__share-feedback,p{animation:none}.feedback__content>p{animation:fadeIn 300ms ease-in}@keyframes fadeIn{from{opacity:0}to{opacity:1}}*:focus{outline:0;box-shadow:0 0 0 2px var(--pl-color-bg-attention),\n 0 0 0 3px var(--pl-color-bg-emphasis)}p:focus{outline:none;box-shadow:0 0 0 2px var(--pl-color-bg-attention), 0 0 0 3px var(--pl-color-bg-emphasis)}@media (max-width: 26em){h2{display:block;width:100%;text-align:center}}.help-us{display:flex;flex-direction:column;gap:0.5em}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.visually-hidden:focus,.visually-hidden:active{clip:auto;clip-path:none;height:auto;overflow:visible;position:static;white-space:normal;width:auto}";
4
4
 
5
- const Autocomplete = class {
6
- constructor(hostRef) {
7
- registerInstance(this, hostRef);
8
- this.activated = createEvent(this, "pl:activated");
9
- this.showSuggestions = false;
10
- this.currentIndex = -1;
11
- this.originalValue = '';
12
- this.options = [];
13
- this.keyHandlerMap = {
14
- 'Escape': () => this.handleEscape(),
15
- 'ArrowDown': () => this.handleArrowDown(),
16
- 'ArrowUp': () => this.handleArrowUp(),
17
- 'Enter': () => this.handleEnter()
18
- };
19
- this.handleOptionClick = (index) => {
20
- this.currentIndex = index;
21
- this.selectCurrent();
22
- };
23
- }
24
- componentWillLoad() {
25
- this.options = this.parseOptionsFromDOM();
26
- }
27
- componentDidLoad() {
28
- this.setupInput();
29
- this.setupMutationObserver();
30
- }
31
- disconnectedCallback() {
32
- if (this.blurTimeout)
33
- clearTimeout(this.blurTimeout);
34
- if (this.mutationObserver)
35
- this.mutationObserver.disconnect();
36
- }
37
- setupMutationObserver() {
38
- this.mutationObserver = new MutationObserver(() => {
39
- this.options = this.parseOptionsFromDOM();
40
- });
41
- this.mutationObserver.observe(this.el, {
42
- childList: true,
43
- subtree: true,
44
- characterData: true
45
- });
46
- }
47
- parseOptionsFromDOM() {
48
- const listbox = this.findListbox();
49
- if (!listbox)
50
- return [];
51
- const elements = Array.from(listbox.querySelectorAll('[role="option"]'));
52
- return elements.map((el, i) => this.createOption(el, i));
53
- }
54
- findListbox() {
55
- return Array.from(this.el.children).find(child => child.matches('ol[role="listbox"]'));
56
- }
57
- createOption(element, index) {
58
- var _a;
59
- return {
60
- id: element.id || `option-${index}`,
61
- html: element.innerHTML,
62
- value: element.getAttribute('data-pl-value') || ((_a = element.textContent) === null || _a === void 0 ? void 0 : _a.trim()) || ''
63
- };
64
- }
65
- getInput() {
66
- var _a;
67
- if (!this.for)
68
- return null;
69
- const slot = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot[name="start"]');
70
- if (!slot)
71
- return null;
72
- const assignedElements = slot.assignedElements();
73
- if (assignedElements.length === 0)
74
- return null;
75
- const input = assignedElements[0].querySelector(`input#${this.for}`);
76
- return input || null;
77
- }
78
- isInputFocused() {
79
- return this.getInput() === document.activeElement;
80
- }
81
- isTrackedInput(input) {
82
- return (input === null || input === void 0 ? void 0 : input.getAttribute('data-pl-autocomplete-connected')) === 'true' &&
83
- this.el.contains(input);
84
- }
85
- setupInput() {
86
- if (!this.for) {
87
- console.warn('<pennlibs-autocomplete> Missing "for" attribute. Please add for="input-id" to specify which input to attach to.');
88
- return;
89
- }
90
- const input = this.getInput();
91
- if (!input) {
92
- console.warn(`<pennlibs-autocomplete> No input element found with id="${this.for}". Ensure an input with this id exists.`);
93
- return;
94
- }
95
- this.setComboboxAttributes(input);
96
- input.setAttribute('data-pl-autocomplete-connected', 'true');
97
- }
98
- setComboboxAttributes(input) {
99
- input.setAttribute('role', 'combobox');
100
- input.setAttribute('aria-autocomplete', 'list');
101
- input.setAttribute('aria-expanded', 'false');
102
- input.setAttribute('aria-controls', 'listbox');
103
- }
104
- handleSlotChange() {
105
- this.options = this.parseOptionsFromDOM();
106
- this.setupInput();
107
- }
108
- handleInputEvent(event) {
109
- const input = event.target;
110
- if (this.isTrackedInput(input)) {
111
- this.currentIndex = -1;
112
- this.openSuggestions();
113
- }
114
- }
115
- handleFocusEvent(event) {
116
- const input = event.target;
117
- if (this.isTrackedInput(input))
118
- this.showSuggestionsPanel();
119
- }
120
- handleBlurEvent(event) {
121
- const input = event.target;
122
- if (this.isTrackedInput(input))
123
- this.deferCloseSuggestions();
124
- }
125
- handleFocusOut(event) {
126
- if (this.isFocusLeavingComponent(event))
127
- this.closeSuggestions();
128
- }
129
- handleKeyDown(event) {
130
- if (!this.isInputFocused())
131
- return;
132
- if (event.metaKey || event.ctrlKey)
133
- return; // Ignore keyboard shortcuts
134
- const handler = this.keyHandlerMap[event.key];
135
- if (handler) {
136
- // Don't prevent default for Enter - allow form submission
137
- if (event.key !== 'Enter') {
138
- event.preventDefault();
139
- }
140
- handler();
141
- }
142
- }
143
- handleEscape() {
144
- this.reset();
145
- this.syncAll();
146
- }
147
- handleArrowDown() {
148
- if (!this.showSuggestions)
149
- return;
150
- this.moveNext();
151
- this.syncAll();
152
- }
153
- handleArrowUp() {
154
- if (!this.showSuggestions)
155
- return;
156
- this.movePrevious();
157
- this.syncAll();
158
- }
159
- handleEnter() {
160
- if (this.canSelect())
161
- this.selectCurrent();
162
- }
163
- // Navigation
164
- moveNext() {
165
- const lastIndex = this.options.length - 1;
166
- this.currentIndex = this.currentIndex < lastIndex ? this.currentIndex + 1 : -1;
167
- }
168
- movePrevious() {
169
- const lastIndex = this.options.length - 1;
170
- this.currentIndex = this.currentIndex > -1 ? this.currentIndex - 1 : lastIndex;
171
- }
172
- canSelect() {
173
- return this.showSuggestions && this.currentIndex >= 0;
174
- }
175
- selectCurrent() {
176
- if (this.currentIndex < 0)
177
- return;
178
- const selectedOption = this.options[this.currentIndex];
179
- this.applySelection(selectedOption);
180
- this.emitActivation(selectedOption);
181
- this.closeSuggestions();
182
- }
183
- applySelection(option) {
184
- const input = this.getInput();
185
- if (!input)
186
- return;
187
- input.value = option.value;
188
- this.originalValue = option.value;
189
- }
190
- emitActivation(option) {
191
- this.activated.emit({
192
- index: this.currentIndex,
193
- value: option.value
194
- });
195
- }
196
- openSuggestions() {
197
- if (!this.isInputFocused())
198
- return;
199
- const input = this.getInput();
200
- if (input)
201
- this.originalValue = input.value;
202
- this.showSuggestionsPanel();
203
- }
204
- showSuggestionsPanel() {
205
- this.showSuggestions = true;
206
- this.syncAriaAttributes();
207
- }
208
- closeSuggestions() {
209
- this.reset();
210
- this.syncAll();
211
- }
212
- deferCloseSuggestions() {
213
- if (this.blurTimeout)
214
- clearTimeout(this.blurTimeout);
215
- this.blurTimeout = setTimeout(() => {
216
- if (this.isFocusOutsideComponent())
217
- this.closeSuggestions();
218
- }, 150);
219
- }
220
- reset() {
221
- this.showSuggestions = false;
222
- this.currentIndex = -1;
223
- }
224
- isFocusLeavingComponent(event) {
225
- var _a;
226
- const target = event.relatedTarget;
227
- return !target ||
228
- (!this.el.contains(target) && !((_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.contains(target)));
229
- }
230
- isFocusOutsideComponent() {
231
- var _a;
232
- const active = document.activeElement;
233
- return !((_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.contains(active)) && active !== this.getInput();
234
- }
235
- syncAriaAttributes() {
236
- const input = this.getInput();
237
- if (!input)
238
- return;
239
- this.updateAriaExpanded(input);
240
- this.updateAriaActiveDescendant(input);
241
- }
242
- syncInputValueToSelection() {
243
- const input = this.getInput();
244
- if (!input)
245
- return;
246
- input.value = this.currentIndex >= 0 && this.currentIndex < this.options.length
247
- ? this.options[this.currentIndex].value
248
- : this.originalValue;
249
- }
250
- syncAll() {
251
- this.syncAriaAttributes();
252
- this.syncInputValueToSelection();
253
- }
254
- updateAriaExpanded(input) {
255
- input.setAttribute('aria-expanded', this.showSuggestions.toString());
256
- }
257
- updateAriaActiveDescendant(input) {
258
- const hasSelection = this.showSuggestions &&
259
- this.currentIndex >= 0 &&
260
- this.currentIndex < this.options.length;
261
- if (hasSelection) {
262
- input.setAttribute('aria-activedescendant', this.options[this.currentIndex].id);
263
- }
264
- else {
265
- input.removeAttribute('aria-activedescendant');
266
- }
267
- }
268
- shouldShowListbox() {
269
- return this.showSuggestions && this.options.length > 0 && this.isInputFocused();
270
- }
271
- render() {
272
- return (h("div", { key: 'ee4ead1b5bec44a561901a29d3d5e119da0d09f8' }, h("slot", { key: '7d7128ab7968544ab25125d30a648136f8d8a566', name: "start" }), this.shouldShowListbox() && (h("ol", { key: '95d45d524847f83b646853a8d919bc88f471f150', role: "listbox", id: "listbox" }, this.options.map((option, index) => (h("li", { role: "option", id: option.id, "aria-selected": this.currentIndex === index ? 'true' : 'false', tabindex: "-1", onClick: () => this.handleOptionClick(index), innerHTML: option.html })))))));
273
- }
274
- get el() { return getElement(this); }
275
- };
276
- Autocomplete.style = pennlibsAutocompleteCss;
277
-
278
- const pennlibsFeedbackCss = ":host{display:block;background:#eeeff4;font-family:var(--pl-font-family);font-size:var(--pl-font-size);color:var(--pl-color-fg-default);line-height:1.4;box-sizing:border-box;padding:0.75em 0}@media print{:host{display:none}}*,*::before,*::after{box-sizing:border-box}.viewport-margins{max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.feedback__content{display:flex;justify-content:space-between;gap:var(--pl-space-s);flex-wrap:wrap}.feedback__inline-question{display:flex;flex-wrap:wrap;gap:0.5em;align-items:center}h2{display:inline-block;margin:0;font-family:var(--pl-font-sans-serif);font-size:1em;font-weight:600}p{margin:0;padding:calc(0.5em + 1px) 0}strong{font-weight:600}a{color:var(--pl-color-fg-accent);text-decoration:underline;text-underline-offset:var(--pl-link-text-underline-offset);text-decoration-thickness:var(--pl-link-hover-text-decoration-thickness)}button{all:unset;display:flex;align-items:center;gap:0.5em;padding:0.25em 1.25em;font-family:var(--pl-font-family);font-weight:500;line-height:1.4;color:var(--pl-color-fg-default);background:var(--pl-color-bg-default);border:solid 1px var(--pl-color-fg-subtle);border-radius:1em;box-sizing:border-box}button:hover{cursor:pointer}button:hover span{text-decoration:underline}*:focus{outline:0;box-shadow:0 0 0 2px var(--pl-color-bg-attention),\n 0 0 0 3px var(--pl-color-bg-emphasis)}p:focus{outline:none;box-shadow:0 0 0 2px var(--pl-color-bg-attention), 0 0 0 3px var(--pl-color-bg-emphasis)}@media (max-width: 26em){h2{display:block;width:100%;text-align:center}}.help-us{display:flex;flex-direction:column;gap:0.5em}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.visually-hidden:focus,.visually-hidden:active{clip:auto;clip-path:none;height:auto;overflow:visible;position:static;white-space:normal;width:auto}";
279
-
280
- const FEEDBACK_STORAGE_KEY = 'pennlibs-feedback-answer';
281
- const FEEDBACK_TIMESTAMP_KEY = 'pennlibs-feedback-timestamp';
5
+ const FEEDBACK_STORAGE_KEY = `pennlibs-feedback-${window.location.pathname}`;
282
6
  const FEEDBACK_TTL = 5 * 60 * 1000; // 5 minutes
283
- const FEEDBACK_QUESTION = 'Is this page useful?';
284
- const FEEDBACK_ERROR_STORAGE_KEY = 'pennlibs-feedback-error';
7
+ const FEEDBACK_QUESTION = 'Did you find what you need?';
285
8
  const PennlibsFeedback = class {
286
9
  constructor(hostRef) {
287
10
  registerInstance(this, hostRef);
@@ -290,27 +13,30 @@ const PennlibsFeedback = class {
290
13
  * When true, hides the yes/no question and only shows the "share your feedback" link.
291
14
  */
292
15
  this.hideQuestion = false;
293
- this.error = false;
294
16
  this.answer = undefined;
17
+ this.selected = undefined;
295
18
  }
296
19
  componentWillLoad() {
297
- const timestamp = sessionStorage.getItem(FEEDBACK_TIMESTAMP_KEY);
298
- if (timestamp && Date.now() - Number(timestamp) > FEEDBACK_TTL) {
299
- sessionStorage.removeItem(FEEDBACK_STORAGE_KEY);
300
- sessionStorage.removeItem(FEEDBACK_TIMESTAMP_KEY);
301
- }
302
- if (sessionStorage.getItem(FEEDBACK_STORAGE_KEY)) {
303
- this.answer = sessionStorage.getItem(FEEDBACK_STORAGE_KEY);
304
- }
305
- if (sessionStorage.getItem(FEEDBACK_ERROR_STORAGE_KEY)) {
306
- this.error = sessionStorage.getItem(FEEDBACK_ERROR_STORAGE_KEY) === 'true';
20
+ const stored = sessionStorage.getItem(FEEDBACK_STORAGE_KEY);
21
+ if (stored) {
22
+ try {
23
+ const { answer, timestamp } = JSON.parse(stored);
24
+ if (Date.now() - timestamp > FEEDBACK_TTL) {
25
+ sessionStorage.removeItem(FEEDBACK_STORAGE_KEY);
26
+ }
27
+ else {
28
+ this.answer = answer;
29
+ }
30
+ }
31
+ catch (_a) {
32
+ sessionStorage.removeItem(FEEDBACK_STORAGE_KEY);
33
+ }
307
34
  }
308
35
  }
309
36
  handleFeedback(answer) {
310
37
  var _a;
311
- this.answer = answer;
312
- sessionStorage.setItem(FEEDBACK_STORAGE_KEY, answer);
313
- sessionStorage.setItem(FEEDBACK_TIMESTAMP_KEY, String(Date.now()));
38
+ this.selected = answer;
39
+ sessionStorage.setItem(FEEDBACK_STORAGE_KEY, JSON.stringify({ answer, timestamp: Date.now() }));
314
40
  this.feedbackEvent.emit({
315
41
  question: FEEDBACK_QUESTION,
316
42
  answer: answer,
@@ -318,18 +44,25 @@ const PennlibsFeedback = class {
318
44
  pageHeading: ((_a = document.querySelector('h1')) === null || _a === void 0 ? void 0 : _a.textContent) || undefined,
319
45
  pageTitle: document.title || undefined
320
46
  });
47
+ setTimeout(() => {
48
+ this.answer = answer;
49
+ }, 600);
321
50
  }
322
51
  render() {
323
- return (h("div", { key: '04053c96e964ee9f240ca1a77d7944ae0f53248d', class: "feedback__container" }, h("div", { key: 'f5f524b449d3473c1ecc2d454787034c54a811a0', class: "viewport-margins" }, h("div", { key: 'd0c832edc9361dac49d9cbfc143332fea04434ea', class: "feedback__content" }, !this.hideQuestion && (this.answer === 'yes' ? (h("p", null, "Thank you for letting us know.")) : this.answer === 'no' ? (h("p", null, "Thank you for letting us know. ", h("a", { href: "https://www.library.upenn.edu/contact-us" }, "Contact us"), " if you need help.")) : (h("div", { class: "feedback__inline-question" }, h("h2", null, "Did you find what you need?"), h("button", { onClick: () => this.handleFeedback('yes') }, h("span", null, "Yes")), h("button", { onClick: () => this.handleFeedback('no') }, h("span", null, "No"))))), h("div", { key: '9630ad5e35d6eea2ee63217410607eb50c3babc7', class: "feedback__share-feedback" }, h("p", { key: '126aeabf45f338cc07b33ebca09c761611e7c8e1' }, "To help us improve, ", h("a", { key: '8af38aed071ad75d60837a18845d28e5645c2768', href: "http://library.upenn.edu/feedback" }, "share your feedback"), "."))))));
52
+ return (h("div", { key: 'e470cb9ce96fecddda37c8a557c6670b581d8414', class: "feedback__container" }, h("div", { key: '0f3729d63102379f7219fd9a65c370f05c3f271c', class: "viewport-margins" }, h("div", { key: '3eaa8419d9b5fed5d7cf33de60ab93dd911afa34', class: "feedback__content" }, !this.hideQuestion && (this.answer === 'yes' ? (h("p", null, "Thank you for letting us know.")) : this.answer === 'no' ? (h("p", null, "We'd like to help. ", h("a", { href: "https://www.library.upenn.edu/contact-us" }, "Contact us"), " and let us know what you're looking for.")) : (h("div", { class: "feedback__inline-question" }, h("h2", null, "Did you find what you need?"), h("button", { class: { 'selected': this.selected === 'yes' }, disabled: !!this.selected, onClick: () => this.handleFeedback('yes') }, h("span", null, "Yes"), h("span", { class: "visually-hidden" }, ", I found what I needed.")), h("button", { class: { 'selected': this.selected === 'no' }, disabled: !!this.selected, onClick: () => this.handleFeedback('no') }, h("span", null, "No"), h("span", { class: "visually-hidden" }, ", I did not find what I needed."))))), h("div", { key: '50da9c1f23d14feeb6a2c408b0461a439331fcd9', class: "feedback__share-feedback" }, h("p", { key: '3580e25ecd7b463bb46103a6aee54a710e88c0ff' }, "To help us improve, ", h("a", { key: '276e226f4487ce94b9de30ae40f964e63f0d045b', href: `https://upenn.co1.qualtrics.com/jfe/form/SV_3xVrP7EKWS92zfE?reporting_from_url=${encodeURIComponent(window.location.href)}` }, "share your feedback"), "."))))));
324
53
  }
325
54
  };
326
55
  PennlibsFeedback.style = pennlibsFeedbackCss;
327
56
 
328
- const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n --padding-bottom: 3em;\n}\n\n@media print {\n :host {\n display: none;\n }\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\n.website-footer-wrapper {\n background: var(--pl-color-penn-blue);\n padding-bottom: var(--padding-bottom);\n}\n\n.viewport-margins {\n max-width: var(--pl-viewport-margins-max-width);\n margin: 0 auto;\n padding: 0 var(--pl-viewport-margins-gutter, 1em);\n}\n\n.website-footer {\n background-size: cover;\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.website-footer a {\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.built-with,\n.built-with a {\n color: var(--pl-color-gray-blue-light);\n}\n\n.built-with {\n opacity: 0.85;\n margin: 0; \n padding: 1.5em 0;\n font-size: 0.875em;\n}\n\n.website-footer__content {\n padding: 4em 0;\n}\n\n.website-footer__links-container {\n gap: 4em 2em;\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(12em, 1fr));\n}\n\n.website-footer__heading {\n font-size: 0.8em;\n text-transform: uppercase;\n letter-spacing: 0.075em;\n margin-bottom: 1em;\n opacity: 0.75;\n}\n\n.website-footer__links {\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n flex-direction: column;\n gap: 0.75em;\n}\n\n.website-footer__links a {\n text-decoration: none;\n}\n\n.website-footer__links a:hover {\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n}\n\n.website-footer__footer {\n padding: 1em 0;\n background: rgba(1, 31, 91, 0.65);\n}\n\n.website-footer__links--footer {\n display: flex;\n flex-wrap: wrap;\n gap: 0;\n flex-direction: row;\n margin-left: -0.5em;\n\n @media (max-width: 1080px) {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(16em, 1fr));\n }\n}\n\n.website-footer__links--footer a {\n display: inline-block;\n padding: 0.5em 0.75em;\n font-size: 0.875em;\n opacity: 0.875;\n font-weight: 500;\n}\n\n.website-footer__links--footer a:hover {\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n}";
57
+ const pennlibsFooterCss = ":host {\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n --padding-bottom: 3em;\n}\n\n@media print {\n :host {\n display: none;\n }\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\n.website-footer-wrapper {\n background: var(--pl-color-penn-blue);\n padding-bottom: var(--padding-bottom);\n}\n\n.viewport-margins {\n max-width: var(--pl-viewport-margins-max-width);\n margin: 0 auto;\n padding: 0 var(--pl-viewport-margins-gutter, 1em);\n}\n\n.website-footer {\n background-size: cover;\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.website-footer a {\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.built-with,\n.built-with a {\n color: var(--pl-color-fg-subtle-on-emphasis);\n}\n\n.built-with a {\n font-weight: 500;\n text-underline-offset: var(--pl-link-text-underline-offset);\n\n &:hover {\n text-decoration-thickness: var(--pl-link-hover-text-decoration-thickness);\n }\n}\n\n.built-with {\n opacity: 0.875;\n margin: 0; \n padding: 1.5em 0;\n font-size: 0.875em;\n}\n\n.website-footer__content {\n padding: 4em 0;\n}\n\n.website-footer__links-container {\n gap: 4em 2em;\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(12em, 1fr));\n}\n\n.website-footer__heading {\n font-size: 0.8em;\n text-transform: uppercase;\n letter-spacing: 0.075em;\n margin-bottom: 1em;\n opacity: 0.75;\n}\n\n.website-footer__links {\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n flex-direction: column;\n gap: 0.75em;\n}\n\n.website-footer__links a {\n text-decoration: none;\n}\n\n.website-footer__links a:hover {\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n}\n\n.website-footer__footer {\n padding: 1em 0;\n background: rgba(1, 31, 91, 0.65);\n}\n\n.website-footer__links--footer {\n display: flex;\n flex-wrap: wrap;\n gap: 0;\n flex-direction: row;\n margin-left: -0.75em;\n\n @media (max-width: 1080px) {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(16em, 1fr));\n }\n}\n\n.website-footer__links--footer a {\n display: inline-block;\n padding: 0.5em 0.75em;\n font-size: 0.875em;\n opacity: 0.875;\n font-weight: 500;\n}\n\n.website-footer__links--footer a:hover {\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n}";
329
58
 
330
59
  const Footer = class {
331
60
  constructor(hostRef) {
332
61
  registerInstance(this, hostRef);
62
+ /**
63
+ * When true, shows a "Built with the Penn Libraries Design System" line below the footer.
64
+ */
65
+ this.showBuiltWith = false;
333
66
  }
334
67
  componentWillLoad() {
335
68
  this.setNavigationByChildren();
@@ -354,12 +87,12 @@ const Footer = class {
354
87
  }
355
88
  render() {
356
89
  const footerBackgroundSrc = getAssetPath('./assets/footer-bg.webp');
357
- return (h("footer", { key: 'bc08bfaa926d4a5032cd089e735d2120d4982fb7', class: "website-footer-wrapper" }, h("div", { key: 'f9491e7d0b774e1ee4fb5fe9dfe3644c008e4aa4', class: "website-footer", style: {
90
+ return (h("footer", { key: '39b1bc7336fe2aa28e8c6093d13b8dfb3dd70d3e', class: "website-footer-wrapper" }, h("div", { key: '7902cf7cde3a468dec8ea71c2a139addafa5af79', class: "website-footer", style: {
358
91
  background: `var(--pl-color-penn-blue) url(${footerBackgroundSrc}) no-repeat 50% 50%`,
359
92
  backgroundSize: 'cover',
360
- } }, h("div", { key: 'c78698128c26439a783a6872bda1f6ad30010091', class: "viewport-margins" }, h("div", { key: '0fa06835787b2b862adbc972040760505431eee4', class: "website-footer__content" }, h("div", { key: '1f9f9b6e20e67be442295c15bbaed30a9bd4ed6c', class: "website-footer__links-container" }, h("section", { key: 'a1ad90f23aa1e04d2a9ccb65f55aad8bd209865b' }, h("h2", { key: '16c840dae80ded63eeb3dfe4dcd94712b6fbf3cb', class: "website-footer__heading" }, "Penn Libraries"), h("ul", { key: 'c474ce0b1f79b630a09a4f290de3b90d4faf6322', class: "website-footer__links" }, h("li", { key: 'ef2c4a81b658238a56345616b638a4b1bdeb86d7' }, h("a", { key: 'fe75576d5007269fd63178b1cc231b6a99dfd183', href: "https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206" }, "3420 Walnut Street", h("br", { key: '4077d3f62c99b5f33305ead14d28b98cec6f6e7f' }), "Philadelphia, PA 19104-6206")), h("li", { key: 'dcc868203318be48bce9bcb2af7feb429cfea045' }, h("a", { key: 'd4268959f6d6796c4dda913910af4c0e8333b5f3', href: "tel:(215) 898-7555" }, "(215) 898-7555")), h("li", { key: '65c7a446f25fde16e6dd13b9cd777522dcfe73de' }, h("a", { key: 'd44ccc291db7ef87492723f5b8c0a6e27dd82b58', href: "https://www.library.upenn.edu/contact-us" }, "Contact us")), h("li", { key: '6dda94dd8c3bd222e251e9b3c26228d6c79c65bc' }, h("a", { key: '8378c775adba4789e107fc365c8f12dc283c5c39', href: "https://www.library.upenn.edu/about/hours", target: "_blank" }, "Locations and hours")))), h("section", { key: '927c33a3a55c9b23ef16fb84ed0222e4222d8919' }, h("h2", { key: '73ddc9d2175026ee31d00b6eefda8051be0768aa', class: "website-footer__heading" }, "Stay in touch"), h("ul", { key: 'f51e60d3333e6185d4e94427a09a0907e65e3d92', class: "website-footer__links" }, h("li", { key: '64d2313dbc8064af08d17a040695e39de3a65f99' }, h("a", { key: 'a0c41592ec08c2a77e964270d30284442a6f01c2', href: "https://www.alumni.upenn.edu/libsignup" }, "Newsletter")), h("li", { key: 'f0cf9bf81683933711a12d73bef11bbbabc2f445' }, h("a", { key: '47b860bca9aa60196b3a037bfe3c1dd1b34b5024', href: "https://www.instagram.com/upennlib/" }, "Instagram")), h("li", { key: '9039a7f7fc64465ec2622cdbad079972ebdf4292' }, h("a", { key: '834b7a49f15847d2fa6f405e6e5a6320b0ea5967', href: "https://www.facebook.com/PennLibraries/" }, "Facebook")), h("li", { key: 'cb4ca3a5afb95c7e1df0f11773062bfed4c66116' }, h("a", { key: '82b2b1380689cdc1ee29ca55bab4bf5beb8ab825', href: "https://www.linkedin.com/company/penn-libraries" }, "LinkedIn")))), this.navigationByChildren && [
93
+ } }, h("div", { key: '804f9cd3f101997ee2d15d4a4749945ef553a118', class: "viewport-margins" }, h("div", { key: '3a09637400e74e729641666eb8142c0cf77d66b3', class: "website-footer__content" }, h("div", { key: 'cdb9270db298aa7781859a80c799949cb4c35787', class: "website-footer__links-container" }, h("section", { key: '20d953d2b85178798d2298aa8aaa9fb8e47d7af4' }, h("h2", { key: '79b1fe7f4fc2dff03134c7d4e96e9fd657131fc8', class: "website-footer__heading" }, "Penn Libraries"), h("ul", { key: 'ba8002b17457f979f9817c45a89f332064f0b5bb', class: "website-footer__links" }, h("li", { key: 'cb65fc4ad6432ef447a4b98a8dfdc0323bf37ccc' }, h("a", { key: '0b61506da9a1c18919f77410fa39d3937f7485df', href: "https://maps.google.com/?q=Van Pelt Library 3420 Walnut Street, Philadelphia, PA 19104-6206" }, "3420 Walnut Street", h("br", { key: 'ebd3def13a3107d1b301c0932d421b054e2bb338' }), "Philadelphia, PA 19104-6206")), h("li", { key: '3f26ebab3b90a33ba2d17cd3cfd8a485f1c7e74f' }, h("a", { key: 'c2dcf7a3d936eb5376b2568e677bb8a7dc7ab445', href: "tel:(215) 898-7555" }, "(215) 898-7555")), h("li", { key: '8c9374110f2d386c7275fad9522ea2565daf6c06' }, h("a", { key: 'd40a2fd7490f1b233e4839e38faf29d9bb04f519', href: "https://www.library.upenn.edu/contact-us" }, "Contact us")), h("li", { key: 'ab3016b1cfcc8827af060ec383d8556e8346713a' }, h("a", { key: '76a8d246128fb76606c1cdf24640198c23c9d317', href: "https://www.library.upenn.edu/about/hours", target: "_blank" }, "Locations and hours")))), h("section", { key: 'fd0abacbc35ffaafbb2016064c7a6194616ee2dc' }, h("h2", { key: 'a812d7d26e21a1808ce6bd115ec620e1b033a8bf', class: "website-footer__heading" }, "Stay in touch"), h("ul", { key: 'fe158ff1336379e1236a88c4a3d0f5e1efd9cdb8', class: "website-footer__links" }, h("li", { key: '32396df360b39190ff587400fabe405ee319a507' }, h("a", { key: '07ac56362dde7a2807e86c2a22564689ed9de90c', href: "https://www.alumni.upenn.edu/libsignup" }, "Newsletter")), h("li", { key: '95abd2bf0f6a79c0597c1e57e878f986002adde2' }, h("a", { key: '374044fae62fd82c9369cfba8b7c6223ded48d5a', href: "https://www.instagram.com/upennlib/" }, "Instagram")), h("li", { key: '86cc74d4ec21dfb51a072cfad87ed395e961f26f' }, h("a", { key: 'fda9e8c73918252b91e40dc23d289613a3fe5802', href: "https://www.facebook.com/PennLibraries/" }, "Facebook")), h("li", { key: 'b1ce60d7aa5ac8a2aa8bd4f826c11cc753b1488c' }, h("a", { key: 'ccfef8131fc7f9edd44936f1c212d31c08c61682', href: "https://www.linkedin.com/company/penn-libraries" }, "LinkedIn")))), this.navigationByChildren && [
361
94
  this.navigationByChildren.map(section => (h("section", null, h("h2", { class: "website-footer__heading" }, section.heading), h("ul", { class: "website-footer__links" }, section.links.map(link => (h("li", null, h("a", { href: link.href }, link.label))))))))
362
- ]))), h("div", { key: 'a9172ba3d817c03ff081d67ae47aceeac317a916', class: "website-footer__footer" }, h("div", { key: '2307a5282337a64bacbb1ce6574505a549527674', class: "viewport-margins" }, h("ul", { key: '7783498f960416be4bcd4b525d674feae524ed40', class: "website-footer__links website-footer__links--footer" }, h("li", { key: '90c904762368df68012945c96cfde96e34f939a7' }, h("a", { key: '3c8b82331d85746a26ef69200137054aa1be6e72', href: "https://www.upenn.edu/" }, "UPenn")), h("li", { key: '6ec4f2ed752187a65e6ce35644504d11a293972e' }, h("a", { key: '036d0c03234a0a198304fd3075c8d888867bc2d8', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), h("li", { key: '729e69e9737a13ce8b007176ff2225542b6f76fe' }, h("a", { key: '51410ccd4b0cfc73d1435df78acbf4d7775c9b5a', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), h("li", { key: 'af7a7dfaf62607451c5c65daf2554aef228c2293' }, h("a", { key: '924ebc36c5cfdcd9f5b99a783914eaaa9ff9851a', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), h("li", { key: 'd6a72f077412da636a998521382f747d56d0cc98' }, h("a", { key: '6924c765a7b37f335167105a39b719d99937a330', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), h("li", { key: '0ddfa89abe2f7bb6b44f34443d78e491c5af5d58' }, h("a", { key: 'cbaeccf216d3438a3da9633a29d90c91e225858b', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement")))))), h("div", { key: '9fc3fbb6bde995fac83a2ab795022846c19c6e5f', class: "viewport-margins" }, h("p", { key: '73ec7cf307efbfe6565c27ac711a087d450e1372', class: "built-with" }, "Built with the ", h("a", { key: '94ce8d4703ad2b9231ae15cd8018ab74889a48f6', href: "https://designsystem.library.upenn.edu/" }, "Penn Libraries Design System")))));
95
+ ]))), h("div", { key: '4430d39b9b8943d9336020d5ed04cdb80a3b91af', class: "website-footer__footer" }, h("div", { key: '437f0b8894b63c3857f8871eaaaf3d28277738ad', class: "viewport-margins" }, h("ul", { key: '8c4ac37a89006d543a66c8c1ba6bc9d7acc0d6db', class: "website-footer__links website-footer__links--footer" }, h("li", { key: 'ac1db31f3c5331a26c0aee171974c10f22d5da08' }, h("a", { key: 'ad8a6251cca9b0c904ccecff96a8800b22ed5568', href: "https://www.upenn.edu/" }, "UPenn")), h("li", { key: '1189f7119ec768d34ea9435f9ff85df2764abe61' }, h("a", { key: 'eb53d4f15fe49d32899d435670a34369a4e7e190', href: "https://www.upenn.edu/about/privacy-policy" }, "Privacy Policy")), h("li", { key: 'd2a155f7f91a31cca41df9d0c9d37f151bded247' }, h("a", { key: '8e329a895a25bd139867063dd7eed9c0aa7c0060', href: "https://accessibility.web-resources.upenn.edu/get-help" }, "Report Accessibility Issues and Get Help")), h("li", { key: '0b65f3da18b54b91158515d7966e010e4e0d64ac' }, h("a", { key: 'f8615c438f94216372fdb8afa26ae7150bbef816', href: "https://www.upenn.edu/about/disclaimer" }, "Disclaimer")), h("li", { key: 'cbf5febfb926a1b569e73d4a57e7ca8315f6d876' }, h("a", { key: '1116c792623c0fa819ce0189e105ee54c69ba73e', href: "https://www.publicsafety.upenn.edu/contact/" }, "Emergency Services")), h("li", { key: '385a84f264b263a9738d38d66ac917e3a6055db4' }, h("a", { key: 'dcd8517fb32ae46b983cb4802adb86e33e29bd71', href: "https://www.upenn.edu/about/report-copyright-infringement" }, "Report Copyright Infringement")))))), this.showBuiltWith && (h("div", { key: 'd3bca43144b06b50091b54dee5c8734de4f80d60', class: "viewport-margins" }, h("p", { key: 'a3d974ea56f521406bffc2a8eaf6b6e6c57bb595', class: "built-with" }, "Built with the ", h("a", { key: '7aa9fc3901510e0ad7d2b0ca4abf4f8c6f92d735', href: "https://designsystem.library.upenn.edu/" }, "Penn Libraries Design System"), ".")))));
363
96
  }
364
97
  static get assetsDirs() { return ["assets"]; }
365
98
  get hostElement() { return getElement(this); }
@@ -424,5 +157,5 @@ const Header = class {
424
157
  };
425
158
  Header.style = pennlibsHeaderCss;
426
159
 
427
- export { Autocomplete as pennlibs_autocomplete, PennlibsFeedback as pennlibs_feedback, Footer as pennlibs_footer, Header as pennlibs_header };
428
- //# sourceMappingURL=pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.js.map
160
+ export { PennlibsFeedback as pennlibs_feedback, Footer as pennlibs_footer, Header as pennlibs_header };
161
+ //# sourceMappingURL=pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.js.map
@@ -1,4 +1,4 @@
1
- import { r as registerInstance, h, c as getElement } from './index-CNQ9-Wwh.js';
1
+ import { r as registerInstance, h, a as getElement } from './index-mkVX9lU0.js';
2
2
 
3
3
  const pennlibsHeroCss = ":host{--pl-hero-height:clamp(42vh, 32rem, 26rem);--pl-hero-heading-font:var(--pl-font-serif);--pl-hero-color:var(--pl-color-fg-on-emphasis)}*,*:before,*:after{box-sizing:inherit}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0}.viewport-margins{width:100%;max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.hero{position:relative;min-height:var(--pl-hero-height);height:100%;background-size:cover;background-repeat:no-repeat;background-position:50% 33%;display:flex}.hero::before{content:\"\";display:flex;width:100%;height:100%;top:0;position:absolute;background:linear-gradient(360deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 20%, rgba(0, 0, 0, 0.4) 40%, rgba(0, 0, 0, 0.05) 100%);z-index:0}.hero::after{content:\"\";display:flex;width:100%;height:100%;top:0;position:absolute;background:linear-gradient(180deg, rgba(1, 31, 91, 1) 0%, rgba(1, 31, 91, 0.9) 10%, rgba(1, 31, 91, 0.8) 20%, rgba(1, 31, 91, 0.1) 50%, rgba(1, 31, 91, 0.0) 100%);z-index:0}.hero__content{position:relative;display:flex;flex-direction:column;width:100%;z-index:1}.hero__heading-container{margin-top:auto;padding-top:var(--pl-space-3xl);padding-bottom:var(--pl-space-3xl)}.hero__heading{text-shadow:1px 1px 2px var(--pl-color-fg-default);line-height:1.1;font-size:3em;font-weight:400;font-family:var(--pl-hero-heading-font);text-wrap:pretty;max-width:30ch;margin:0;color:var(--pl-hero-color)}@media (max-width: 920px){.hero__heading{font-size:2.5em}}.hero__sub-heading{font-size:1.25em;font-family:var(--pl-font-family);font-weight:500;color:var(--pl-hero-color);max-width:52ch;text-wrap:pretty;margin-top:1em;margin-bottom:0}.hero__sub-heading a{text-decoration:underline;text-underline-offset:var(--pl-link-text-underline-offset);text-decoration-thickness:var(--pl-link-text-decoration-thickness);color:var(--pl-hero-color)}.hero__sub-heading a:hover{text-decoration-thickness:var(--pl-link-hover-text-decoration-thickness)}.hero__sub-heading strong{font-weight:bold}@media (max-width: 620px){.hero__heading{font-size:2.75em}.hero__sub-heading{font-size:1em}}";
4
4
 
@@ -1,4 +1,4 @@
1
- import { r as registerInstance, h, c as getElement } from './index-CNQ9-Wwh.js';
1
+ import { r as registerInstance, h, a as getElement } from './index-mkVX9lU0.js';
2
2
 
3
3
  const pennlibsIiifImgCss = ":host{display:block;width:100%;max-width:100%;align-self:flex-start;aspect-ratio:var(--aspect-ratio, auto)}picture{display:block;line-height:0}.iiif-img{display:block;width:100%;max-width:100%;height:auto;opacity:0;filter:blur(5px);transition:opacity 0.15s ease-in, filter 0.15s ease-in}.iiif-img.loaded{opacity:1;filter:blur(0)}.fallback-container{display:block;width:100%;height:100%}.fallback-container pennlibs-fallback-img{width:100%;height:100%}pennlibs-fallback-img{display:block;width:100%;height:100%}";
4
4
 
package/dist/esm/web.js CHANGED
@@ -1,5 +1,5 @@
1
- import { p as promiseResolve, g as globalScripts, b as bootstrapLazy } from './index-CNQ9-Wwh.js';
2
- export { s as setNonce } from './index-CNQ9-Wwh.js';
1
+ import { p as promiseResolve, g as globalScripts, b as bootstrapLazy } from './index-mkVX9lU0.js';
2
+ export { s as setNonce } from './index-mkVX9lU0.js';
3
3
 
4
4
  /*
5
5
  Stencil Client Patch Browser v4.38.1 | MIT Licensed | https://stenciljs.com
@@ -16,6 +16,6 @@ var patchBrowser = () => {
16
16
 
17
17
  patchBrowser().then(async (options) => {
18
18
  await globalScripts();
19
- return bootstrapLazy([["pennlibs-iiif-img",[[257,"pennlibs-iiif-img",{"uuid":[1],"alt":[1],"region":[513],"rotation":[1],"quality":[1],"loading":[1],"showFallback":[4,"show-fallback"],"isLoaded":[32],"hasError":[32],"imageDimensions":[32],"observedWidth":[32]},null,{"region":["handleRegionChange"]}]]],["pennlibs-autocomplete_4",[[257,"pennlibs-autocomplete",{"for":[1],"showSuggestions":[32],"currentIndex":[32],"originalValue":[32],"options":[32]},[[0,"slotchange","handleSlotChange"],[16,"input","handleInputEvent"],[16,"focus","handleFocusEvent"],[16,"blur","handleBlurEvent"],[0,"focusout","handleFocusOut"],[4,"keydown","handleKeyDown"]]],[257,"pennlibs-feedback",{"hideQuestion":[4,"hide-question"],"error":[32],"answer":[32]}],[257,"pennlibs-footer",{"navigationByChildren":[32]}],[257,"pennlibs-header",{"serviceName":[1,"service-name"],"serviceLede":[1,"service-lede"],"serviceHref":[1,"service-href"],"theme":[1],"isMenuOpen":[32],"navigation":[32]}]]],["pennlibs-banner",[[257,"pennlibs-banner"]]],["pennlibs-chat",[[257,"pennlibs-chat",{"href":[32]}]]],["pennlibs-hero",[[257,"pennlibs-hero",{"heroPictureElement":[32],"heroHeadingElement":[32],"heroParagraphElement":[32],"heroSrc":[32]}]]],["pennlibs-fallback-img",[[257,"pennlibs-fallback-img"]]]], options);
19
+ return bootstrapLazy([["pennlibs-iiif-img",[[257,"pennlibs-iiif-img",{"uuid":[1],"alt":[1],"region":[513],"rotation":[1],"quality":[1],"loading":[1],"showFallback":[4,"show-fallback"],"isLoaded":[32],"hasError":[32],"imageDimensions":[32],"observedWidth":[32]},null,{"region":["handleRegionChange"]}]]],["pennlibs-feedback_3",[[257,"pennlibs-feedback",{"hideQuestion":[4,"hide-question"],"answer":[32],"selected":[32]}],[257,"pennlibs-footer",{"showBuiltWith":[4,"show-built-with"],"navigationByChildren":[32]}],[257,"pennlibs-header",{"serviceName":[1,"service-name"],"serviceLede":[1,"service-lede"],"serviceHref":[1,"service-href"],"theme":[1],"isMenuOpen":[32],"navigation":[32]}]]],["pennlibs-autocomplete",[[257,"pennlibs-autocomplete",{"for":[1],"showSuggestions":[32],"currentIndex":[32],"originalValue":[32],"options":[32]},[[0,"slotchange","handleSlotChange"],[16,"input","handleInputEvent"],[16,"focus","handleFocusEvent"],[16,"blur","handleBlurEvent"],[0,"focusout","handleFocusOut"],[4,"keydown","handleKeyDown"]]]]],["pennlibs-banner",[[257,"pennlibs-banner"]]],["pennlibs-chat",[[257,"pennlibs-chat",{"href":[32]}]]],["pennlibs-hero",[[257,"pennlibs-hero",{"heroPictureElement":[32],"heroHeadingElement":[32],"heroParagraphElement":[32],"heroSrc":[32]}]]],["pennlibs-fallback-img",[[257,"pennlibs-fallback-img"]]]], options);
20
20
  });
21
21
  //# sourceMappingURL=web.js.map
@@ -15,8 +15,8 @@ export declare class PennlibsFeedback {
15
15
  * When true, hides the yes/no question and only shows the "share your feedback" link.
16
16
  */
17
17
  hideQuestion: boolean;
18
- error: boolean;
19
18
  answer: string | undefined;
19
+ selected: string | undefined;
20
20
  /**
21
21
  * Emitted when a visitor answers the feedback question. Includes the question,
22
22
  * answer, current URL, and page heading/title for context.
@@ -24,6 +24,10 @@
24
24
  * @prop --pl-viewport-margins-gutter: The gutter width of the footer content.
25
25
  */
26
26
  export declare class Footer {
27
+ /**
28
+ * When true, shows a "Built with the Penn Libraries Design System" line below the footer.
29
+ */
30
+ showBuiltWith: boolean;
27
31
  navigationByChildren: any;
28
32
  hostElement: HTMLElement;
29
33
  componentWillLoad(): void;
@@ -59,6 +59,11 @@ export namespace Components {
59
59
  * @prop --pl-viewport-margins-gutter: The gutter width of the footer content.
60
60
  */
61
61
  interface PennlibsFooter {
62
+ /**
63
+ * When true, shows a "Built with the Penn Libraries Design System" line below the footer.
64
+ * @default false
65
+ */
66
+ "showBuiltWith": boolean;
62
67
  }
63
68
  /**
64
69
  * A header component for Penn Libraries websites that displays the Penn Libraries logo,
@@ -376,6 +381,11 @@ declare namespace LocalJSX {
376
381
  * @prop --pl-viewport-margins-gutter: The gutter width of the footer content.
377
382
  */
378
383
  interface PennlibsFooter {
384
+ /**
385
+ * When true, shows a "Built with the Penn Libraries Design System" line below the footer.
386
+ * @default false
387
+ */
388
+ "showBuiltWith"?: boolean;
379
389
  }
380
390
  /**
381
391
  * A header component for Penn Libraries websites that displays the Penn Libraries logo,
@@ -1,2 +1,2 @@
1
- export { e as setAssetPath } from './p-CNQ9-Wwh.js';
1
+ export { e as setAssetPath } from './p-mkVX9lU0.js';
2
2
  //# sourceMappingURL=index.esm.js.map
@@ -1,4 +1,4 @@
1
- import { r as registerInstance, a as getAssetPath, h } from './p-CNQ9-Wwh.js';
1
+ import { r as registerInstance, d as getAssetPath, h } from './p-mkVX9lU0.js';
2
2
 
3
3
  const pennlibsBannerCss = ":host{font-family:var(--pl-font-family);font-size:var(--pl-font-size);--max-width:1080px}.viewport-margins{max-width:calc(var(--max-width) + 0.5em);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.skip-to-content-link{position:absolute;transform:translateY(-300%);background:var(--pl-color-bg-default);left:0.5em;padding:0.5em 1em;margin-top:0.5em;position:absolute}.skip-to-content-link:focus{transform:translateY(0%);color:var(--pl-color-fg-default)}.universal-nav{background:var(--pl-color-penn-blue)}.universal-nav ul{display:flex;align-items:baseline;flex-wrap:wrap;scrollbar-color:var(--pl-color-penn-red);list-style:none;padding:0;margin:0}.universal-nav li{display:inline-block}.universal-nav a{display:inline-block;text-transform:uppercase;font-size:0.75em;letter-spacing:0.075em;font-weight:600;color:var(--pl-color-fg-subtle-on-emphasis);padding:0.5em;text-decoration:none}.universal-nav a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.15em}.universal-nav__shield-image{vertical-align:sub;height:1em;padding-right:0.5em;height:auto}";
4
4