aboutsummaryrefslogtreecommitdiff
path: root/packages/integrations/preact/src/static-html.ts
diff options
context:
space:
mode:
Diffstat (limited to 'packages/integrations/preact/src/static-html.ts')
-rw-r--r--packages/integrations/preact/src/static-html.ts31
1 files changed, 31 insertions, 0 deletions
diff --git a/packages/integrations/preact/src/static-html.ts b/packages/integrations/preact/src/static-html.ts
new file mode 100644
index 000000000..453e72b7f
--- /dev/null
+++ b/packages/integrations/preact/src/static-html.ts
@@ -0,0 +1,31 @@
+import { h } from 'preact';
+
+type Props = {
+ value: string;
+ name?: string;
+ hydrate?: boolean;
+};
+
+/**
+ * Astro passes `children` as a string of HTML, so we need
+ * a wrapper `div` to render that content as VNodes.
+ *
+ * As a bonus, we can signal to Preact that this subtree is
+ * entirely static and will never change via `shouldComponentUpdate`.
+ */
+const StaticHtml = ({ value, name, hydrate = true }: Props) => {
+ if (!value) return null;
+ const tagName = hydrate ? 'astro-slot' : 'astro-static-slot';
+ return h(tagName, { name, dangerouslySetInnerHTML: { __html: value } });
+};
+
+/**
+ * This tells Preact to opt-out of re-rendering this subtree,
+ * In addition to being a performance optimization,
+ * this also allows other frameworks to attach to `children`.
+ *
+ * See https://preactjs.com/guide/v8/external-dom-mutations
+ */
+StaticHtml.shouldComponentUpdate = () => false;
+
+export default StaticHtml;