This release focuses on significant changes to basic-carousel and the pieces it depends on.

• basic-carousel now uses basic-animation-stage as its rendering surface. Among other things, this means that a carousel can support a wide variety of animated transition effects. It also means that selection can visually wrap around from the last item to the first (and vice versa).
• The previous implementation of basic-carousel is now available as a new component called basic-sliding-carousel. You can use this to avoid requiring the Web Animations polyfill; see below.
• A new component, basic-play-controls, can be used to wrap slideshow-like components like basic-slideshow to give them a Play/Pause button, as well as Previous/Next buttons. It is similar to basic-arrow-selection.
• A new component, basic-slideshow-timer, can be used to wrap carousel components like basic-carousel to automatically advance the selection on a timer. This is one way to achieve a combination carousel+slideshow.

Some other changes:

• Components and mixins now use a new convention for setting default values, which should result in more consistent results.
• All components and mixins that hang instance data off of an element can now do so via ES6 Symbol objects rather than underscore-prefixed properties. Previously, a "private" property would be named like this._foo, which exposed private API data in a way that might have been too easy for people to depend upon. By using Symbols, private data is made more private, and deterring people from depending on private APIs. See the createSymbol helper in basic-component-mixins for more information.

This release includes some breaking changes:

• Because basic-carousel now uses basic-animation-stage, basic-carousel requires the Web Animations API. This is supported in newer versions of Chrome and Firefox, but other browsers will require the Web Animations polyfill. If you would like to avoid requiring that polyfill, use the basic-sliding-carousel component instead.
• The fractionalSelection helpers have been reworked into a new mixin called FractionalSelection. The file name changed to follow our mixin file naming convention.
• The TimerSelection mixin now defaults to not playing by default.

This release is largely focused on a new mixin, SelectionAnimation, and a new component, basic-animation-stage, which uses the mixin to provide animated transition effects when the selection changes.

basic-animation-stage is intended to be a general-purpose rendering surface for situations like carousels and slideshows, where a component wants to show sliding, fading, scaling, and other effects when selection moves between items. Significantly, the underlying SelectionAnimation mixin is designed to work with mixins like SwipeDirection and TrackpadDirection, so that when the user is dragging to change the selection, the animated effect can be presented at an arbitrary point. That is, the same animation effect can be played smoothly when selection is changed between discrete values (like with the keyboard), or in a frozen state in the middle of a drag.

The plan is for basic-animation-stage to eventually replace basic-sliding-viewport as the core rendering surface for basic-carousel. One advantage and disadvantage of SelectionAnimation is that it uses the Web Animations API. That allows for fast, smooth animations on browsers that support that API natively, but using the API on older browsers like Edge/IE requires the Web Animations polyfill. See the component/mixin docs for details.

Other improvements in this release:

• ItemsSelection now supports a selectionWraps property which lets selection wrap around from the last item to the first and vice versa. This new property is also supported by the related TargetSelection mixin.
• A createSymbol() helper function has been added to the basic-component-mixins package. This function can be used by mixins or components that would like to store data on an element instance without necessarily exposing that data as an element property.
• The basic-component-mixins package also now has a fractionalSelection.js module that offers a variety of helpers for working with "fractional" selection values: a real (floating) number used to represent points in between integer selectedIndex values. This is used, e.g., to represent the state of drag operations in SwipeDirection and TrackpadDirection.
• The position property used by the SwipeDirection and TrackpadDirection mixins has been renamed travelFraction to better reflect its meaning. See those mixins for details.
• The SwipeDirection mixin now applies touch-action: none by default to any component using the mixin, in order for swipe operations to work correctly in Edge/IE.

This release is focused on improving the documentation for components by folding in documentation for all members defined by mixins. This makes it much easier to see which properties, methods, and events are defined on a given component.

This release also picks up a minor improvement to WrappedStandardElement. When wrapping a standard element that is display: block by default, the wrapped element will also be display: block. This makes it easier for a wrapped component to be a drop-in replacement for a standard element.

