Last active 1752987531

Inline import the compiled TailwindCSS and Phoenix LiveView ViewHook and make it available to components

gaiety's Avatar gaiety revised this gist 1752987531. Go to revision

1 file changed, 20 insertions

lit-live-with-tailwind.ts(file created)

@@ -0,0 +1,20 @@
1 + import {LitElement, unsafeCSS} from 'lit'
2 + import type {ViewHook} from 'phoenix_live_view'
3 + import styles from '../../../priv/static/assets/app.css?inline'
4 +
5 + declare global {
6 + interface HTMLElement {
7 + LitLiveHook?: ViewHook
8 + }
9 + }
10 +
11 + export default class LitLiveElement extends LitElement {
12 + static styles = [unsafeCSS(styles)]
13 + LitLiveHook?: ViewHook
14 + }
15 +
16 + export const LitLiveHook = {
17 + mounted(this: ViewHook) {
18 + this.el.LitLiveHook = this
19 + },
20 + } satisfies Partial<ViewHook>
Newer Older