Comments (10)
From my comment here: WICG/webcomponents#776 (comment)
These are things that describe the basic HTML, DOM, & CSS structure of an element:
- Tag name
- Defining module
- Attributes
- DOM interface
- properties
- methods
- superclass
- Events fired
- CSS variables
- CSS shadow parts
- CSS custom state
- Slots
- Default ARIA roles
- Permitted content
- Permitted parents
- Form participation
In addition, we'll probably want:
- Demo location (hosted or packaged)
- Typings
- Libraries used
- Design system used
- Tags
- Collection membership
- Additional non-standard protocols supported:
- Theme systems
- Context / dependency injection, pending-tasks, etc.
from custom-elements-manifest.
I would add an information whether a property is readonly or not. When only getter is created then a property is read only.
from custom-elements-manifest.
I am a little afraid if we put here all the things that are potentially nice - that it will be just wwaayyy too much.
Let's focus on what are the must-haves for an MVP then go for it and then adjust from there.
I would say must-haves are (all have name, description)
- attributes (+ default, required, typeHint)
- properties (+ default, required, typeHint)
- methods (+ params)
- events
- slots
- cssProperties (+ typeHint)
- cssParts
You can see a complete example here #3 (comment)
from custom-elements-manifest.
@daKmoR a lot of what I included are necessary to document the material components. We absolutely need to document CSS shadow parts if we include them. There aren't a lot of methods, but those need to be documented as much as properties.
from custom-elements-manifest.
One thing not listed above is delegatesFocus
feature.
from custom-elements-manifest.
I should be the merged information 👍 as for many use case it should just be read this one file and you should have everything you need 🤗
For the inheritance I'm not sure how easy that is from the analyze tools size... let's discuss it separately at #7
from custom-elements-manifest.
jup fully agree 👍 added methods (+ params)
and cssParts
possible output example
Methods
Name | Description |
---|---|
open | Will open a dialog where you can define an initial action Params: - focusAfterClose <Element> Provide a reference to an element so it get's focus after close - initialDelay <Number> You can delay when the option action should happen |
close | Closes the Dialog |
from custom-elements-manifest.
@daKmoR the superclass is also important for extending built-ins (also interesting for an IDE to allow auto completion for the is
attribute.
A general question regarding inheritance should the element information just contain the attributes/properties/events which are declared in the specific implementation or implementation + super class information merged (preferred). Otherwise there must be a field which defines the module/package where the super class is defined to pull the information from the packages custom-elements.json (which complicates things if you need to resolve custom-elements.json and merge them during runtime)
from custom-elements-manifest.
This might be a question rather than a requirement/feature request - I'm not sure. In my vanilla component, I'm piggybacking on some common event names that already exist in the DOM for my custom events.
For example, I dispatch a "playing" event, and I call it "playing" so that the tag has the power to use "onplaying" as an attribute.
It's not clear to me if this should be documented as an event, an attribute, or both. Maybe a special category is needed to get across the idea that this is an even that can be used as "onwhatever".
from custom-elements-manifest.
I have another weird one. I'm likely looking to put non-slotted content as non-rendered DOM objects existing outside the Shadow Root that exist purely for reference and for the sake of placing in a tag to feed the component data. Basically exactly what A-Frame is doing. I assume this falls under "permitted content"? Maybe it's too much of an edge case to really consider in the spec, but something I'm likely to do
from custom-elements-manifest.
Related Issues (20)
- Generated schema contains errors HOT 3
- How to output `oneOf` for discriminated unions. HOT 1
- sync between source and manifest HOT 2
- Add support for package and element icons and screenshots HOT 1
- add funding links
- Add support for CSS CustomState
- Add support for symbol-named class members HOT 1
- Add support for including canonical URLs for References
- Needed styles for elements HOT 4
- Package name field HOT 1
- Ability to document type of detail property for CustomEvents HOT 5
- README should mention that manifest can (and should) be generated by a tool
- `tagName` should not be part of the manifest HOT 4
- Publish New Version HOT 1
- Access modifier issue on derived class HOT 1
- Status of the "manifest" HOT 4
- Deomnstration Project using the Manifest... HOT 1
- To which files should the manifest link. .ts, .js, both, ... HOT 8
- componentRegistered Information HOT 1
- desc.startsWith is not a function HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from custom-elements-manifest.