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
1 answer

lit element query() returning null

I'm using the query() to reference a lit element. For example @query('#first') _first; However, that lit element hasn't been rendered to the dom yet and the #first returns null. When I do this._first = null. What can I do to make sure that first is…
Chris Hansen
  • 7,813
  • 15
  • 81
  • 165
0
votes
1 answer

Importing JointJS in JavaScript using Node.js

I am aware that questions on this topic have already been answered, but since they are a little old and none of the solutions apply to my problem (which is bugging me for days), I decided to come forward to ask the community. I am trying to build a…
0
votes
0 answers

Lit: Testing text change in component on mouse click

I have a Lit component with a text property, copyText and a mouse click handler, setTooltipClickText(), that changes copyText. On mouse out, I also created an event that has another hanlder, SetTooltipMouseoutText() that resets copyText to its…
phamjamstudio
  • 93
  • 1
  • 5
0
votes
1 answer

TS7053: TypeScript error when handling input id och input value

I get this Typescript error in terminal: TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'CustomForm'. No index signature with a parameter of type 'string' was found on…
tech27
  • 67
  • 7
0
votes
1 answer

A better way to handle input in lit component

I am looking for a better way to handle all inputs in my lit component. I want to use less code. I am also using Typescript. I am using @change=${this.handleInput} for all my inputs. Here is a code how this function looks like: handleInput(e:…
0
votes
0 answers

Neutralinojs with vitejs and litElement

I would like to try the NeutralinoJS using viteJS and litElement. I have followed https://neutralino.js.org/docs/how-to/use-a-frontend-library but i can't get it to work. What i have tried: After initializing the neutralinojs app with neu create…
Boguz
  • 1,600
  • 1
  • 12
  • 25
0
votes
2 answers

show div on button click with Lit component

I have a Lit component. So the goal is when button is clicked I want to show a div with modal pop up window. How can I do that? here is my code: import {LitElement, html, css} from 'lit'; import {customElement, property} from…
tech27
  • 67
  • 7
0
votes
0 answers

WebPack fails in production mode when I switched from Lit 1.0 to Lit 2.0

I am using WebPack (5.55.1) to prepare ES5 bundle for my lit-element library. Currently I am using Li 1.0 (lit-element 2.5.4) and ES5 bundling works fine. Now I am trying to migrate to Lit 3.0 and changing the dependencies I could see all ES6 build…
Bachu
  • 425
  • 4
  • 13
0
votes
0 answers

passing another argument into event listener?

I have a rudimentary keydown listener. private _foo(event: KeyboardEvent) { /// }
test
If I want to pass a function into that, why can't I just add it as an argument like:
sal3jfc
  • 517
  • 4
  • 14
0
votes
1 answer

lit-element replace string with html tag

I have a lit element based javascript project, when I want to throw an html tag with .replace in a text, I encounter either the value with the tag or a structure in the form of object, object, I made a structure as follows, what am I doing…
errorau
  • 2,121
  • 1
  • 14
  • 38
0
votes
0 answers

Styling/layout for child elements of web component

I am creating list-style component where the component itself doesn't know the children of its child elements. Using the standard
    element as an example:
    • Part 1
      [Part 2]
Cheetah
  • 13,785
  • 31
  • 106
  • 190
0
votes
1 answer

Creating snapshot tests with Vitest for Lit components

I see some tutorials with React but am unclear how this would work w/ Lit. Specifically is there something like the react-test-renderer but for Lit?
phamjamstudio
  • 93
  • 1
  • 5
0
votes
0 answers

lit-element wait for nested shadow element to render

I'm trying to access the shadow element to provide default value #shadowroot(open) // not my own, so I cannot modify its internal logic #shadowroot(open) // trying to access this native html…
Noble Dinasaur
  • 97
  • 1
  • 11
0
votes
0 answers

Why do my custom CSS styles get removed when trying to bring this JavaScript file, into my Vaadin application?

import {css, html, LitElement} from 'lit'; class AnalogClock extends LitElement { static get properties() { return { time: {type: Date}, interval: {type: Object} }; } static get styles() { …
0
votes
0 answers

Vite chrashes when importing lit-elements package (SvelteKit + carbon-for-ibm-dotcom)

Has anyone managed to make lit elements with svelte work? Every time I try to use it, vite chrashes with an error stating to put it in the rollup external deps. In more detail, I've been trying to use carbon-for-ibm-dotcom…
AZ Software
  • 108
  • 8