Wijmo's Web Components
Wijmo's lightweight, dependency-free JavaScript components now include an interop for web components! This flexible web technology enables you to create your own declarative API.
- Get declarative, maintainable HTML markup
- Use Wijmo Web Components in Angular
- Reuse the same components and behavior libraries in different frameworks
-
Extend your set of HTML tags with web components
With web components, you can create reusable markup, shrink the size of your web apps, and create yor own declarative API. Wijmo components have never been more flexible. Read our introduction to web components blog
-
Take advantage of a flexible, extensive API
Wijmo's easy-to-read, flexible API has a low learning curve, and components have a simple core with as many extensibility points as possible
Standards of Web Components
The Web Components specification is a collection of browser APIs that can be grouped into four major categories.
Custom Elements
These JavaScript APIs are provided by the browser and let you hook up code (typically a JavaScript class) with custom declarative elements in markup (e.g. <my-custom-element>).
Shadow DOM
This set of JavaScript APIs is for embedding a "shadow" DOM tree that is rendered separately from the main DOM. You'll usually create a Shadow DOM instance for each custom element which will allow you to scope styles and DOM nodes on a per-element basis. This is crucial to encapsulating elements, as it prevents both style and DOM reference collisions.
HTML Templates
Specialized DOM elements <template> and <slot> that allow you to create reusable base markup for a custom element with pieces that are overridable on a per-instance basis. (Note that these elements aren't rendered, so you can define them anywhere in your document.)
Read more about creating reusable markup with template and slot
HTML Imports
This technology provides a way to encapsulate and reuse the base markup for custom elements. (This would typically work by storing an HTML template in its own file and importing it into an actual page.) This is the most contended piece of the Web Components spec, so be sure to check browser support before using it.
Web Component Demos
Browse, search, view source code and run all of our samples using the
Wijmo Sample Explorer.
Introduction to Web Components
Explore All Web Components
Wijmo Components
- Frameworks & Integrations
- Angular
- Ionic
- React
- Vue
- Web Components
- TypeScript
- ES6
- DataGrid
- JavaScript DataGrid (FlexGrid)
- Core JavaScript Grid Features
- Advanced JavaScript Grid Features
- JavaScript Excel Import/Export
- JavaScript Master Detail
- JavaScript Group Panel
- JavaScript Filter
- JavaScript Custom Editors
- JavaScript Button Columns
- JavaScript Hyperlink Columns
- JavaScript Image Columns
- JavaScript Star Ratings Columns
- JavaScript Sparkline Columns
- JavaScript Spreadsheete
- JavaScript MultiRowe
- JavaScript TransposedGride
- JavaScript TransposedMultiRowe
- JavaScript PDF export
- JavaScript TreeGrid
- JavaScript Validation
- Data Management
- CollectionView
- OData CollectionView
- OData Virtual CollectionView
- Google Sheet API
- Firestore REST API
- Firestore Realtime API
- OAuth
- OLAP Pivot Grid
- OLAPe
- JavaScript OLAP PivotGride
- JavaScript OLAP PivotCharte
- JavaScript OLAP PivotPanele
- JavaScript OLAP Slicere
- Printing & Documents
- JavaScript Print Document
- JavaScript PDF
- JavaScript XLSX
- Charts
- JavaScript Chart
- JavaScript Area Chart
- JavaScript Bar Chart
- JavaScript Box-and-Whisker Chart
- JavaScript Bubble Chart
- JavaScript Column Chart
- JavaScript Donut Chart
- JavaScript ErrorBar Chart
- JavaScript Funnel Chart
- JavaScript Line Chart
- JavaScript Pareto Chart
- JavaScript Pie Chart
- JavaScript Polar Chart
- JavaScript Radar Chart
- JavaScript Scatter Chart
- JavaScript StepLine Chart
- JavaScript Sunburst Chart
- JavaScript TreeMap Chart
- JavaScript Waterfall Chart
- JavaScript Break-Even Chart
- Export Chart to Image
- Financial Charts
- JavaScript FinancialCharte
- JavaScript Arms Candle Volume Charte
- JavaScript Candle Volume Charte
- JavaScript Candlestick Charte
- JavaScript Equi Volume Charte
- JavaScript Heikin-Ashi Charte
- JavaScript HLOC Charte
- JavaScript Kagi Charte
- JavaScript Line Break Charte
- JavaScript Renko Chart e
- Navigation & Layout
- JavaScript Menu
- JavaScript Popup
- JavaScript Ribbon
- JavaScript TabPanel
- JavaScript TreeView
- Input & Editors
- JavaScript AutoComplete
- JavaScript DropDown
- JavaScript Clipboard
- JavaScript ColorPicker
- JavaScript ComboBox
- JavaScript InputColor
- JavaScript InputMask
- JavaScript InputNumber
- JavaScript ListBox
- JavaScript MultiSelect
- JavaScript MultiAutoComplete
- JavaScript Tooltips
- DateTime Controls
- JavaScript Calendar
- JavaScript InputDateTime
- JavaScript InputDate
- JavaScript InputTime
- JavaScript InputDateRange
- Designers
- Wijmo Designer
- VSCode Designer Extension
- e = Wijmo Enterprise features
- See product comparison
Get the toolkit. Get the team.
Your license includes 30-day money-back guarantee, distribution licensing, and one full year of updates and new components
Discuss your issues with thousands of other users in our monitored forums
Keep costs low with our royalty-free licensing and subscription model that includes three major releases!
Take advantage of unlimited phone support and expedited ticket times with Platinum Support