Added four top-level components:

• basic-collapsible-panel (included in the previous release, but not listed as a top-level component)
• basic-fade-overflow (ditto)
• basic-tabs (new)
• basic-tab-strip (new)

This release also includes some new helpers:

• renderArrayAsElements(). Creates an element for each item in an array. This is used by basic-page-dots and basic-tab-strip to generate the dots/tabs for each item in the component's contents.
• toggleClass(). A helper function to work around the slightly non-standard implementation of classList.toggle in IE 11.

Miscellaneous:

• basic-arrow-selection now supports keyboard navigation when used on its own.
• The KeyboardDirection mixin now has a navigationAxis property that can limit which directional keys a component wants to respond to.

This release includes a generalization of the way we wrap standard elements like an <a> or <textarea>.

• A new class, WrappedStandardElement, handles the task of wrapping a standard HTML element.
• The existing basic-autosize-textarea component now uses WrappedStandardElement to do its wrapping. As a result, basic-autosize-textarea now has a much more complete API. It exposes essentially the complete API of a standard HTMLTextAreaElement. The component had previously only supported a limited number of textarea properties like placeholder.
• A new component, basic-current-anchor, also uses WrappedStandardElement to wrap a standard <a> anchor. This component provides a link that automatically marks itself current if it points to the current page, something useful for links in navigation UI like headers and toolbars.

This release includes some minor improvements:

• Mixins related to manipulating lists of items, such as ClickSelection and SelectionAriaActive, have been refactored so they can more easily be used on their own.
• The SwipeDirection mixin now uses standard pointer events where supported (Edge/IE) in addition to maintain its existing support for touch events (Blink/WebKit/Mozilla).
• The PageDots accessory for carousels now updates its visual state as the user is dragging from one page to the next.
• A bug has been fixed that prevented a carousel's basic-arrow-selection buttons from updating their enabled/disabled state properly.

Mostly minor changes, a couple of new things:

• Added cursor: pointer to basic-arrow-selection and basic-page-dots.
• Added "main" keys to package.json manifests to permit shorter import statements.
• Ported basic-fade-oveflow component to new JS architecture.
• Added a new mixin, OpenClose, for defining open/close semantics.
• Added a new component, basic-collapsible-panel, for use in components that collapse and expand.
• The Keyboard mixin can now be used on its own, without requiring use of a collective via TargetInCollective.
• Unit test fixes, particularly for IE 11.
• Fixed a number of cases where classList.toggle() had been used in a way that is not supported by IE 11.
• The SelectionInView mixin now ensures that an initially-selected item is in view when the component is attached.

There should be no breaking changes in the APIs for existing components and mixins.

This is a minor release to greatly expand the documentation for all components and mixins. Because our documentation is generated through jsDoc annotations in the source files, this required touching all of the component/mixin sources. However, this release should not contain any breaking changes.

This release is a significant rewrite of Basic Web Components, and includes a large number of breaking changes.

This begins the move of the project to a plain JavaScript foundation instead of using Google's Polymer library:

1. We have rewritten the basic-autosize-textarea, basic-carousel, and basic-list-box components in ES6. We transpile the ES6 source to ES5 using Babel. (Much of the source already runs on browsers with ES6 support, with the primary exception of ES6 modules.) Generally speaking, this rewritten components should behave the same as they did in the previous 0.6.4 release, but they do not require that Polymer be included.
2. We have restructured the way we distribute these components to use npm instead of Bower. The primary basic-web-components repository is now a monorepo: a single repository used to manage multiple packages separately registered with npm. The master branch now includes all components and mixins under a /packages folder. Each subfolder of /packages is registered with npm as a separately installable package.
3. We have refactored many component features into JavaScript mixins. See this blog post for some background on the decision. Mixins take the form of functions that can be applied to any component class without requiring a common runtime or framework. We believe that this will make it much easier for people to adopt key features of the Basic Web Components in their own components.
4. Each component package will include a transpiled ES5 file with that component and any mixins it requires. That will make things easier if you want to continue using ES5, but would like to incorporate a single component (or a small number of components) in an application. You do not have to use Babel or other ES6 technology just to use a component. For example, if you just want a list box in your web application, you can define an npm dependency on the basic-list-box package, and then use the basic-list-box.js ES5 file in the dist folder directly.
5. Because we are using ES6 modules, you can prepare component source files for production using a tool like Browserify or WebPack. You no longer need to use Vulcanize to concatenate HTML Imports.

