Stack Overflow
Stack Overflow

Questions tagged [lit]

Lit is a web components and HTML templating library. It includes the Lit HTML template renderer and LitElement web component base class.

Lit is a web components and HTML templating library.

Older versions of Lit were split into two parts ( and , now unified in one package):

328 questions
0
votes
0 answers

How to add a Modal popup to lit element Project

I am developing a project using lit. Already developed two web components using lit. I need to add image gallery, carousal, and also modal popup to open when click on a button inside those components. And I saw that…
Rishni Meemeduma
  • 324
  • 3
  • 14
0
votes
1 answer

Shadow DOM innerHTML with slots replaced by assignedNodes()

I'm working with a customElement using Shadow DOM like: Samantha And the innerHTML (generated by lit/lit-element in my case) is something like: Hello ! I know that if const ht =…
Michael Scott Asato Cuthbert
  • 3,442
  • 2
  • 22
  • 52
0
votes
1 answer

Integrating Web Component having an attribute using Javascript Date

I'm using Vaadin Flow, version 22. I'm trying to integrate a web component that has an attribute that require an array of objects, and these objects use a Javascript Date. To give you an idea, here is how you'd be supposed to use it in a Javascript…
FlorianAgilap
  • 1
  • 1
  • 1
0
votes
1 answer

Vaadin 14 Typescript component with sound recording ability

I trying to create a simple Vaadin component (like Button) that reacts on press and release events. On press event it must start sound record from microphone and on release it must upload recorded data to the backend. I think that is good choice for…
lanmaster
  • 330
  • 2
  • 16
0
votes
0 answers

How to get "scoped slot" behaviour in web components?

I am looking closely at lit to make a cross-framework component library but to be a viable option I need a way to obtain the result of something like Vue's scoped slots or React render functions so I can share the state saved in lit with the…
ciaoben
  • 3,138
  • 4
  • 27
  • 42
0
votes
1 answer

Is there a way to sync the Lit cached DOM with the actual DOM?

I'm using Lit to built my front-end UI components. I'm also making use of an internal company design system that defines its own web components. My problem is that one of these internal web components can directly remove itself from the DOM when…
Steve
  • 175
  • 1
  • 13
0
votes
0 answers

commentaryList with commentaryitem not displaying (lit + redux)

Hey i am trying to make an commentary component (looks a bit like a todolist atm). I have my components linked with redux, if i console.log my array(see commentary-list this.commentaries) i see that it is filled, but the commentary-item doesn't…
Dave Nieberg
  • 13
  • 3
0
votes
1 answer

lit: simple button click changing reactive property doesn't cause a re-render

I have super simple lit element and I'm trying to have a closed or open icon based on isOpen reactive property. Clicking on the element sets this.isOpen = !this.isOpen, which should cause an update. Unfortunately, clicking on the button doesn't…
stackcen
  • 99
  • 8
0
votes
1 answer

Lit 2.0 customElements.define() throws ts(2345)

After migrating several lit-Components to v2 "lit": "2.1.1", we receive the following typescript error: Argument of type 'typeof MyComponent' is not assignable to parameter of type 'CustomElementConstructor'. Type 'MyComponent' is missing…
StephanB
  • 315
  • 2
  • 17
0
votes
1 answer

lit: how to apply style to nested template?

There is a lit element container-element which has has nested lit elements gmail-item. How do you apply styles to nested elements so that the last gmail-item has border-none? Currently, the styling li:last-of-type doesn't propegate to nested lit…
stackcen
  • 99
  • 8
0
votes
1 answer

Lit: nested template doesn't render

I have a really simple template and a simple nested template. Unfortunately, my nested template doesn't render anything. I followed the example defined at: https://lit.dev/docs/components/rendering/ This is my container template. import…
stackcen
  • 99
  • 8
0
votes
0 answers

Listening for changes in CSS custom var with MutationObserver

I'm looking for a way to listening with MutationObserver for a changes in CSS custom vars, actually i'm using the CSS custom vars defined into main index.html file to trigger the different themes of the Web contents. What i want it's a clean…
cicciosgamino
  • 871
  • 3
  • 10
  • 29
0
votes
2 answers

Can Deno be used to bundle a Lit website?

I'm trying to create a simple proof-of-concept of using Deno to bundle a browser application which is using Lit. Basic functionality (e.g., initial component rendering) is functional, but I'm unable to get simple DOM manipulations to trigger the…
tgd25
  • 48
  • 1
  • 7
0
votes
1 answer

Style :host in Lit component overrides style :host in mixin

When a lit component extends a mixin, style in component overrides style in mixin. Example: my-component.js export class HomePage extends ViewMixin(LitElement) { static styles = css` :host { color: blue; } `; view-mixin.js export…
MadeInLagny
  • 185
  • 1
  • 12
0
votes
1 answer

lit: no attributes values in constructor

I'm building a count down in lit, and there is no HTML attributes (count, width, color, colorback, display) values unless adding timeout to constructor: JS: import {LitElement, html} from 'lit'; class ProgressBar extends LitElement { static get…
ZiTAL
  • 3,466
  • 8
  • 35
  • 50
1 2 3
…
21 22