@penn-libraries/web 1.2.0-dev.2 → 1.2.1-dev.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.
- package/dist/cjs/{index-Ag6DtE87.js → index-C2lJ0X_b.js} +64 -2
- package/dist/cjs/index-C2lJ0X_b.js.map +1 -0
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/pennlibs-autocomplete.cjs.entry.js +281 -0
- package/dist/cjs/pennlibs-autocomplete.entry.cjs.js.map +1 -0
- package/dist/cjs/pennlibs-banner.cjs.entry.js +1 -1
- package/dist/cjs/pennlibs-chat.cjs.entry.js +1 -1
- package/dist/cjs/pennlibs-fallback-img.cjs.entry.js +1 -1
- package/dist/cjs/pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.cjs.js.map +1 -0
- package/dist/cjs/{pennlibs-autocomplete_4.cjs.entry.js → pennlibs-feedback_3.cjs.entry.js} +29 -299
- package/dist/cjs/pennlibs-hero.cjs.entry.js +1 -1
- package/dist/cjs/pennlibs-iiif-img.cjs.entry.js +1 -1
- package/dist/cjs/web.cjs.js +2 -2
- package/dist/collection/components/pennlibs-feedback/pennlibs-feedback.css +22 -1
- package/dist/collection/components/pennlibs-feedback/pennlibs-feedback.js +29 -23
- package/dist/collection/components/pennlibs-feedback/pennlibs-feedback.js.map +1 -1
- package/dist/components/pennlibs-feedback.js +30 -25
- package/dist/components/pennlibs-feedback.js.map +1 -1
- package/dist/docs.json +2 -2
- package/dist/{web/p-CNQ9-Wwh.js → esm/index-kmszRyIe.js} +65 -3
- package/dist/esm/index-kmszRyIe.js.map +1 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/esm/pennlibs-autocomplete.entry.js +279 -0
- package/dist/esm/pennlibs-autocomplete.entry.js.map +1 -0
- package/dist/esm/pennlibs-banner.entry.js +1 -1
- package/dist/esm/pennlibs-chat.entry.js +1 -1
- package/dist/esm/pennlibs-fallback-img.entry.js +1 -1
- package/dist/esm/pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.js.map +1 -0
- package/dist/esm/{pennlibs-autocomplete_4.entry.js → pennlibs-feedback_3.entry.js} +30 -299
- package/dist/esm/pennlibs-hero.entry.js +1 -1
- package/dist/esm/pennlibs-iiif-img.entry.js +1 -1
- package/dist/esm/web.js +3 -3
- package/dist/types/components/pennlibs-feedback/pennlibs-feedback.d.ts +2 -2
- package/dist/web/index.esm.js +1 -1
- package/dist/web/p-1c0dd1ec.entry.js +279 -0
- package/dist/web/{p-3da26275.entry.js → p-37644cf5.entry.js} +30 -299
- package/dist/web/{p-662e4125.entry.js → p-51bc70b8.entry.js} +1 -1
- package/dist/web/{p-eb633f4d.entry.js → p-906263a3.entry.js} +1 -1
- package/dist/web/{p-c96a3643.entry.js → p-badb334a.entry.js} +1 -1
- package/dist/web/{p-b6e686d1.entry.js → p-d392e98a.entry.js} +1 -1
- package/dist/web/{p-a34e1e3e.entry.js → p-e1947e84.entry.js} +1 -1
- package/dist/{esm/index-CNQ9-Wwh.js → web/p-kmszRyIe.js} +65 -3
- package/dist/web/p-kmszRyIe.js.map +1 -0
- package/dist/web/pennlibs-autocomplete.entry.esm.js.map +1 -0
- package/dist/web/pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.esm.js.map +1 -0
- package/dist/web/web.esm.js +3 -3
- package/hydrate/index.js +59 -24
- package/hydrate/index.mjs +59 -24
- package/package.json +1 -1
- package/dist/cjs/index-Ag6DtE87.js.map +0 -1
- package/dist/cjs/pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.cjs.js.map +0 -1
- package/dist/esm/index-CNQ9-Wwh.js.map +0 -1
- package/dist/esm/pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.js.map +0 -1
- package/dist/web/p-CNQ9-Wwh.js.map +0 -1
- package/dist/web/pennlibs-autocomplete.pennlibs-feedback.pennlibs-footer.pennlibs-header.entry.esm.js.map +0 -1
|
@@ -1,45 +1,47 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
|
-
const pennlibsFeedbackCss = "
|
|
3
|
+
const pennlibsFeedbackCss = ".feedback__container.sc-pennlibs-feedback{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{.sc-pennlibs-feedback-h{display:none}}*.sc-pennlibs-feedback,*.sc-pennlibs-feedback::before,*.sc-pennlibs-feedback::after{box-sizing:border-box}.viewport-margins.sc-pennlibs-feedback{max-width:var(--pl-viewport-margins-max-width);margin:0 auto;padding:0 var(--pl-viewport-margins-gutter, 1em)}.feedback__content.sc-pennlibs-feedback{display:flex;justify-content:space-between;gap:var(--pl-space-s);flex-wrap:wrap}.feedback__inline-question.sc-pennlibs-feedback{display:flex;flex-wrap:wrap;gap:0.5em;align-items:center}h2.sc-pennlibs-feedback{display:inline-block;margin:0;font-family:var(--pl-font-sans-serif);font-size:1em;font-weight:400}p.sc-pennlibs-feedback{margin:0;padding:calc(0.5em + 1px) 0}strong.sc-pennlibs-feedback{font-weight:600}a.sc-pennlibs-feedback{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.sc-pennlibs-feedback{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.sc-pennlibs-feedback:hover{cursor:pointer}button.sc-pennlibs-feedback:hover span.sc-pennlibs-feedback{text-decoration:underline}button.selected.sc-pennlibs-feedback{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.sc-pennlibs-feedback+.feedback__share-feedback.sc-pennlibs-feedback,p.sc-pennlibs-feedback{animation:none}.feedback__content.sc-pennlibs-feedback>p.sc-pennlibs-feedback{animation:fadeIn 300ms ease-in}@keyframes fadeIn{from{opacity:0}to{opacity:1}}*.sc-pennlibs-feedback: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.sc-pennlibs-feedback: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.sc-pennlibs-feedback{display:block;width:100%;text-align:center}}.help-us.sc-pennlibs-feedback{display:flex;flex-direction:column;gap:0.5em}.visually-hidden.sc-pennlibs-feedback{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}.visually-hidden.sc-pennlibs-feedback:focus,.visually-hidden.sc-pennlibs-feedback:active{clip:auto;clip-path:none;height:auto;overflow:visible;position:static;white-space:normal;width:auto}";
|
|
4
4
|
|
|
5
|
-
const FEEDBACK_STORAGE_KEY =
|
|
6
|
-
const FEEDBACK_TIMESTAMP_KEY = 'pennlibs-feedback-timestamp';
|
|
5
|
+
const FEEDBACK_STORAGE_KEY = `pennlibs-feedback-${window.location.pathname}`;
|
|
7
6
|
const FEEDBACK_TTL = 5 * 60 * 1000; // 5 minutes
|
|
8
|
-
const FEEDBACK_QUESTION = '
|
|
9
|
-
const FEEDBACK_ERROR_STORAGE_KEY = 'pennlibs-feedback-error';
|
|
7
|
+
const FEEDBACK_QUESTION = 'Did you find what you need?';
|
|
10
8
|
const PennlibsFeedback$1 = /*@__PURE__*/ proxyCustomElement(class PennlibsFeedback extends HTMLElement {
|
|
11
9
|
constructor(registerHost) {
|
|
12
10
|
super();
|
|
13
11
|
if (registerHost !== false) {
|
|
14
12
|
this.__registerHost();
|
|
15
13
|
}
|
|
16
|
-
this.__attachShadow();
|
|
17
14
|
this.feedbackEvent = createEvent(this, "pennlibs-feedback", 7);
|
|
18
15
|
/**
|
|
19
16
|
* When true, hides the yes/no question and only shows the "share your feedback" link.
|
|
20
17
|
*/
|
|
21
18
|
this.hideQuestion = false;
|
|
22
|
-
this.error = false;
|
|
23
19
|
this.answer = undefined;
|
|
20
|
+
this.selected = undefined;
|
|
24
21
|
}
|
|
25
22
|
componentWillLoad() {
|
|
26
|
-
const
|
|
27
|
-
if (
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
23
|
+
const stored = sessionStorage.getItem(FEEDBACK_STORAGE_KEY);
|
|
24
|
+
if (stored) {
|
|
25
|
+
try {
|
|
26
|
+
const { answer, timestamp } = JSON.parse(stored);
|
|
27
|
+
if (Date.now() - timestamp > FEEDBACK_TTL) {
|
|
28
|
+
sessionStorage.removeItem(FEEDBACK_STORAGE_KEY);
|
|
29
|
+
}
|
|
30
|
+
else {
|
|
31
|
+
this.answer = answer;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
catch (_a) {
|
|
35
|
+
sessionStorage.removeItem(FEEDBACK_STORAGE_KEY);
|
|
36
|
+
}
|
|
36
37
|
}
|
|
37
38
|
}
|
|
38
|
-
|
|
39
|
+
handleSubmit(event) {
|
|
39
40
|
var _a;
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
41
|
+
event.preventDefault();
|
|
42
|
+
const answer = event.submitter.value;
|
|
43
|
+
this.selected = answer;
|
|
44
|
+
sessionStorage.setItem(FEEDBACK_STORAGE_KEY, JSON.stringify({ answer, timestamp: Date.now() }));
|
|
43
45
|
this.feedbackEvent.emit({
|
|
44
46
|
question: FEEDBACK_QUESTION,
|
|
45
47
|
answer: answer,
|
|
@@ -47,15 +49,18 @@ const PennlibsFeedback$1 = /*@__PURE__*/ proxyCustomElement(class PennlibsFeedba
|
|
|
47
49
|
pageHeading: ((_a = document.querySelector('h1')) === null || _a === void 0 ? void 0 : _a.textContent) || undefined,
|
|
48
50
|
pageTitle: document.title || undefined
|
|
49
51
|
});
|
|
52
|
+
setTimeout(() => {
|
|
53
|
+
this.answer = answer;
|
|
54
|
+
}, 600);
|
|
50
55
|
}
|
|
51
56
|
render() {
|
|
52
|
-
return (h("div", { key: '
|
|
57
|
+
return (h("div", { key: '013c3b140f249641d412bd0c19108a6c51d2f12e', class: "feedback__container" }, h("div", { key: 'ef51ab5c419dfdd8679b027882a59171480ea039', class: "viewport-margins" }, h("div", { key: '2c61b86b1e69037d7d63ecde5288bfcc0e1dad75', 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("form", { class: "feedback__inline-question", onSubmit: (e) => this.handleSubmit(e) }, h("h2", null, "Did you find what you need?"), h("button", { type: "submit", name: "answer", value: "yes", class: { 'selected': this.selected === 'yes' }, disabled: !!this.selected }, h("span", null, "Yes"), h("span", { class: "visually-hidden" }, ", I found what I needed.")), h("button", { type: "submit", name: "answer", value: "no", class: { 'selected': this.selected === 'no' }, disabled: !!this.selected }, h("span", null, "No"), h("span", { class: "visually-hidden" }, ", I did not find what I needed."))))), h("div", { key: '90ccdacc682229570f83867f8d8f587a3e0c16aa', class: "feedback__share-feedback" }, h("p", { key: 'edd15c793ac6af5d31bd98863cd76fce27aed69a' }, "To help us improve, ", h("a", { key: '25f5c322d0fb717b8618b40625af978d57f805bd', href: `https://upenn.co1.qualtrics.com/jfe/form/SV_3xVrP7EKWS92zfE?reporting_from_url=${encodeURIComponent(window.location.href)}` }, "share your feedback"), "."))))));
|
|
53
58
|
}
|
|
54
59
|
static get style() { return pennlibsFeedbackCss; }
|
|
55
|
-
}, [
|
|
60
|
+
}, [258, "pennlibs-feedback", {
|
|
56
61
|
"hideQuestion": [4, "hide-question"],
|
|
57
|
-
"
|
|
58
|
-
"
|
|
62
|
+
"answer": [32],
|
|
63
|
+
"selected": [32]
|
|
59
64
|
}]);
|
|
60
65
|
function defineCustomElement$1() {
|
|
61
66
|
if (typeof customElements === "undefined") {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"pennlibs-feedback.js","mappings":"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","names":["PennlibsFeedback","__stencil_proxyCustomElement"],"sources":["src/components/pennlibs-feedback/pennlibs-feedback.css?tag=pennlibs-feedback&encapsulation=shadow","src/components/pennlibs-feedback/pennlibs-feedback.tsx"],"sourcesContent":["/* Component Root Styles\n---------------------------------------- */\n:host {\n display: block;\n background: #eeeff4;\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n color: var(--pl-color-fg-default);\n line-height: 1.4;\n box-sizing: border-box;\n padding: 0.75em 0;\n}\n\n@media print {\n :host {\n display: none;\n }\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\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.feedback__content {\n display: flex;\n justify-content: space-between;\n gap: var(--pl-space-s);\n flex-wrap: wrap;\n}\n\n/* Container Layout\n---------------------------------------- */\n.feedback__inline-question {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5em;\n align-items: center;\n}\n\n/* Typography\n---------------------------------------- */\nh2 {\n display: inline-block;\n margin: 0;\n font-family: var(--pl-font-sans-serif);\n font-size: 1em;\n font-weight: 400;\n}\n\np {\n margin: 0;\n padding: calc(0.5em + 1px) 0;\n}\n\nstrong {\n font-weight: 600;\n}\n\n/* Links\n---------------------------------------- */\na {\n color: var(--pl-color-fg-accent);\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n text-decoration-thickness: var(--pl-link-hover-text-decoration-thickness);\n}\n\n/* Buttons\n---------------------------------------- */\nbutton {\n all: unset;\n display: flex;\n align-items: center;\n gap: 0.5em;\n padding: 0.25em 1.25em;\n font-family: var(--pl-font-family);\n font-weight: 500;\n line-height: 1.4;\n color: var(--pl-color-fg-default);\n background: var(--pl-color-bg-default);\n border: solid 1px var(--pl-color-fg-subtle);\n border-radius: 1em;\n box-sizing: border-box;\n}\n\nbutton:hover {\n cursor: pointer;\n}\n\nbutton:hover span {\n text-decoration: underline;\n}\n\n/* Focus States\n---------------------------------------- */\n*:focus {\n outline: 0;\n box-shadow: \n 0 0 0 2px var(--pl-color-bg-attention),\n 0 0 0 3px var(--pl-color-bg-emphasis);\n}\n\np:focus {\n outline: none;\n box-shadow: 0 0 0 2px var(--pl-color-bg-attention), 0 0 0 3px var(--pl-color-bg-emphasis);\n}\n\n/* Responsive Adjustments\n---------------------------------------- */\n@media (max-width: 26em) {\n h2 {\n display: block;\n width: 100%;\n text-align: center;\n }\n}\n\n.help-us {\n display: flex;\n flex-direction: column;\n gap: 0.5em;\n}\n\n/* Accessibility Helpers\n---------------------------------------- */\n.visually-hidden {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n/* This ensures the element remains hidden even when focused */\n.visually-hidden:focus,\n.visually-hidden:active {\n clip: auto;\n clip-path: none;\n height: auto;\n overflow: visible;\n position: static;\n white-space: normal;\n width: auto;\n}","import { Component, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\nconst FEEDBACK_STORAGE_KEY = 'pennlibs-feedback-answer';\nconst FEEDBACK_TIMESTAMP_KEY = 'pennlibs-feedback-timestamp';\nconst FEEDBACK_TTL = 5 * 60 * 1000; // 5 minutes\nconst FEEDBACK_QUESTION = 'Is this page useful?';\nconst FEEDBACK_ERROR_STORAGE_KEY = 'pennlibs-feedback-error';\n\n/**\n * A feedback component that asks visitors \"Did you find what you need?\" and\n * links to a feedback form. The answer is stored in sessionStorage for 5 minutes\n * to avoid re-prompting during a browsing session.\n *\n * @example\n * <pennlibs-feedback></pennlibs-feedback>\n *\n * @example\n * <pennlibs-feedback hide-question></pennlibs-feedback>\n */\n@Component({\n tag: 'pennlibs-feedback',\n styleUrl: 'pennlibs-feedback.css',\n shadow: true,\n})\nexport class PennlibsFeedback {\n /**\n * When true, hides the yes/no question and only shows the \"share your feedback\" link.\n */\n @Prop() hideQuestion: boolean = false;\n\n @State() error: boolean = false;\n @State() answer: string | undefined = undefined;\n\n /**\n * Emitted when a visitor answers the feedback question. Includes the question,\n * answer, current URL, and page heading/title for context.\n */\n @Event({\n eventName: 'pennlibs-feedback',\n composed: true,\n cancelable: true,\n bubbles: true,\n }) feedbackEvent!: EventEmitter<{\n question: string;\n answer: string;\n url: string;\n pageHeading?: string;\n pageTitle?: string;\n }>;\n\n componentWillLoad() {\n const timestamp = sessionStorage.getItem(FEEDBACK_TIMESTAMP_KEY);\n if (timestamp && Date.now() - Number(timestamp) > FEEDBACK_TTL) {\n sessionStorage.removeItem(FEEDBACK_STORAGE_KEY);\n sessionStorage.removeItem(FEEDBACK_TIMESTAMP_KEY);\n }\n\n if (sessionStorage.getItem(FEEDBACK_STORAGE_KEY)) {\n this.answer = sessionStorage.getItem(FEEDBACK_STORAGE_KEY) as string;\n }\n\n if (sessionStorage.getItem(FEEDBACK_ERROR_STORAGE_KEY)) {\n this.error = sessionStorage.getItem(FEEDBACK_ERROR_STORAGE_KEY) === 'true';\n }\n }\n\n handleFeedback(answer: string) {\n this.answer = answer;\n sessionStorage.setItem(FEEDBACK_STORAGE_KEY, answer);\n sessionStorage.setItem(FEEDBACK_TIMESTAMP_KEY, String(Date.now()));\n \n this.feedbackEvent.emit({\n question: FEEDBACK_QUESTION,\n answer: answer,\n url: window.location.href,\n pageHeading: document.querySelector('h1')?.textContent || undefined,\n pageTitle: document.title || undefined\n });\n }\n \n render() {\n return (\n <div class=\"feedback__container\">\n <div class=\"viewport-margins\">\n <div class=\"feedback__content\">\n {!this.hideQuestion && (this.answer === 'yes' ? (\n <p>Thank you for letting us know.</p>\n ) : this.answer === 'no' ? (\n <p>Thank you for letting us know. <a href=\"https://www.library.upenn.edu/contact-us\">Contact us</a> if you need help.</p>\n ) : (\n <div class=\"feedback__inline-question\">\n <h2>Did you find what you need?</h2>\n <button onClick={() => this.handleFeedback('yes')}>\n <span>Yes</span><span class=\"visually-hidden\">, I found what I needed.</span>\n </button>\n <button onClick={() => this.handleFeedback('no')}>\n <span>No</span><span class=\"visually-hidden\">, I did not find what I needed.</span>\n </button>\n </div>\n ))}\n <div class=\"feedback__share-feedback\">\n <p>To help us improve, <a href=\"http://library.upenn.edu/feedback\">share your feedback</a>.</p>\n </div>\n </div>\n </div>\n </div>\n )\n }\n}\n\n"],"version":3}
|
|
1
|
+
{"file":"pennlibs-feedback.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,uzFAAuzF;;ACEn1F,MAAM,oBAAoB,GAAG,CAAqB,kBAAA,EAAA,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAA,CAAE;AAC5E,MAAM,YAAY,GAAG,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC;AACnC,MAAM,iBAAiB,GAAG,6BAA6B;MAmB1CA,kBAAgB,iBAAAC,kBAAA,CAAA,MAAA,gBAAA,SAAA,WAAA,CAAA;AAL7B,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAME;;AAEG;AACK,QAAA,IAAY,CAAA,YAAA,GAAY,KAAK;AAE5B,QAAA,IAAM,CAAA,MAAA,GAAuB,SAAS;AACtC,QAAA,IAAQ,CAAA,QAAA,GAAuB,SAAS;AAkFlD;IA/DC,iBAAiB,GAAA;QACf,MAAM,MAAM,GAAG,cAAc,CAAC,OAAO,CAAC,oBAAoB,CAAC;QAC3D,IAAI,MAAM,EAAE;AACV,YAAA,IAAI;AACF,gBAAA,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;gBAChD,IAAI,IAAI,CAAC,GAAG,EAAE,GAAG,SAAS,GAAG,YAAY,EAAE;AACzC,oBAAA,cAAc,CAAC,UAAU,CAAC,oBAAoB,CAAC;;qBAC1C;AACL,oBAAA,IAAI,CAAC,MAAM,GAAG,MAAM;;;YAEtB,OAAA,EAAA,EAAM;AACN,gBAAA,cAAc,CAAC,UAAU,CAAC,oBAAoB,CAAC;;;;AAKrD,IAAA,YAAY,CAAC,KAAkB,EAAA;;QAC7B,KAAK,CAAC,cAAc,EAAE;AACtB,QAAA,MAAM,MAAM,GAAI,KAAK,CAAC,SAA+B,CAAC,KAAK;AAC3D,QAAA,IAAI,CAAC,QAAQ,GAAG,MAAM;QACtB,cAAc,CAAC,OAAO,CAAC,oBAAoB,EAAE,IAAI,CAAC,SAAS,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;AAE/F,QAAA,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;AACtB,YAAA,QAAQ,EAAE,iBAAiB;AAC3B,YAAA,MAAM,EAAE,MAAM;AACd,YAAA,GAAG,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI;AACzB,YAAA,WAAW,EAAE,CAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,WAAW,KAAI,SAAS;AACnE,YAAA,SAAS,EAAE,QAAQ,CAAC,KAAK,IAAI;AAC9B,SAAA,CAAC;QAEF,UAAU,CAAC,MAAK;AACd,YAAA,IAAI,CAAC,MAAM,GAAG,MAAM;SACrB,EAAE,GAAG,CAAC;;IAGT,MAAM,GAAA;AACJ,QAAA,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,qBAAqB,EAAA,EAC9B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kBAAkB,EAAA,EAC3B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC3B,CAAC,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,MAAM,KAAK,KAAK,IAC3C,CAAA,CAAA,GAAA,EAAA,IAAA,EAAA,gCAAA,CAAqC,IACnC,IAAI,CAAC,MAAM,KAAK,IAAI,IACtB,CAAA,CAAA,GAAA,EAAA,IAAA,yBAAsB,CAAG,CAAA,GAAA,EAAA,EAAA,IAAI,EAAC,0CAA0C,EAAe,EAAA,YAAA,CAAA,8CAA6C,KAEpI,YAAM,KAAK,EAAC,2BAA2B,EAAC,QAAQ,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,YAAY,CAAC,CAA2B,CAAC,EAAA,EACrG,CAAoC,CAAA,IAAA,EAAA,IAAA,EAAA,6BAAA,CAAA,EACpC,CAAA,CAAA,QAAA,EAAA,EAAQ,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,KAAK,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,IAAI,CAAC,QAAQ,KAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAA,EACvH,CAAgB,CAAA,MAAA,EAAA,IAAA,EAAA,KAAA,CAAA,EAAA,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,iBAAiB,EAAA,EAAA,0BAAA,CAAgC,CACtE,EACT,CAAA,CAAA,QAAA,EAAA,EAAQ,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,IAAI,EAAC,KAAK,EAAE,EAAE,UAAU,EAAE,IAAI,CAAC,QAAQ,KAAK,IAAI,EAAE,EAAE,QAAQ,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,EAAA,EACrH,CAAe,CAAA,MAAA,EAAA,IAAA,EAAA,IAAA,CAAA,EAAA,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,iBAAiB,sCAAuC,CAC5E,CACJ,CACR,CAAC,EACF,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,0BAA0B,EAAA,EACnC,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,0BAAuB,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAG,IAAI,EAAE,kFAAkF,kBAAkB,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA,CAAE,EAAyB,EAAA,qBAAA,CAAA,EAAK,GAAA,CAAA,CACtL,CACF,CACF,CACF;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PennlibsFeedback","__stencil_proxyCustomElement"],"sources":["src/components/pennlibs-feedback/pennlibs-feedback.css?tag=pennlibs-feedback&encapsulation=scoped","src/components/pennlibs-feedback/pennlibs-feedback.tsx"],"sourcesContent":["/* Component Root Styles\n---------------------------------------- */\n.feedback__container {\n display: block;\n background: #eeeff4;\n font-family: var(--pl-font-family);\n font-size: var(--pl-font-size);\n color: var(--pl-color-fg-default);\n line-height: 1.4;\n box-sizing: border-box;\n padding: 0.75em 0;\n}\n\n@media print {\n :host {\n display: none;\n }\n}\n\n*, *::before, *::after {\n box-sizing: border-box;\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.feedback__content {\n display: flex;\n justify-content: space-between;\n gap: var(--pl-space-s);\n flex-wrap: wrap;\n}\n\n/* Container Layout\n---------------------------------------- */\n.feedback__inline-question {\n display: flex;\n flex-wrap: wrap;\n gap: 0.5em;\n align-items: center;\n}\n\n/* Typography\n---------------------------------------- */\nh2 {\n display: inline-block;\n margin: 0;\n font-family: var(--pl-font-sans-serif);\n font-size: 1em;\n font-weight: 400;\n}\n\np {\n margin: 0;\n padding: calc(0.5em + 1px) 0;\n}\n\nstrong {\n font-weight: 600;\n}\n\n/* Links\n---------------------------------------- */\na {\n color: var(--pl-color-fg-accent);\n text-decoration: underline;\n text-underline-offset: var(--pl-link-text-underline-offset);\n text-decoration-thickness: var(--pl-link-hover-text-decoration-thickness);\n}\n\n/* Buttons\n---------------------------------------- */\nbutton {\n all: unset;\n display: flex;\n align-items: center;\n gap: 0.5em;\n padding: 0.25em 1.25em;\n font-family: var(--pl-font-family);\n font-weight: 500;\n line-height: 1.4;\n color: var(--pl-color-fg-default);\n background: var(--pl-color-bg-default);\n border: solid 1px var(--pl-color-fg-subtle);\n border-radius: 1em;\n box-sizing: border-box;\n}\n\nbutton:hover {\n cursor: pointer;\n}\n\nbutton:hover span {\n text-decoration: underline;\n}\n\nbutton.selected {\n background: var(--pl-color-bg-accent-emphasis);\n color: var(--pl-color-fg-on-emphasis);\n border-color: var(--pl-color-bg-accent-emphasis);\n}\n\n/* Thank you message fade-in */\n.feedback__inline-question + .feedback__share-feedback,\np {\n animation: none;\n}\n\n.feedback__content > p {\n animation: fadeIn 300ms ease-in;\n}\n\n@keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n}\n\n/* Focus States\n---------------------------------------- */\n*:focus {\n outline: 0;\n box-shadow: \n 0 0 0 2px var(--pl-color-bg-attention),\n 0 0 0 3px var(--pl-color-bg-emphasis);\n}\n\np:focus {\n outline: none;\n box-shadow: 0 0 0 2px var(--pl-color-bg-attention), 0 0 0 3px var(--pl-color-bg-emphasis);\n}\n\n/* Responsive Adjustments\n---------------------------------------- */\n@media (max-width: 26em) {\n h2 {\n display: block;\n width: 100%;\n text-align: center;\n }\n}\n\n.help-us {\n display: flex;\n flex-direction: column;\n gap: 0.5em;\n}\n\n/* Accessibility Helpers\n---------------------------------------- */\n.visually-hidden {\n clip: rect(0 0 0 0);\n clip-path: inset(50%);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap;\n width: 1px;\n}\n\n/* This ensures the element remains hidden even when focused */\n.visually-hidden:focus,\n.visually-hidden:active {\n clip: auto;\n clip-path: none;\n height: auto;\n overflow: visible;\n position: static;\n white-space: normal;\n width: auto;\n}","import { Component, h, Prop, State, Event, EventEmitter } from '@stencil/core';\n\nconst FEEDBACK_STORAGE_KEY = `pennlibs-feedback-${window.location.pathname}`;\nconst FEEDBACK_TTL = 5 * 60 * 1000; // 5 minutes\nconst FEEDBACK_QUESTION = 'Did you find what you need?';\n\n\n/**\n * A feedback component that asks visitors \"Did you find what you need?\" and\n * links to a feedback form. The answer is stored in sessionStorage for 5 minutes\n * to avoid re-prompting during a browsing session.\n *\n * @example\n * <pennlibs-feedback></pennlibs-feedback>\n *\n * @example\n * <pennlibs-feedback hide-question></pennlibs-feedback>\n */\n@Component({\n tag: 'pennlibs-feedback',\n styleUrl: 'pennlibs-feedback.css',\n scoped: true,\n})\nexport class PennlibsFeedback {\n /**\n * When true, hides the yes/no question and only shows the \"share your feedback\" link.\n */\n @Prop() hideQuestion: boolean = false;\n\n @State() answer: string | undefined = undefined;\n @State() selected: string | undefined = undefined;\n\n /**\n * Emitted when a visitor answers the feedback question. Includes the question,\n * answer, current URL, and page heading/title for context.\n */\n @Event({\n eventName: 'pennlibs-feedback',\n composed: true,\n cancelable: true,\n bubbles: true,\n }) feedbackEvent!: EventEmitter<{\n question: string;\n answer: string;\n url: string;\n pageHeading?: string;\n pageTitle?: string;\n }>;\n\n componentWillLoad() {\n const stored = sessionStorage.getItem(FEEDBACK_STORAGE_KEY);\n if (stored) {\n try {\n const { answer, timestamp } = JSON.parse(stored);\n if (Date.now() - timestamp > FEEDBACK_TTL) {\n sessionStorage.removeItem(FEEDBACK_STORAGE_KEY);\n } else {\n this.answer = answer;\n }\n } catch {\n sessionStorage.removeItem(FEEDBACK_STORAGE_KEY);\n }\n }\n }\n\n handleSubmit(event: SubmitEvent) {\n event.preventDefault();\n const answer = (event.submitter as HTMLButtonElement).value;\n this.selected = answer;\n sessionStorage.setItem(FEEDBACK_STORAGE_KEY, JSON.stringify({ answer, timestamp: Date.now() }));\n\n this.feedbackEvent.emit({\n question: FEEDBACK_QUESTION,\n answer: answer,\n url: window.location.href,\n pageHeading: document.querySelector('h1')?.textContent || undefined,\n pageTitle: document.title || undefined\n });\n\n setTimeout(() => {\n this.answer = answer;\n }, 600);\n }\n \n render() {\n return (\n <div class=\"feedback__container\">\n <div class=\"viewport-margins\">\n <div class=\"feedback__content\">\n {!this.hideQuestion && (this.answer === 'yes' ? (\n <p>Thank you for letting us know.</p>\n ) : this.answer === 'no' ? (\n <p>We'd like to help. <a href=\"https://www.library.upenn.edu/contact-us\">Contact us</a> and let us know what you're looking for.</p>\n ) : (\n <form class=\"feedback__inline-question\" onSubmit={(e) => this.handleSubmit(e as unknown as SubmitEvent)}>\n <h2>Did you find what you need?</h2>\n <button type=\"submit\" name=\"answer\" value=\"yes\" class={{ 'selected': this.selected === 'yes' }} disabled={!!this.selected}>\n <span>Yes</span><span class=\"visually-hidden\">, I found what I needed.</span>\n </button>\n <button type=\"submit\" name=\"answer\" value=\"no\" class={{ 'selected': this.selected === 'no' }} disabled={!!this.selected}>\n <span>No</span><span class=\"visually-hidden\">, I did not find what I needed.</span>\n </button>\n </form>\n ))}\n <div class=\"feedback__share-feedback\">\n <p>To help us improve, <a href={`https://upenn.co1.qualtrics.com/jfe/form/SV_3xVrP7EKWS92zfE?reporting_from_url=${encodeURIComponent(window.location.href)}`}>share your feedback</a>.</p>\n </div>\n </div>\n </div>\n </div>\n )\n }\n}\n\n"],"version":3}
|
package/dist/docs.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"timestamp": "2026-03-
|
|
2
|
+
"timestamp": "2026-03-18T14:51:55",
|
|
3
3
|
"compiler": {
|
|
4
4
|
"name": "@stencil/core",
|
|
5
5
|
"version": "4.38.1",
|
|
@@ -189,7 +189,7 @@
|
|
|
189
189
|
},
|
|
190
190
|
{
|
|
191
191
|
"filePath": "src/components/pennlibs-feedback/pennlibs-feedback.tsx",
|
|
192
|
-
"encapsulation": "
|
|
192
|
+
"encapsulation": "scoped",
|
|
193
193
|
"tag": "pennlibs-feedback",
|
|
194
194
|
"readme": "# pennlibs-feedback\n\n\n",
|
|
195
195
|
"docs": "A feedback component that asks visitors \"Did you find what you need?\" and\nlinks to a feedback form. The answer is stored in sessionStorage for 5 minutes\nto avoid re-prompting during a browsing session.",
|
|
@@ -201,6 +201,9 @@ var getAssetPath = (path) => {
|
|
|
201
201
|
return assetUrl.origin !== win.location.origin ? assetUrl.href : assetUrl.pathname;
|
|
202
202
|
};
|
|
203
203
|
var setAssetPath = (path) => plt.$resourcesUrl$ = path;
|
|
204
|
+
|
|
205
|
+
// src/utils/helpers.ts
|
|
206
|
+
var isDef = (v) => v != null && v !== void 0;
|
|
204
207
|
var isComplexType = (o) => {
|
|
205
208
|
o = typeof o;
|
|
206
209
|
return o === "object" || o === "function";
|
|
@@ -711,6 +714,16 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
|
|
|
711
714
|
const shadowRootNodes = shadowRoot ? [] : null;
|
|
712
715
|
const vnode = newVNode(tagName, null);
|
|
713
716
|
vnode.$elm$ = hostElm;
|
|
717
|
+
let scopeId2;
|
|
718
|
+
{
|
|
719
|
+
const cmpMeta = hostRef.$cmpMeta$;
|
|
720
|
+
if (cmpMeta && cmpMeta.$flags$ & 10 /* needsScopedEncapsulation */ && hostElm["s-sc"]) {
|
|
721
|
+
scopeId2 = hostElm["s-sc"];
|
|
722
|
+
hostElm.classList.add(scopeId2 + "-h");
|
|
723
|
+
} else if (hostElm["s-sc"]) {
|
|
724
|
+
delete hostElm["s-sc"];
|
|
725
|
+
}
|
|
726
|
+
}
|
|
714
727
|
if (win.document && (!plt.$orgLocNodes$ || !plt.$orgLocNodes$.size)) {
|
|
715
728
|
initializeDocumentHydrate(win.document.body, plt.$orgLocNodes$ = /* @__PURE__ */ new Map());
|
|
716
729
|
}
|
|
@@ -814,6 +827,11 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
|
|
|
814
827
|
}
|
|
815
828
|
}
|
|
816
829
|
}
|
|
830
|
+
if (scopeId2 && slotNodes.length) {
|
|
831
|
+
slotNodes.forEach((slot) => {
|
|
832
|
+
slot.$elm$.parentElement.classList.add(scopeId2 + "-s");
|
|
833
|
+
});
|
|
834
|
+
}
|
|
817
835
|
if (shadowRoot) {
|
|
818
836
|
let rnIdex = 0;
|
|
819
837
|
const rnLen = shadowRootNodes.length;
|
|
@@ -843,6 +861,7 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
|
|
|
843
861
|
let childIdSplt;
|
|
844
862
|
let childVNode;
|
|
845
863
|
let i2;
|
|
864
|
+
const scopeId2 = hostElm["s-sc"];
|
|
846
865
|
if (node.nodeType === 1 /* ElementNode */) {
|
|
847
866
|
childNodeType = node.getAttribute(HYDRATE_CHILD_ID);
|
|
848
867
|
if (childNodeType) {
|
|
@@ -865,6 +884,10 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
|
|
|
865
884
|
if (!parentVNode.$children$) {
|
|
866
885
|
parentVNode.$children$ = [];
|
|
867
886
|
}
|
|
887
|
+
if (scopeId2 && childIdSplt[0] === hostId) {
|
|
888
|
+
node["s-si"] = scopeId2;
|
|
889
|
+
childVNode.$attrs$.class += " " + scopeId2;
|
|
890
|
+
}
|
|
868
891
|
const slotName = childVNode.$elm$.getAttribute("s-sn");
|
|
869
892
|
if (typeof slotName === "string") {
|
|
870
893
|
if (childVNode.$tag$ === "slot-fb") {
|
|
@@ -879,6 +902,9 @@ var clientHydrate = (parentVNode, childRenderNodes, slotNodes, shadowRootNodes,
|
|
|
879
902
|
shadowRootNodes,
|
|
880
903
|
slottedNodes
|
|
881
904
|
);
|
|
905
|
+
if (scopeId2) {
|
|
906
|
+
node.classList.add(scopeId2);
|
|
907
|
+
}
|
|
882
908
|
}
|
|
883
909
|
childVNode.$elm$["s-sn"] = slotName;
|
|
884
910
|
childVNode.$elm$.removeAttribute("s-sn");
|
|
@@ -1293,6 +1319,9 @@ function sortedAttrNames(attrNames) {
|
|
|
1293
1319
|
attrNames
|
|
1294
1320
|
);
|
|
1295
1321
|
}
|
|
1322
|
+
|
|
1323
|
+
// src/runtime/vdom/vdom-render.ts
|
|
1324
|
+
var scopeId;
|
|
1296
1325
|
var hostTagName;
|
|
1297
1326
|
var isSvgMode = false;
|
|
1298
1327
|
var createElm = (oldParentVNode, newParentVNode, childIndex) => {
|
|
@@ -1321,6 +1350,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
|
|
|
1321
1350
|
{
|
|
1322
1351
|
updateElement(null, newVNode2, isSvgMode);
|
|
1323
1352
|
}
|
|
1353
|
+
if (isDef(scopeId) && elm["s-si"] !== scopeId) {
|
|
1354
|
+
elm.classList.add(elm["s-si"] = scopeId);
|
|
1355
|
+
}
|
|
1324
1356
|
if (newVNode2.$children$) {
|
|
1325
1357
|
for (i2 = 0; i2 < newVNode2.$children$.length; ++i2) {
|
|
1326
1358
|
childNode = createElm(oldParentVNode, newVNode2, i2);
|
|
@@ -1499,10 +1531,34 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
|
|
|
1499
1531
|
}
|
|
1500
1532
|
};
|
|
1501
1533
|
var insertBefore = (parent, newNode, reference) => {
|
|
1534
|
+
if (typeof newNode["s-sn"] === "string" && !!newNode["s-sr"] && !!newNode["s-cr"]) {
|
|
1535
|
+
addRemoveSlotScopedClass(newNode["s-cr"], newNode, parent, newNode.parentElement);
|
|
1536
|
+
}
|
|
1502
1537
|
{
|
|
1503
1538
|
return parent == null ? void 0 : parent.insertBefore(newNode, reference);
|
|
1504
1539
|
}
|
|
1505
1540
|
};
|
|
1541
|
+
function addRemoveSlotScopedClass(reference, slotNode, newParent, oldParent) {
|
|
1542
|
+
var _a, _b;
|
|
1543
|
+
let scopeId2;
|
|
1544
|
+
if (reference && typeof slotNode["s-sn"] === "string" && !!slotNode["s-sr"] && reference.parentNode && reference.parentNode["s-sc"] && (scopeId2 = slotNode["s-si"] || reference.parentNode["s-sc"])) {
|
|
1545
|
+
const scopeName = slotNode["s-sn"];
|
|
1546
|
+
const hostName = slotNode["s-hn"];
|
|
1547
|
+
(_a = newParent.classList) == null ? void 0 : _a.add(scopeId2 + "-s");
|
|
1548
|
+
if (oldParent && ((_b = oldParent.classList) == null ? void 0 : _b.contains(scopeId2 + "-s"))) {
|
|
1549
|
+
let child = (oldParent.__childNodes || oldParent.childNodes)[0];
|
|
1550
|
+
let found = false;
|
|
1551
|
+
while (child) {
|
|
1552
|
+
if (child["s-sn"] !== scopeName && child["s-hn"] === hostName && !!child["s-sr"]) {
|
|
1553
|
+
found = true;
|
|
1554
|
+
break;
|
|
1555
|
+
}
|
|
1556
|
+
child = child.nextSibling;
|
|
1557
|
+
}
|
|
1558
|
+
if (!found) oldParent.classList.remove(scopeId2 + "-s");
|
|
1559
|
+
}
|
|
1560
|
+
}
|
|
1561
|
+
}
|
|
1506
1562
|
var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
|
|
1507
1563
|
const hostElm = hostRef.$hostElement$;
|
|
1508
1564
|
const cmpMeta = hostRef.$cmpMeta$;
|
|
@@ -1529,6 +1585,9 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
|
|
|
1529
1585
|
rootVnode.$flags$ |= 4 /* isHost */;
|
|
1530
1586
|
hostRef.$vnode$ = rootVnode;
|
|
1531
1587
|
rootVnode.$elm$ = oldVNode.$elm$ = hostElm.shadowRoot || hostElm ;
|
|
1588
|
+
{
|
|
1589
|
+
scopeId = hostElm["s-sc"];
|
|
1590
|
+
}
|
|
1532
1591
|
patch(oldVNode, rootVnode, isInitialLoad);
|
|
1533
1592
|
};
|
|
1534
1593
|
|
|
@@ -2000,6 +2059,9 @@ var connectedCallback = (elm) => {
|
|
|
2000
2059
|
if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
|
|
2001
2060
|
const scopeId2 = addStyle(elm.shadowRoot, cmpMeta);
|
|
2002
2061
|
elm.classList.remove(scopeId2 + "-h", scopeId2 + "-s");
|
|
2062
|
+
} else if (cmpMeta.$flags$ & 2 /* scopedCssEncapsulation */) {
|
|
2063
|
+
const scopeId2 = getScopeId(cmpMeta);
|
|
2064
|
+
elm["s-sc"] = scopeId2;
|
|
2003
2065
|
}
|
|
2004
2066
|
initializeClientHydrate(elm, cmpMeta.$tagName$, hostId, hostRef);
|
|
2005
2067
|
}
|
|
@@ -2257,7 +2319,7 @@ var hostListenerOpts = (flags) => supportsListenerOptions ? {
|
|
|
2257
2319
|
// src/runtime/nonce.ts
|
|
2258
2320
|
var setNonce = (nonce) => plt.$nonce$ = nonce;
|
|
2259
2321
|
|
|
2260
|
-
export {
|
|
2261
|
-
//# sourceMappingURL=
|
|
2322
|
+
export { getElement as a, bootstrapLazy as b, createEvent as c, getAssetPath as d, setAssetPath as e, globalScripts as g, h, promiseResolve as p, registerInstance as r, setNonce as s };
|
|
2323
|
+
//# sourceMappingURL=index-kmszRyIe.js.map
|
|
2262
2324
|
|
|
2263
|
-
//# sourceMappingURL=
|
|
2325
|
+
//# sourceMappingURL=index-kmszRyIe.js.map
|