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…

ElPsyCongoro
- 31
- 5
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,…

Rahul Gupta
- 69
- 2
- 14
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…

ElPsyCongoro
- 31
- 5
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).…

JessiNö
- 1
- 1
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