chore: use @halo-dev/astro-halo-theme-integration package

Signed-off-by: Ryan Wang <i@ryanc.cc>
This commit is contained in:
Ryan Wang
2022-07-31 17:38:36 +08:00
parent 0a950731d9
commit 4f697e33e7
4 changed files with 11 additions and 158 deletions
+2 -60
View File
@@ -1,58 +1,11 @@
import { defineConfig } from "astro/config"; import { defineConfig } from "astro/config";
import vue from "@astrojs/vue"; import vue from "@astrojs/vue";
import tailwind from "@astrojs/tailwind"; import tailwind from "@astrojs/tailwind";
import fs from "fs"; import astroHaloThemeIntegration from "@halo-dev/astro-halo-theme-integration";
import { load } from "cheerio";
function thymeleafAssetsProcessor() {
return {
name: "thymeleaf-assets-processor",
hooks: {
"astro:build:done": async ({ dir, routes, pages }) => {
const pageRoutes = routes.filter((route) => route.type === "page");
for (let i = 0; i < pageRoutes.length; i++) {
const route = pageRoutes[i];
const pathname = route.distURL?.pathname;
const inputHTML = await fs.promises.readFile(pathname, {
encoding: "utf-8",
});
const $ = load(inputHTML);
$("link").each((_, el) => {
const href = $(el).attr("href");
if (href.startsWith("/assets")) {
$(el).attr("th:href", `@{${href}}`);
}
});
$("astro-island").each((_, el) => {
const componentUrl = $(el).attr("component-url");
const rendererUrl = $(el).attr("renderer-url");
if (componentUrl && componentUrl.startsWith("/assets")) {
$(el).attr("th:component-url", `@{${componentUrl}}`);
}
if (rendererUrl && rendererUrl.startsWith("/assets")) {
$(el).attr("th:renderer-url", `@{${rendererUrl}}`);
}
});
await fs.promises.writeFile(pathname, $.html());
}
},
},
};
}
// https://astro.build/config // https://astro.build/config
export default defineConfig({ export default defineConfig({
integrations: [vue(), tailwind(), thymeleafAssetsProcessor()], integrations: [vue(), tailwind(), astroHaloThemeIntegration()],
outDir: "./templates", outDir: "./templates",
build: { build: {
format: "file", format: "file",
@@ -60,15 +13,4 @@ export default defineConfig({
server: { server: {
port: 4000, port: 4000,
}, },
vite: {
build: {
rollupOptions: {
output: {
entryFileNames: "assets/[name].[hash].js",
chunkFileNames: "assets/chunks/[name].[hash].js",
assetFileNames: "assets/[name].[hash][extname]",
},
},
},
},
}); });
+2 -2
View File
@@ -17,12 +17,12 @@
"@vue/eslint-config-typescript": "^11.0.0", "@vue/eslint-config-typescript": "^11.0.0",
"@vue/tsconfig": "^0.1.3", "@vue/tsconfig": "^0.1.3",
"astro": "^1.0.0-rc.2", "astro": "^1.0.0-rc.2",
"cheerio": "1.0.0-rc.12",
"eslint": "^8.20.0", "eslint": "^8.20.0",
"eslint-plugin-vue": "^9.3.0", "eslint-plugin-vue": "^9.3.0",
"prettier": "^2.7.1", "prettier": "^2.7.1",
"prettier-plugin-tailwindcss": "^0.1.13", "prettier-plugin-tailwindcss": "^0.1.13",
"vue": "^3.2.37" "vue": "^3.2.37",
"@halo-dev/astro-halo-theme-integration": "^0.0.1"
}, },
"dependencies": { "dependencies": {
"@headlessui/vue": "^1.6.7", "@headlessui/vue": "^1.6.7",
+6 -95
View File
@@ -3,6 +3,7 @@ lockfileVersion: 5.4
specifiers: specifiers:
'@astrojs/tailwind': ^0.2.5 '@astrojs/tailwind': ^0.2.5
'@astrojs/vue': ^0.5.0 '@astrojs/vue': ^0.5.0
'@halo-dev/astro-halo-theme-integration': ^0.0.1
'@headlessui/vue': ^1.6.7 '@headlessui/vue': ^1.6.7
'@rushstack/eslint-patch': ^1.1.4 '@rushstack/eslint-patch': ^1.1.4
'@types/node': '16' '@types/node': '16'
@@ -10,7 +11,6 @@ specifiers:
'@vue/eslint-config-typescript': ^11.0.0 '@vue/eslint-config-typescript': ^11.0.0
'@vue/tsconfig': ^0.1.3 '@vue/tsconfig': ^0.1.3
astro: ^1.0.0-rc.2 astro: ^1.0.0-rc.2
cheerio: 1.0.0-rc.12
dayjs: ^1.11.4 dayjs: ^1.11.4
eslint: ^8.20.0 eslint: ^8.20.0
eslint-plugin-vue: ^9.3.0 eslint-plugin-vue: ^9.3.0
@@ -25,13 +25,13 @@ dependencies:
devDependencies: devDependencies:
'@astrojs/tailwind': 0.2.5 '@astrojs/tailwind': 0.2.5
'@astrojs/vue': 0.5.0_vue@3.2.37 '@astrojs/vue': 0.5.0_vue@3.2.37
'@halo-dev/astro-halo-theme-integration': 0.0.1
'@rushstack/eslint-patch': 1.1.4 '@rushstack/eslint-patch': 1.1.4
'@types/node': 16.11.46 '@types/node': 16.11.46
'@vue/eslint-config-prettier': 7.0.0_vvfpqh5kol6rhqy7beehv5uezq '@vue/eslint-config-prettier': 7.0.0_vvfpqh5kol6rhqy7beehv5uezq
'@vue/eslint-config-typescript': 11.0.0_bu6pzweaepnqqz4ai64ugihjt4 '@vue/eslint-config-typescript': 11.0.0_bu6pzweaepnqqz4ai64ugihjt4
'@vue/tsconfig': 0.1.3_@types+node@16.11.46 '@vue/tsconfig': 0.1.3_@types+node@16.11.46
astro: 1.0.0-rc.2 astro: 1.0.0-rc.2
cheerio: 1.0.0-rc.12
eslint: 8.20.0 eslint: 8.20.0
eslint-plugin-vue: 9.3.0_eslint@8.20.0 eslint-plugin-vue: 9.3.0_eslint@8.20.0
prettier: 2.7.1 prettier: 2.7.1
@@ -420,6 +420,10 @@ packages:
- supports-color - supports-color
dev: true dev: true
/@halo-dev/astro-halo-theme-integration/0.0.1:
resolution: {integrity: sha512-8ZIDOjyvbs9BhDPlOGyvNk7eCrEniGBcuF/5ZZh/8pYwym61UB/nuLmpfdqI92AQ/2CPLRpGqm/o9xxYdhwbHw==}
dev: true
/@headlessui/vue/1.6.7_vue@3.2.37: /@headlessui/vue/1.6.7_vue@3.2.37:
resolution: {integrity: sha512-5sTCBpkUoFE7zhANn/6Z+pf3PUA7MD6BBaTsJcQybq9E4fnNiMM9agOJI9meXbtcawE6Dm8EeB5A8HAJEnZCbQ==} resolution: {integrity: sha512-5sTCBpkUoFE7zhANn/6Z+pf3PUA7MD6BBaTsJcQybq9E4fnNiMM9agOJI9meXbtcawE6Dm8EeB5A8HAJEnZCbQ==}
engines: {node: '>=10'} engines: {node: '>=10'}
@@ -1231,30 +1235,6 @@ packages:
resolution: {integrity: sha512-iBZ4F4wRbyORVsu0jPV7gXkOsGYjGHPmAyv+HiHG8gi5PtC9KI2j1+v8/tlibRvjoWX027ypmG/n0HtO5t7unw==} resolution: {integrity: sha512-iBZ4F4wRbyORVsu0jPV7gXkOsGYjGHPmAyv+HiHG8gi5PtC9KI2j1+v8/tlibRvjoWX027ypmG/n0HtO5t7unw==}
dev: true dev: true
/cheerio-select/2.1.0:
resolution: {integrity: sha512-9v9kG0LvzrlcungtnJtpGNxY+fzECQKhK4EGJX2vByejiMX84MFNQw4UxPJl3bFbTMw+Dfs37XaIkCwTZfLh4g==}
dependencies:
boolbase: 1.0.0
css-select: 5.1.0
css-what: 6.1.0
domelementtype: 2.3.0
domhandler: 5.0.3
domutils: 3.0.1
dev: true
/cheerio/1.0.0-rc.12:
resolution: {integrity: sha512-VqR8m68vM46BNnuZ5NtnGBKIE/DfN0cRIzg9n40EIq9NOv90ayxLBXA8fXC5gquFRGJSTRqBq25Jt2ECLR431Q==}
engines: {node: '>= 6'}
dependencies:
cheerio-select: 2.1.0
dom-serializer: 2.0.0
domhandler: 5.0.3
domutils: 3.0.1
htmlparser2: 8.0.1
parse5: 7.0.0
parse5-htmlparser2-tree-adapter: 7.0.0
dev: true
/chokidar/3.5.3: /chokidar/3.5.3:
resolution: {integrity: sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==} resolution: {integrity: sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==}
engines: {node: '>= 8.10.0'} engines: {node: '>= 8.10.0'}
@@ -1344,21 +1324,6 @@ packages:
which: 2.0.2 which: 2.0.2
dev: true dev: true
/css-select/5.1.0:
resolution: {integrity: sha512-nwoRF1rvRRnnCqqY7updORDsuqKzqYJ28+oSMaJMMgOauh3fvwHqMS7EZpIPqK8GL+g9mKxF1vP/ZjSeNjEVHg==}
dependencies:
boolbase: 1.0.0
css-what: 6.1.0
domhandler: 5.0.3
domutils: 3.0.1
nth-check: 2.1.1
dev: true
/css-what/6.1.0:
resolution: {integrity: sha512-HTUrgRJ7r4dsZKU6GjmpfRK1O76h97Z8MfS1G0FozR+oF2kG6Vfe8JE6zwrkbxigziPHinCJ+gCPjA9EaBDtRw==}
engines: {node: '>= 6'}
dev: true
/cssesc/3.0.0: /cssesc/3.0.0:
resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==} resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
engines: {node: '>=4'} engines: {node: '>=4'}
@@ -1464,33 +1429,6 @@ packages:
esutils: 2.0.3 esutils: 2.0.3
dev: true dev: true
/dom-serializer/2.0.0:
resolution: {integrity: sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==}
dependencies:
domelementtype: 2.3.0
domhandler: 5.0.3
entities: 4.3.1
dev: true
/domelementtype/2.3.0:
resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==}
dev: true
/domhandler/5.0.3:
resolution: {integrity: sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==}
engines: {node: '>= 4'}
dependencies:
domelementtype: 2.3.0
dev: true
/domutils/3.0.1:
resolution: {integrity: sha512-z08c1l761iKhDFtfXO04C7kTdPBLi41zwOZl00WS8b5eiaebNpY00HKbztwBq+e3vyqWNwWF3mP9YLUeqIrF+Q==}
dependencies:
dom-serializer: 2.0.0
domelementtype: 2.3.0
domhandler: 5.0.3
dev: true
/dset/3.1.2: /dset/3.1.2:
resolution: {integrity: sha512-g/M9sqy3oHe477Ar4voQxWtaPIFw1jTdKZuomOjhCcBx9nHUNn0pu6NopuFFrTh/TRZIKEj+76vLWFu9BNKk+Q==} resolution: {integrity: sha512-g/M9sqy3oHe477Ar4voQxWtaPIFw1jTdKZuomOjhCcBx9nHUNn0pu6NopuFFrTh/TRZIKEj+76vLWFu9BNKk+Q==}
engines: {node: '>=4'} engines: {node: '>=4'}
@@ -1519,11 +1457,6 @@ packages:
resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==} resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
dev: true dev: true
/entities/4.3.1:
resolution: {integrity: sha512-o4q/dYJlmyjP2zfnaWDUC6A3BQFmVTX+tZPezK7k0GLSU9QYCauscf5Y+qcEPzKL+EixVouYDgLQK5H9GrLpkg==}
engines: {node: '>=0.12'}
dev: true
/eol/0.9.1: /eol/0.9.1:
resolution: {integrity: sha512-Ds/TEoZjwggRoz/Q2O7SE3i4Jm66mqTDfmdHdq/7DKVk3bro9Q8h6WdXKdPqFLMoqxrDK5SVRzHVPOS6uuGtrg==} resolution: {integrity: sha512-Ds/TEoZjwggRoz/Q2O7SE3i4Jm66mqTDfmdHdq/7DKVk3bro9Q8h6WdXKdPqFLMoqxrDK5SVRzHVPOS6uuGtrg==}
dev: true dev: true
@@ -2399,15 +2332,6 @@ packages:
resolution: {integrity: sha512-0quDb7s97CfemeJAnW9wC0hw78MtW7NU3hqtCD75g2vFlDLt36llsYD7uB7SUzojLMP24N5IatXf7ylGXiGG9A==} resolution: {integrity: sha512-0quDb7s97CfemeJAnW9wC0hw78MtW7NU3hqtCD75g2vFlDLt36llsYD7uB7SUzojLMP24N5IatXf7ylGXiGG9A==}
dev: true dev: true
/htmlparser2/8.0.1:
resolution: {integrity: sha512-4lVbmc1diZC7GUJQtRQ5yBAeUCL1exyMwmForWkRLnwyzWBFxN633SALPMGYaWZvKe9j1pRZJpauvmxENSp/EA==}
dependencies:
domelementtype: 2.3.0
domhandler: 5.0.3
domutils: 3.0.1
entities: 4.3.1
dev: true
/human-signals/3.0.1: /human-signals/3.0.1:
resolution: {integrity: sha512-rQLskxnM/5OCldHo+wNXbpVgDn5A17CUoKX+7Sokwaknlq7CdSnphy0W39GU8dw59XiCXmFXDg4fRuckQRKewQ==} resolution: {integrity: sha512-rQLskxnM/5OCldHo+wNXbpVgDn5A17CUoKX+7Sokwaknlq7CdSnphy0W39GU8dw59XiCXmFXDg4fRuckQRKewQ==}
engines: {node: '>=12.20.0'} engines: {node: '>=12.20.0'}
@@ -3511,23 +3435,10 @@ packages:
unist-util-visit-children: 1.1.4 unist-util-visit-children: 1.1.4
dev: true dev: true
/parse5-htmlparser2-tree-adapter/7.0.0:
resolution: {integrity: sha512-B77tOZrqqfUfnVcOrUvfdLbz4pu4RopLD/4vmu3HUPswwTA8OH0EMW9BlWR2B0RCoiZRAHEUu7IxeP1Pd1UU+g==}
dependencies:
domhandler: 5.0.3
parse5: 7.0.0
dev: true
/parse5/6.0.1: /parse5/6.0.1:
resolution: {integrity: sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==} resolution: {integrity: sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw==}
dev: true dev: true
/parse5/7.0.0:
resolution: {integrity: sha512-y/t8IXSPWTuRZqXc0ajH/UwDj4mnqLEbSttNbThcFhGrZuOyoyvNBO85PBp2jQa55wY9d07PBNjsK8ZP3K5U6g==}
dependencies:
entities: 4.3.1
dev: true
/path-browserify/1.0.1: /path-browserify/1.0.1:
resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==} resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==}
dev: true dev: true
+1 -1
View File
@@ -10,7 +10,7 @@
<a href="/post" th:href="@{/post}" class="astro-OLJ52OFC">Post</a> <a href="/post" th:href="@{/post}" class="astro-OLJ52OFC">Post</a>
<a href="/links" th:href="@{/links}" class="astro-OLJ52OFC">Links</a> <a href="/links" th:href="@{/links}" class="astro-OLJ52OFC">Links</a>
</nav> </nav>
<time>1659150282813</time><main> <time>1659259965988</time><main>
<style>astro-island,astro-slot{display:contents}</style><script>(self.Astro=self.Astro||{}).visible=(i,c,n)=>{const r=async()=>{await(await i())()};let s=new IntersectionObserver(e=>{for(const t of e)if(!!t.isIntersecting){s.disconnect(),r();break}});for(let e=0;e<n.children.length;e++){const t=n.children[e];s.observe(t)}};var a;{const l={0:t=>t,1:t=>JSON.parse(t,n),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(JSON.parse(t,n)),5:t=>new Set(JSON.parse(t,n)),6:t=>BigInt(t),7:t=>new URL(t)},n=(t,r)=>{if(t===""||!Array.isArray(r))return r;const[e,i]=r;return e in l?l[e](i):void 0};customElements.get("astro-island")||customElements.define("astro-island",(a=class extends HTMLElement{constructor(){super(...arguments);this.hydrate=()=>{if(!this.hydrator||this.parentElement?.closest("astro-island[ssr]"))return;const r=this.querySelectorAll("astro-slot"),e={},i=this.querySelectorAll("template[data-astro-template]");for(const s of i)!s.closest(this.tagName)?.isSameNode(this)||(e[s.getAttribute("data-astro-template")||"default"]=s.innerHTML,s.remove());for(const s of r)!s.closest(this.tagName)?.isSameNode(this)||(e[s.getAttribute("name")||"default"]=s.innerHTML);const o=this.hasAttribute("props")?JSON.parse(this.getAttribute("props"),n):{};this.hydrator(this)(this.Component,o,e,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),window.removeEventListener("astro:hydrate",this.hydrate),window.dispatchEvent(new CustomEvent("astro:hydrate"))}}connectedCallback(){!this.hasAttribute("await-children")||this.firstChild?this.childrenConnectedCallback():new MutationObserver((r,e)=>{e.disconnect(),this.childrenConnectedCallback()}).observe(this,{childList:!0})}async childrenConnectedCallback(){window.addEventListener("astro:hydrate",this.hydrate),await import(this.getAttribute("before-hydration-url"));const r=JSON.parse(this.getAttribute("opts"));Astro[this.getAttribute("client")](async()=>{const e=this.getAttribute("renderer-url"),[i,{default:o}]=await Promise.all([import(this.getAttribute("component-url")),e?import(e):()=>()=>{}]);return this.Component=i[this.getAttribute("component-export")||"default"],this.hydrator=o,this.hydrate},r,this)}attributeChangedCallback(){this.hydrator&&this.hydrate()}},a.observedAttributes=["props"],a))}</script><astro-island uid="23Qlud" component-url="/assets/PostCard.d1fd8841.js" component-export="default" renderer-url="/assets/client.e67fc49c.js" props="{}" ssr="" client="visible" before-hydration-url="data:text/javascript;charset=utf-8,//[no before-hydration script]" opts="{&quot;name&quot;:&quot;PostCard&quot;,&quot;value&quot;:true}" await-children="" th:component-url="@{/assets/PostCard.d1fd8841.js}" th:renderer-url="@{/assets/client.e67fc49c.js}"><div class="p-4"><span class="text-xl font-bold" th:text="@{post.title}">Hello Halo</span><div class="flex flex-col items-center py-16"><div class="h-32 w-32"><div class="h-full w-full rounded-md bg-white shadow-lg"></div></div><button class="mt-8 flex transform items-center rounded-full bg-black bg-opacity-20 px-3 py-2 text-sm font-medium text-white transition hover:scale-105 hover:bg-opacity-30 focus:outline-none active:bg-opacity-40"><svg class="h-5 w-5 opacity-70" fill="none" viewBox="0 0 20 20"><path d="M14.9497 14.9498C12.2161 17.6835 7.78392 17.6835 5.05025 14.9498C2.31658 12.2162 2.31658 7.784 5.05025 5.05033C7.78392 2.31666 12.2161 2.31666 14.9497 5.05033C15.5333 5.63385 15.9922 6.29475 16.3266 7M16.9497 2L17 7H16.3266M12 7L16.3266 7" stroke="currentColor" stroke-width="1.5"></path></svg><span class="ml-3">Click to transition</span></button></div></div></astro-island> <style>astro-island,astro-slot{display:contents}</style><script>(self.Astro=self.Astro||{}).visible=(i,c,n)=>{const r=async()=>{await(await i())()};let s=new IntersectionObserver(e=>{for(const t of e)if(!!t.isIntersecting){s.disconnect(),r();break}});for(let e=0;e<n.children.length;e++){const t=n.children[e];s.observe(t)}};var a;{const l={0:t=>t,1:t=>JSON.parse(t,n),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(JSON.parse(t,n)),5:t=>new Set(JSON.parse(t,n)),6:t=>BigInt(t),7:t=>new URL(t)},n=(t,r)=>{if(t===""||!Array.isArray(r))return r;const[e,i]=r;return e in l?l[e](i):void 0};customElements.get("astro-island")||customElements.define("astro-island",(a=class extends HTMLElement{constructor(){super(...arguments);this.hydrate=()=>{if(!this.hydrator||this.parentElement?.closest("astro-island[ssr]"))return;const r=this.querySelectorAll("astro-slot"),e={},i=this.querySelectorAll("template[data-astro-template]");for(const s of i)!s.closest(this.tagName)?.isSameNode(this)||(e[s.getAttribute("data-astro-template")||"default"]=s.innerHTML,s.remove());for(const s of r)!s.closest(this.tagName)?.isSameNode(this)||(e[s.getAttribute("name")||"default"]=s.innerHTML);const o=this.hasAttribute("props")?JSON.parse(this.getAttribute("props"),n):{};this.hydrator(this)(this.Component,o,e,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),window.removeEventListener("astro:hydrate",this.hydrate),window.dispatchEvent(new CustomEvent("astro:hydrate"))}}connectedCallback(){!this.hasAttribute("await-children")||this.firstChild?this.childrenConnectedCallback():new MutationObserver((r,e)=>{e.disconnect(),this.childrenConnectedCallback()}).observe(this,{childList:!0})}async childrenConnectedCallback(){window.addEventListener("astro:hydrate",this.hydrate),await import(this.getAttribute("before-hydration-url"));const r=JSON.parse(this.getAttribute("opts"));Astro[this.getAttribute("client")](async()=>{const e=this.getAttribute("renderer-url"),[i,{default:o}]=await Promise.all([import(this.getAttribute("component-url")),e?import(e):()=>()=>{}]);return this.Component=i[this.getAttribute("component-export")||"default"],this.hydrator=o,this.hydrate},r,this)}attributeChangedCallback(){this.hydrator&&this.hydrate()}},a.observedAttributes=["props"],a))}</script><astro-island uid="23Qlud" component-url="/assets/PostCard.d1fd8841.js" component-export="default" renderer-url="/assets/client.e67fc49c.js" props="{}" ssr="" client="visible" before-hydration-url="data:text/javascript;charset=utf-8,//[no before-hydration script]" opts="{&quot;name&quot;:&quot;PostCard&quot;,&quot;value&quot;:true}" await-children="" th:component-url="@{/assets/PostCard.d1fd8841.js}" th:renderer-url="@{/assets/client.e67fc49c.js}"><div class="p-4"><span class="text-xl font-bold" th:text="@{post.title}">Hello Halo</span><div class="flex flex-col items-center py-16"><div class="h-32 w-32"><div class="h-full w-full rounded-md bg-white shadow-lg"></div></div><button class="mt-8 flex transform items-center rounded-full bg-black bg-opacity-20 px-3 py-2 text-sm font-medium text-white transition hover:scale-105 hover:bg-opacity-30 focus:outline-none active:bg-opacity-40"><svg class="h-5 w-5 opacity-70" fill="none" viewBox="0 0 20 20"><path d="M14.9497 14.9498C12.2161 17.6835 7.78392 17.6835 5.05025 14.9498C2.31658 12.2162 2.31658 7.784 5.05025 5.05033C7.78392 2.31666 12.2161 2.31666 14.9497 5.05033C15.5333 5.63385 15.9922 6.29475 16.3266 7M16.9497 2L17 7H16.3266M12 7L16.3266 7" stroke="currentColor" stroke-width="1.5"></path></svg><span class="ml-3">Click to transition</span></button></div></div></astro-island>
</main> </main>