As noted above, the rewritten components should generally behave the same as before. However, because we are no longer using Polymer's Shady DOM to emulate Shadow DOM, you must use the full webcomponents.js polyfill on older browsers. As all four browser vendors are racing to implement native Shadow DOM v1, we expect the need to load the polyfill to go away this year (with the notable exception of Microsoft Internet Explorer 11).

A number of Basic Web Components have not yet been rewritten. It's our plan to port the remaining components as quickly as we can.

The old 0.6.4 components remain available via Bower, but going forward we will not be publishing component updates to Bower. If you want to use the 0.7 components or future releases, you'll need to use npm.

These are major changes to the project, but our overall vision remains unchanged. If you have concerns or questions about the release or these changes, please contact Jan.

This is a minor bug fix release:

• basic-spread-items now supports a CSS variable, --basic-item-object-fit. This is applied to the CSS object-fit on any children. Since basic-carousel uses basic-spread-items internally, this allows you to govern the positioning of items in a carousel. By default, the value of --basic-item-object-fit is contain, but you can change it to other values, like cover.
• basic-carousel now works better in IE/Edge. Note that, because IE/Edge do not yet support the object-fit CSS property mentioned above, opening the basic-carousel demo in one of those browsers will show stretched images.

Changes in this release:

• basic-arrow-direction now detects whether the current device supports touch input and, if it doesn't, assumes the presence of a mouse. This will cause the arrow buttons to be visible immediately, instead of waiting for the user to move the mouse first.
• basic-arrow-direction, if it handles a click/tap on an arrow button, now absorbs the event rather than letting it continue propagating upwards.
• basic-button now extends the native button element. If you're using basic-button, you'll need to change to use the is="..." syntax:

<!-- old -->
<basic-button>OK</basic-button>

<!-- NEW -->
<button is="basic-button">OK</button>

• basic-button and basic-list-box now support Polymer-style themes via CSS mixins: --basic-button and --basic-list-box, respectively. We're still undecided as to whether these non-yet-standard approach is the best long-term solution, but are interested in giving this a try.
• basic-content-items now ignores auxiliary child elements which are normally invisible to the user: <link>, <script>, <style>, and <template>. This complies with the Gold Standard recommendation for Auxiliary Content. Components that use basic-content-items, including basic-list-box and the carousel components, now ignore auxiliary content, which means you can now use idioms such as <template is="dom-repeat"> inside of a list box or carousel. See this demo of a a carousel with a template for an example.
• basic-list-box, basic-carousel, and basic-carousel-fit (and the carousel companions basic-arrow-direction and basic-page-dots) now let you specify an initial selection via markup using the selectedIndex attribute. You can now also bind to a component's selectedIndex or selectedItem properties.
• basic-list-box now exposes a value property that returns the text content of the selected item. This property can also be set — this will select the first item whose text content matches the desired value.
• basic-page-dots includes a fix which prevented a carousel with dots from being removed from the DOM.

This release also includes initial work on a new family of components for implementing combo box patterns. This new components are not quite ready for use, but work on these components has required numerous improvements to other parts of the project, and we were interested in releasing those improvements now. Because they're not quite ready, the combo box family of components are in the basic-web-components consolidated repository, but have not yet been deployed to Bower-friendly individual repositories.

Note: we've apologize that our testing and support for Microsoft IE and Edge has slipped. This release doesn't make the problem worse, but components like basic-carousel currently don't work as expected in IE/Edge. We'll be renewing our focus on IE/Edge support, and hope to address those problems soon.