Displaying 1 to 20 from 23 results

Trix - A rich text editor for everyday writing


Trix is a WYSIWYG editor for writing messages, comments, articles, and lists—the simple documents most web apps are made of. It features a sophisticated document model, support for embedded attachments, and outputs terse and consistent HTML.

Maple


Maple is a seamless module that allows you to organise your React project in terms of webcomponents — with HTML Imports, Shadow DOM, and Custom Elements — allowing you to implement any Flux architecture you choose, and then compile with Mapleify for production.💎 Install all dependencies and start server using npm start.




html-as-custom-elements - HTML as Custom Elements


A demo is available, which shows implementation efforts for a number of fairly simple elements, and outlines the missing platform features each of them highlights. Even these simple elements have highlighted one major area of missing functionality in custom elements, which has been written up in the document "Gap Analysis: Accessibility". One of the axioms of the extensible web project is that high-level, declarative APIs should be able to be explained in terms of lower-level, imperative APIs. Not just lower-level algorithms, but APIs: the capabilities that we encapsulate inside a given HTML element should also be exposed directly to JavaScript authors. And those APIs should be factored into small, composable pieces, that build on each other to eventually produce the declarative edifice that is HTML. In this way, authors can reuse these platform capabilities without jumping through hoops (like instantiating a HTMLAnchorElement just to parse a URL) or rebuilding large parts of the platform for themselves (like creating their own scrolling logic just to get pull-to-refresh behavior).

Switzerland - 🇨🇭 Switzerland takes a functional approach to Web Components by applying middleware to your components


Switzerland takes a functional approach to Web Components by applying middleware to your components. Supports Redux, mobx, attribute mutations, CSS variables, React-esque setState/state, etc… out-of-the-box, along with Shadow DOM for style encapsulation and Custom Elements for interoperability.


auto-check-element - An input element that validates its value with a server endpoint.


An input element that validates its value against a server endpoint. Provide a URL and a CSRF token and the autocheck component will show validation confirmations and validation errors.

auto-complete-element - Auto-complete input values from server search results.


Auto-complete input values from server search results. Distributed under the MIT license. See LICENSE for details.

details-dialog-element - A modal dialog that's opened with a <details> button.


A modal dialog that's opened with a <details> button. Distributed under the MIT license. See LICENSE for details.

tao_on_rails - The Missing Front-end Framework for Rails Project


Ruby on Rails lacks a recommended way to structure your frontend code in large project for many years. Tao on Rails is the framework to fill the gap which will modularize your page with the new Custom Elements v1 API. See tao.zhiren.com for tutorials and API reference.

clipboard-copy-element - Copy element text content or input values to the clipboard.


Copy element text content or input values to the clipboard. After copying to the clipboard, a copy event is dispatched that can be used to notify the user with confirmation, like a tooltip or button highlight.

excise - a react-like toolkit for web components


Or give it a try using this JSBin in Chrome. you'll need a browser that supports custom elements v1 and shadow dom v1. chrome 55 will work.

custom-elements - All about HTML Custom Elements


Custom Elements is a W3C "working draft" specification that provides a mechanism for defining new behaviors (such as dynamic content or interactivity) for HTML elements with custom names. Custom elements are just HTML elements, with all of the methods and properties of other, built-in elements. The only real constraint* is that their names must contain at least one hyphen (-).