2022-06-23 10:10:54 -05:00
|
|
|
const noop = () => {};
|
2022-03-18 17:35:45 -05:00
|
|
|
|
2023-08-15 17:31:01 -05:00
|
|
|
let originalConsoleWarning;
|
|
|
|
let consoleFilterRefs = 0;
|
|
|
|
|
2023-09-07 09:49:59 -05:00
|
|
|
export default (element) => {
|
2022-06-23 10:10:54 -05:00
|
|
|
return (Component, props, slotted, { client }) => {
|
2023-09-07 09:49:59 -05:00
|
|
|
if (!element.hasAttribute('ssr')) return;
|
2022-06-23 10:10:54 -05:00
|
|
|
const slots = {};
|
|
|
|
for (const [key, value] of Object.entries(slotted)) {
|
|
|
|
slots[key] = createSlotDefinition(key, value);
|
|
|
|
}
|
2023-08-15 17:31:01 -05:00
|
|
|
|
2022-03-18 17:35:45 -05:00
|
|
|
try {
|
2023-08-15 17:31:01 -05:00
|
|
|
if (import.meta.env.DEV) useConsoleFilter();
|
|
|
|
|
2023-08-29 09:30:11 -05:00
|
|
|
const component = new Component({
|
2023-09-07 09:49:59 -05:00
|
|
|
target: element,
|
2022-06-23 10:12:46 -05:00
|
|
|
props: {
|
2022-06-23 10:10:54 -05:00
|
|
|
...props,
|
|
|
|
$$slots: slots,
|
2022-06-23 10:12:46 -05:00
|
|
|
$$scope: { ctx: [] },
|
2022-06-23 10:10:54 -05:00
|
|
|
},
|
2022-05-31 11:29:36 -05:00
|
|
|
hydrate: client !== 'only',
|
2022-06-23 10:10:54 -05:00
|
|
|
$$inline: true,
|
2022-03-18 17:35:45 -05:00
|
|
|
});
|
2023-08-29 09:32:02 -05:00
|
|
|
|
|
|
|
element.addEventListener('astro:unmount', () => component.$destroy(), { once: true });
|
2023-08-15 17:31:01 -05:00
|
|
|
} finally {
|
|
|
|
if (import.meta.env.DEV) finishUsingConsoleFilter();
|
|
|
|
}
|
2022-03-18 17:35:45 -05:00
|
|
|
};
|
|
|
|
};
|
2022-06-23 10:10:54 -05:00
|
|
|
|
|
|
|
function createSlotDefinition(key, children) {
|
2023-02-15 09:28:59 -05:00
|
|
|
let parent;
|
2022-06-23 10:12:46 -05:00
|
|
|
return [
|
|
|
|
() => ({
|
2022-06-23 10:10:54 -05:00
|
|
|
// mount
|
|
|
|
m(target) {
|
2023-02-15 09:28:59 -05:00
|
|
|
parent = target;
|
2022-06-23 10:12:46 -05:00
|
|
|
target.insertAdjacentHTML(
|
|
|
|
'beforeend',
|
|
|
|
`<astro-slot${key === 'default' ? '' : ` name="${key}"`}>${children}</astro-slot>`
|
|
|
|
);
|
2022-06-23 10:10:54 -05:00
|
|
|
},
|
|
|
|
// create
|
|
|
|
c: noop,
|
|
|
|
// hydrate
|
|
|
|
l: noop,
|
|
|
|
// destroy
|
2023-02-15 09:28:59 -05:00
|
|
|
d() {
|
|
|
|
if (!parent) return;
|
|
|
|
const slot = parent.querySelector(
|
|
|
|
`astro-slot${key === 'default' ? ':not([name])' : `[name="${key}"]`}`
|
|
|
|
);
|
|
|
|
if (slot) slot.remove();
|
|
|
|
},
|
2022-06-23 10:10:54 -05:00
|
|
|
}),
|
2022-06-23 10:12:46 -05:00
|
|
|
noop,
|
|
|
|
noop,
|
|
|
|
];
|
2022-06-23 10:10:54 -05:00
|
|
|
}
|
2023-08-15 17:31:01 -05:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Reduces console noise by filtering known non-problematic warnings.
|
|
|
|
*
|
|
|
|
* Performs reference counting to allow parallel usage from async code.
|
|
|
|
*
|
|
|
|
* To stop filtering, please ensure that there always is a matching call
|
|
|
|
* to `finishUsingConsoleFilter` afterwards.
|
|
|
|
*/
|
|
|
|
function useConsoleFilter() {
|
|
|
|
consoleFilterRefs++;
|
|
|
|
|
|
|
|
if (!originalConsoleWarning) {
|
|
|
|
originalConsoleWarning = console.warn;
|
|
|
|
try {
|
|
|
|
console.warn = filteredConsoleWarning;
|
2024-08-08 04:54:04 -05:00
|
|
|
} catch {
|
2023-08-15 17:31:01 -05:00
|
|
|
// If we're unable to hook `console.warn`, just accept it
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Indicates that the filter installed by `useConsoleFilter`
|
|
|
|
* is no longer needed by the calling code.
|
|
|
|
*/
|
|
|
|
function finishUsingConsoleFilter() {
|
|
|
|
consoleFilterRefs--;
|
|
|
|
|
|
|
|
// Note: Instead of reverting `console.warning` back to the original
|
|
|
|
// when the reference counter reaches 0, we leave our hook installed
|
|
|
|
// to prevent potential race conditions once `check` is made async
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Hook/wrapper function for the global `console.warning` function.
|
|
|
|
*
|
|
|
|
* Ignores known non-problematic errors while any code is using the console filter.
|
|
|
|
* Otherwise, simply forwards all arguments to the original function.
|
|
|
|
*/
|
|
|
|
function filteredConsoleWarning(msg, ...rest) {
|
|
|
|
if (consoleFilterRefs > 0 && typeof msg === 'string') {
|
2023-12-27 05:08:20 -05:00
|
|
|
// Astro passes `class` and `data-astro-cid` props to the Svelte component, which
|
2023-08-15 17:31:01 -05:00
|
|
|
// outputs the following warning, which we can safely filter out.
|
2023-12-27 05:08:20 -05:00
|
|
|
|
|
|
|
// NOTE: In practice data-astro-cid props have a hash suffix. Hence the use of a
|
|
|
|
// quoted prop name string without a closing quote.
|
|
|
|
|
|
|
|
const isKnownSvelteError =
|
|
|
|
msg.endsWith("was created with unknown prop 'class'") ||
|
|
|
|
msg.includes("was created with unknown prop 'data-astro-cid");
|
2023-08-15 17:31:01 -05:00
|
|
|
if (isKnownSvelteError) return;
|
|
|
|
}
|
|
|
|
originalConsoleWarning(msg, ...rest);
|
|
|
|
}
|