The main Coral namespace.
Sub-components
Namespaces
Static Properties
-
Coral.keys {Coral.keys}
-
A key listener for global hotkeys.
Methods
-
Coral.register
-
- Parameters:
-
Name Type Description options Object Component options.
Name Type Optional Default Description options.name String No
Name of the constructor (i.e. 'Accordion.Item'). The constructor will be available under 'Coral' at the path specified by the name. options.tagName String No
Name of the new element (i.e 'coral-component'). options.baseTagName String Yes
(none) Name of the tag to extend (i.e. 'button'). This is only required when extending an existing HTML element such that the <button is="custom-element">
style will be used.options.extend Object Yes
Coral.Component Base class of the component. When extending an existing HTML element, this should match the interface implemented by the tag -- that is, for baseTagName: 'button'
you should passextend: HTMLButtonElement
.options.mixins Array.<(Object|Coral~mixin)> Yes
Mixin or {Array} of mixins to add. Mixins can be an {Object} or a {Coral~mixin}. options.properties Object.<String, Coral~PropertyDescriptor> Yes
A map of property names to their corresponding descriptors. options.events Object Yes
Map of the events and their handler. options._elements Object Yes
Map of elements and their locations used for caching.
-
instance.defaultGet
-
- Returns:
-
The prefixed property
-
instance.defaultSet
-
- Parameters:
-
Name Type Description value * The value to set
Register a Coral component, setting up inheritance, mixins, properties, and the associated custom element.
Gets the corresponding underscore prefixed "private" property by the same name.
Sets the corresponding underscore prefixed "private" property by the same name.
Type Definitions
-
instance.mixin
-
- Parameters:
-
Name Type Description target Object The target prototype or instance to apply the mixin to. options Object Options for this mixin.
Name Type Description options.properties Coral~PropertyDescriptor.properties The properties object as passed to Coral.register. This can be modified in place.
-
PropertyDescriptor
-
Properties:
Name Type Argument Default Description transform function <optional>
The value transformation function. Values passed to setters will be ran through this function first. attributeTransform function <optional>
transform The value transformation function for attribute. The value given by attributeChangedCallback
will be ran through this function first before passed to setters.validate Coral.validate~validationFunction <optional>
Coral.validate.valueMustChange The value validation function. A validation function that takes two arguments, newValue
andoldValue
, returning true if the setter should run or false if not.trigger String|function <optional>
The name of the event to trigger after this property changes, or a {Function} to call that will trigger the event. The function is passed the newValue
andoldValue
.triggerBefore String|function <optional>
The name of the event to trigger before this property changes, a {Function} to call that will trigger the event, or true
to set the name automatically. The function is passed thenewValue
andoldValue
and must return the Event object forpreventDefault()
to work within handlers. If set totrue
, Coral~PropertyDescriptor must be a string with a colon in it, such ascoral-component:change
, which results incoral-component:beforechange
. If set tofalse
, no event will be triggered before the setter is ran.attribute String <optional>
propName The name of the attribute corresponding to this property. If not provided, the property name itself will be used. If null
is provided, the property will not be set by a corresponding attribute.reflectAttribute Boolean <optional>
Whether this property should be reflected as an attribute when changed. This is useful when you want to style CSS according to the property's existence or value. sync function <optional>
The method to be called when this property's value should be synced to the DOM. alsoSync String|Array.<String> <optional>
A property or list of properties that should be synced after this property is synced. set function <optional>
Coral~defaultSet The setter for this property. get function <optional>
Coral~defaultGet The getter for this property. override Boolean <optional>
Whether this property descriptor should completely override. If false
, this descriptor will augment the existing descriptor. See Coral.register.augmentProperties for details.contentZone Boolean <optional>
Whether this property represents a content zone. Content zones are treated differently when set() is invoked such that the provided value is passed to the content zone's set() method.
A functional mixin.
A property descriptor.