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

How to use advanced types in HTML webcomponent attributes?

about my setup: I'm having a bigger project which is implemented only using vanilla javascript in combination with the LitHTML library for writing web components. it works quite well. In my solution i have the checkJS flag enabled and i'm using…
Kyoshiro Kokujou Obscuritas
  • 83
  • 2
  • 16
0
votes
1 answer

Lit web component not updating Polymer element attribute

I have been referencing the Home Assistant project's use of Polymer app-layout elements with the Lit library. The issue I am having is that I cannot get a public property in my custom component to update an attribute on a nested Polymer…
devjklein
  • 124
  • 5
0
votes
1 answer

Displaying LIT web components programatically in React

I have the a simple lit web component that renders a input box import {html} from "lit-element"; import {customElement} from 'lit/decorators.js'; import "./plain-text"; export class MyInputText { constructor(args){ this.args = args; …
Amelita
  • 1
  • 3
0
votes
1 answer

How to make lit components similar to native HTML?

In our lit web-components library we would like to allow users to add web components in the most HTMLwise manner. Is there a way to pass boolean attributes into components like following? // -> true // ->…
badm
  • 219
  • 2
  • 13
0
votes
0 answers

lit / vaadin-dialog: How to access the dialog elements in my web app?

I am using Lit 2.3 and try to use the the @vaadin/vaadin-dialog component from within my own Lit component to show an input field and access the value of it when a user clicks the Okay button. My own render method looks something like this: render()…
norman
  • 599
  • 1
  • 5
  • 14
0
votes
1 answer

TypeScript change css styling of button with OnClick() function

Information I am learning TypeScript and am translating my already existing CoffeScript code into TypeScript (Lit Web Component). Issue I have an issue with the following line in understanding how it would be translated into TypeScript: render: -> …
Pro_grammer
  • 346
  • 2
  • 9
0
votes
1 answer

Using classMap from lit-html interferes with lit-element

I'm trying to implement classMap from lit-html. When I install the package my application stops working saying the following: Package path ./directives/unsafe-svg is not exported from package. This error originates from another web component I'm…
Ricardo de Vries
  • 113
  • 3
  • 11
0
votes
1 answer

The `live` directive is not allowed on child or event bindings

I have the following code using lit-html. const textarea = (note) => { return html`` } let array = [1, 2, 3] const rendered = () => { return render(html` ${array.map((item) => { return…
Jonathan
  • 8,453
  • 9
  • 51
  • 74
0
votes
1 answer

Styles are not being picked up in my Lit component

I'm trying to implement a Lit component with some scss styling. Below is the component as it is right now: import { html, LitElement } from 'lit-element'; import { ScopedElementsMixin } from '@open-wc/scoped-elements'; // Components import…
Ricardo de Vries
  • 113
  • 3
  • 11
0
votes
1 answer

How do I "inject" a CSS-class into a lit-element?

lit-element completely encapsulates CSS and the only way to style components is via custom CSS variables. When using tailwindcss all styles are applied via classes, and I currently don't see a way to inject those classes from the outside world. What…
exhuma
  • 20,071
  • 12
  • 90
  • 123
0
votes
2 answers

Date formatter inside DIV tag

Date: ${dateInUtc}
This dateInUtc (2021-12-09T15:43:29+01:00) contains the date in UTC format. Need to format it like this 2021-12-09 - 15:43:29. How do achieve this without using external…
Ramdhas
  • 1,765
  • 1
  • 18
  • 26
0
votes
2 answers

How can we have same current_timestamp for all records processed in different compute nodes?

Let's suppose we have a dataframe with millions of records and we are processing this using pyspark. At some point of time we are adding a column => lit(datetime.datetime.now()). In general the completion time of previous action will be different in…
Krishna Pavan Ayitha
  • 101
  • 1
  • 4
0
votes
1 answer

Lit: update toolbox text based on click and reset text to default on mouseoff

I have a component with the following property which is used as my tooltip text @property() copyText = 'Click to copy'; I see that I can create a function that updates the text using the @click expression and that I can use @mouseout to update the…
phamjamstudio
  • 93
  • 1
  • 5
0
votes
1 answer

Lit: Overriding child component CSS given an @property field

I have a lit component (e.g tc-tooltip) where in some cases I'd like to remove its arrow by overriding its CSS as described in the shoelace docs Is there a way to do this? I thought I could create a property in the lit component class…
phamjamstudio
  • 93
  • 1
  • 5
0
votes
2 answers

Use lit-element web component in Angular reactive form

I created a lit-element web component that contains an . Actually I just extended LionInput. import { InputMixin } from '@core/mixin/form/InputMixin'; import { customElement} from '@lion/core'; import { LionInput } from…
Matt
  • 265
  • 4
  • 17
1 2 3
…
21 22