Questions tagged [stencil-component]

82 questions
0
votes
1 answer

Executing a method on create for Stencil Components

I am working on a Stenciljs component where an array needs to be filled with fetch calls when the component is created. The array's contents will change throughout the component's life cycle. Right now the only way I can get it to be filled is by…
0
votes
1 answer

Updating array with entirely new data does not removed the previous rendered data in stencil component

I have an array with some data, after the pagination event I have updated the array with the next page of the data so it should update the view with a new set of data, though it updates the view the previous set of data still lies in the DOM view,…
0
votes
1 answer

Using Stenciljs Components from my other repo in my current project

I have two private bitbucket repos with Stenciljs components and I want to use some components from one in the other. I do not want to upload them to npm or anything of the sort. Both repos are 100% Stenciljs. I was wondering if there is a way I can…
0
votes
1 answer

How to update elements passed in slot with Stencil.js?

I am creating a radio web component with Stencil.js. Stencil.js code:
I pass an input of type radio. Usage in Angular:
Ero Stefano
  • 556
  • 2
  • 9
  • 27
0
votes
2 answers

Stencil: Sudden build error without message after adding `@Method` to component

I cannot give too much information here (because there really isn't), but only this: All of the sudden, after adding a @Method function to a stencil component: @Method() async setMenuItems(items: Element[]): Promise { // code here } the…
jlang
  • 929
  • 11
  • 32
0
votes
0 answers

Run componentDidUpdate only on changes within the Component

I'm trying to learn StencilJs and have created an "editable text" Component like this. import { Component, h, Prop, Element } from '@stencil/core'; @Component({ tag: 'app-input', styleUrl: 'app-input.scss', shadow: true, }) export class…
Björn Andersson
  • 855
  • 3
  • 11
  • 23
0
votes
2 answers

Event listening is clashed when same componet is used twice on single page

I am using stencil framework in my project to create components. Project structure is tree base means subcompacts are having sub components as well. I have used custom events at many places. My concern is when I listen events with parameter…
Urvesh86
  • 31
  • 4
0
votes
1 answer

StencilJS, how to read/get all the declared props in a class through React ref of the relative rendered component?

I am trying to obtain all the properties defined in a StencilJS web component class from another FW, which is similar to React but proprietary (so unfortunately I can't publish a working snippet). This is how the props are defined in the source code…
Micky
  • 647
  • 1
  • 11
  • 26
0
votes
0 answers

time-input polyfill and date-input polyfill not working with stencil on mac os Safari

I am try to use input type= time and input type=date on safari. I install polyfill for time input and for date-time-input polyfil but both seems to be not working. I have created a empty stencil component application and in html just added below…
Shardul Pendse
  • 304
  • 1
  • 4
  • 17
0
votes
1 answer

trigger child function from parent component in stencil

How to trigger a child component function from parent component and send data in stenciljs From , I am try run a function onClick and then send the data to in a function without using @Listen decorator.
RKD
  • 33
  • 1
  • 8
0
votes
1 answer

How to listen events in react/angular/vue from stencils components

I have created simple one component in stencils.js and I used that in react/angular/vue. From my stencil component i have emit an event. This event is captured in angular/react/vue. My problem is I need to use the same component twice in a single…
Shardul Pendse
  • 304
  • 1
  • 4
  • 17
0
votes
3 answers

Stencil component not rendering the updated tabs

import { Component, h, State } from '@stencil/core'; // import '@webcomponents/custom-elements'; import '@clr/core/icon/register'; import { ClarityIcons, plusIcon } from '@clr/core/icon'; ClarityIcons.addIcons(plusIcon); @Component({ tag:…
Code
  • 1,574
  • 2
  • 23
  • 37
0
votes
1 answer

Build range-slider using Stencil

I want to build a range-slider using stencil. Above the range slider is an h1 which should give back the correct value of the slider. I use a Listen-Event, which listens if the range-slider was clicked (I also tried change, but that didn't work).…
0
votes
2 answers

Need help to set class name for Stencil

So after reading over the docs and then taking a umedy class on Stencil I still cannot seem to get class names to set on my object. for example i have the following import { Component, h, Prop } from '@stencil/core' @Component({ tag:…
0
votes
0 answers

How to prevent Host 'focusin' and 'focusout' ? [StencilJS]

I'm creating a customselect form control and when it has a state disabled I need to skip focusin and focusout events. This code without disabled validation doesn't work, the focusin is still emited. @Element() private element: HTMLElement; public…
Daniel Delgado
  • 4,813
  • 5
  • 40
  • 48