I have a React app that contains multiple tabs, which are lazy-loaded separate apps. The overarching app sets the tabs and the loaded apps have section anchors that can be navigated between tabs. My issue is, as the anchors only…
I made a simple switch web component with a checked attribute. When I am clicking on the switch it will be set and displayed correctly. When I set the checked property from outside via the button it will be set…
I have a react.js project were it has a reusable component, i'm planning to use the same component logic in react native with in the same source code by adding my react native ui layer and use the existing component…
So, I'm creating my first web component and I'm struggling with the event handling side with elements within the shadow root. The goal with this component is to display a list of results from an endpoint where the user types…
This is my header component : <header class="header"> <div class="icon-container"> <ul> <li class="list-item"><i class="fa-regular fa-bell"></i></li> <li class="list-item"><i class="fa-solid fa-gear"></i></li> <li class="list-item"><i class="fa-solid fa-arrow-right-from-bracket"></i></li> </ul> </div> </header> This code can display the icons in fontawesome when I import the font-awesome before…
I'm trying to figure out how to use a web component inside another web component (both of which inherit from the same base class. The problem seems to be in the way I'm creating the shadow dom: import BaseElement from…
There are two web components which are being hosted in respective servers. I can view the web components individually. Server A: VIEW: abc.com/a/index.html CONFIGURATION abc.com/a/a.js abc.com/a/main.css <a-webcomponent> Server B: VIEW: abc.com/b/index.html CONFIGURATION abc.com/b/b.js abc.com/b/main.css <b-webcomponent> Now I have a new…
I'm trying to change what is returned when you access the value property on this custom element - which extends HTMLInputElement. This would be used for entering currency values. The input would show 1,000.00 (string) but would return 1000 (float)…
I am pretty new to JavaScript and just playing around with web components. Now it's not clear to me about importing different web components and how to do it a correct way, if there is a correct way. Maybe you…
I am trying to create a group of four buttons. The buttons are almost identical save the background-image and the text on the button. I could create a component for each button, but am trying to implement a more generalized…