Releases: titon/toolkit
2.1.0
This minor release includes flexbox functionality, RTL integration, improved BEM support, and much more.
2.0.0
This major release includes a rewritten class, event, hooks, and component layer. It improves overall tooling, drops out dated technologies, introduces new concepts, and more.
1.5.0 - Fabulous Fairy
This minor release includes a new responsive option, a major overhaul of the Carousel component, and a complete refactor of the demo system. It also marks the final minor release before the 2.0 major version.
- MooTools support is slowly being phased out and JavaScript changes have not been ported
- Added
$.fn.transitionend()
which will set atransitionend
event if transitions have been defined on the element,
else it will execute the callback immediately - Added a global
responsive
component option that allows for different options to be set depending on breakpoints - Updated
$.fn.positionTo()
to re-position accordingly when a mouse event is being used as the offset - Button Group
- Fixed a bug with incorrect button widths when the
vertical
modifier is used
- Fixed a bug with incorrect button widths when the
- Carousel
- Added a
container
property which is the parent element foritems
- Added a
animating
property that represents whether the items are currently animating - Added a
calculate()
method that resizes the carousel based on the window size and defined options - Added a
infinite
option which allows for infinite cycling in either direction - Added a
loop
option which rewinds the cycle pointer to the beginning or end when the opposite edge is reached
(only applicable wheninfinite
is disabled) - Added a
reverse
option to reverse the automatic cycle direction - Added a
itemsToShow
option which is used for displaying a specific number of items at once - Added a
itemsToCycle
option which is used as the number of items to move when a cycle occurs - Added a
defaultIndex
option which displays that item on initial page load - Added
.no-next
and.no-prev
classes to the component to hide navigation buttons - Added
.carousel-stop
and.carousel-start
as elements to delegate events to - Removed
.carousel-caption
styles
- Added a
- Form
- Added
.fields
which can be coupled with list elements to mimic.field
- Added
- Lazy Load
- Fixed a bug where offsets were incorrect when the parent with overflow was not the direct parent
- Matrix
- Fixed a bug where multiple spanning items break when the span is larger than the column count
- Updated image pre-loading to use deferred promises
- Removed
imagesLoaded
property - Removed
onLoad
method
- Pin
- Fixed a bug where
yOffset
was not being applied forfixed
pins
- Fixed a bug where
- Popover
- Fixed a bug when no options were passed to the constructor
- Showcase
- Updated item cycling to use deferred promises
- Added a
animating
property that represents whether the items are currently animating - Fixed a bug where gutter was not being applied correctly
- Fixed a bug where the incorrect item was being opened when a grouping is used
1.4.0 - Evasive Elf
This minor release includes 3 new components, a new destroy()
method,
a cleanup of element and event options, expanded documentation, and a handful of optimization improvements.
- Usage license has been updated to BSD-3 from BSD-2
- MooTools support is slowly being phased out and new components are not supported
- Added new Divider component for separating content
- Added new Off Canvas component for displaying sidebars outside the viewport
- Added new Toast component for notifying users with timed messages
- Added
.no-transition
class to disable transitions - Added
.sr-only
class for screen readers - Added
suppression
setting for swipe events - Fixed a bug with
swipe
events where select dropdowns would stop working - Fixed a bug with
swipe
events where page scrolling gets disabled - Fixed a bug with certain fade animations
- Fixed a bug where certain Sass variables were not customizable
- Removed
$shape-square-class
Sass variable - Removed
*Element
options (CSS classes are now hardcoded) - Removed
*Event
options (CSS classes are now hardcoded) - Toolkit
- Added
toolkit(component, method, args)
support for triggering methods on the class instance - Added
transitionEnd
flag - Refactored
toolkit()
to return a single instance instead of multiple instances - Removed
i()
anditem()
jQuery collection methods
- Added
- Component
- Added a
initialize()
method that is triggered within all constructors - Added a
destroy()
method that will unbind all events, remove elements, and delete the instance - Added automatic
this
scope binding to all methods on a class instance - Refactored
bindEvents()
with an easier lightweight syntax
- Added a
- Accordion
- Removed
headerElement
,sectionElement
options
- Removed
- Blackout
- Fixed incorrect
.loader-spinner
class
- Fixed incorrect
- Carousel
- Removed
nextButton
,prevButton
properties - Removed
itemsElement
,tabsElement
,nextElement
,prevElement
options
- Removed
- Code
- Added overflow scrolling for touch devices
- Flyout
- Disabled automatically for touch devices
- Removed
contentElement
option
- Input
- Added
hideOpened
option to selects to hide other opened selects - Updated
native
option value to beToolkit.isTouch
by default
- Added
- Lazy Load
- Removed
isLoaded
property
- Removed
- Mask
- Added
selector
option to bind toggle events to - Renamed
.maskable
to.mask-target
- Removed
messageElement
option
- Added
- Modal
- Added
$modal-mobile-breakpoint
to apply mobile widths to the modal - Added
submit()
method for submitting forms - Updated with new markup
- Renamed
.modal-event-submit
to.modal-submit
- Renamed
.modal-event-close
to.modal-hide
- Removed
.modal-handle
within the template - Removed
elementBody
property - Removed
contentElement
,closeElement
,closeEvent
,submitEvent
options - Removed
sticky-*
animations
- Added
- Popover, Tooltip
- Removed
titleElement
,contentElement
options
- Removed
- Showcase
- Updated with new markup
- Renamed
.showcase-event-prev
to.showcase-prev
- Renamed
.showcase-event-next
to.showcase-next
- Renamed
.showcase-event-close
to.showcase-hide
- Renamed
.showcase-event-jump
to.showcase-tabs a
- Removed
nextButton
,prevButton
properties - Removed
transition
,itemsElement
,tabsElement
,prevElement
,nextElement
,
closeEvent
,jumpEvent
,prevEvent
,nextEvent
options
- Tabs
- Removed
navElement
,sectionElement
options
- Removed
- Type Ahead
- Removed
contentElement
option
- Removed
1.3.0 - Diligent Dragon
This minor release includes 2 new components, automatic ARIA support for all applicable components,
replacing Compass with autoprefixer, removal of state prefixing, and many more bug fixes and improvements.
- Added new Step component for step based navigation
- Added new Switch component for visual checkbox switches
- Added ARIA support to all components with supported documentation
- Added CSS vendor prefixing support through autoprefixer
- Added namespace event triggering support to the activating node
- Removed is and has state prefixing from the CSS and JS layers
- Removed
$state-is-prefix
and$state-has-prefix
Sass variables - Removed individual JavaScript distribution files
- Removed Compass dependency in favor of autoprefixer
- Updated to normalize.css v3.0.1
- jQuery
- Updated
$.fn.item()
to return an empty jQuery collection if index out of range - Refactored the
clickout
event to support delegated elements - Removed
$.hyphenate()
- Removed event helper methods like
clickout()
,swipeleft()
, etc
- Updated
- Toolkit
- Added
aria
property to toggle support - Added
aria()
collection method that can set ARIA attributes - Removed
Toolkit.options.isPrefix
andToolkit.options.hasPrefix
- Renamed
Toolkit.options.vendor
toToolkit.vendor
- Renamed
Toolkit.createComponent()
toToolkit.create()
- Added
- Component
- Added global
cache
option to toggle AJAX response caching - Added static
count
property to each component that tracks the number of instances in the page - Added
uid
property that represents the current instance count - Added
cssClass
property that represents the component name in CSS class form - Added
id()
method to generate unique CSS class names - Removed error and loading template generation from components (wasn't being used)
- Added global
- Carousel
- Fixed a bug where
swipedown
would not trigger - Merged
itemsElement
anditemElement
options - Merged
tabsElement
andtabElement
options - Removed
itemsWrapper
,itemsList
,tabsWrapper
properties
- Fixed a bug where
- Drop
- Added a global
.drop
class that all menus require
- Added a global
- Grid
- Added
%row
placeholder to extend row styles from - Added
%col
placeholder to extend column styles from - Removed
.row
(reserved now for another component)
- Added
- Modal
- Fixed a bug where a modal opened on the same modal causes the blackout to persist
- Pin
- Added
lock
option to disable pinning if element is taller than the viewport - Added
$pin-transition
variable - Fixed a bug where the pin element margin was not included in the total height
- Added
1.2.0 - Cunning Chimaera
This minor release includes thorough documentation for all components,
a refactored event binding and management layer, a data attribute option inheritance layer,
and an optimization and cleanup pass. Also bug fixes.
- Added
join-classes()
function - Added
grunt production
command to compress for production purposes - Updated
grunt
command to not compress for development purposes - Renamed all
__*
methods toon*
- Renamed
currentIndex
toindex
in all components - Removed
content-spacing()
mixin - Removed
previousIndex
properties - Removed
loadingMessage
anderrorMessage
options - Removed
.medium
class support - Removed automatic setting of
animation
andclassName
CSS classes for embedded elements - Removed background and font colors from CSS to reduce CSS filesize
- Toolkit
- Added
bound()
to bound a number - Added
isRetina
flag - Updated
positionTo()
to re-position if the element falls outside the viewport
- Added
- Component
- Refactored that event management layer within all components
- Added
bindEvents()
to handle event attaching and detaching (paired with change above)- Called automatically from
enable()
anddisable()
- Called automatically from
- Added option inheritance from data attributes found on target elements and nodes
- Possible through new
inheritOptions()
- Possible through new
- Added option inheritance from parent component
- Added
readOption
to find an option via data attribute of option object - Merged
setElement()
logic intocreateElement()
- Removed
setElement()
- Accordion
- Updated
show
event arguments to[section, node, index]
- Updated
- Base
- Added
.no-scroll
- Removed
.inline
,.inline-block
,.static
,.relative
, and.absolute
- Added
- Blackout
- Added a
shown
argument to theshow
event - Added
showLoader
andhideLoader
events - Renamed
loaderMessage
option toloadingMessage
- Added a
- Button
- Added outline none to
:focus
styles - Fixed a bug with
input
buttons
- Added outline none to
- Button Group
- Removed
!important
from negative margin properties
- Removed
- Drop
- Added support for drops built with
ol
- Updated
show
andhide
event arguments to[element, node]
- Added support for drops built with
- Flyout
- Fixed a bug where data items were being mapped with no URL
- Removed
load
event fromshow()
as it was being used incorrectly
- Form
- Renamed
.is-legendless
to.no-legend
- Cleaned up some basic styles
- Renamed
- Grid
- Changed
$grid-columns-medium
to 12 - Added
$grid-push-pull
to toggle push and pull classes in output
- Changed
- Icon
- Removed
.icon--rotate
- Removed
- Input
- Updated build methods to be private
- Fixed an issue where select event names were incorrect
- Input Group
- Added small and large size support
- Lazy Load
- Instantiation will need to be set on a container instead of the items being loaded
- Added
data-src-retina
support - Added support for lazy loading within an overflown element
- Fixed a bug where hidden images were being loaded
- Renamed
data-lazyload
todata-src
- Loader
- Renamed
.spinner
to.loader-spinner
- Renamed
- Matrix
- Replaced
.matrix-item
withli
- Removed
selector
option - Removed inline
img
styles, use.fluid
instead
- Replaced
- Modal
- Added
$modal-animation
to filter the animations in the CSS output - Updated
.modal-close
to use abutton
- Updated
ajax
andgetContent
options to be inheritable at runtime through the activating node - Refactored markup and CSS to support large height modals
- Removed
flip
andflip-vert
animations - Removed dragging (temporarily)
- Added
- Pin
- Fixed a bug where
.is-pinned
was not being removed
- Fixed a bug where
- Popover & Tooltip
- Added
$popover-tooltip-animation
to filter the animations in the CSS output - Added
$popover-arrow-width
and$tooltip-arrow-width
to alter the arrow sizes - Added automatic compatibility of
title
attributes - Fixed a bug where node was being set and used incorrectly
- Fixed a bug with mouseleave events
- Options
className
andposition
are added and removed dynamically each reveal - Updated options to be inheritable at runtime through the activating node
- Updated
position
values to be dashed instead of camel case - Removed
slide-in
animation
- Added
- Progress
- Added multiple progress bar support
- Removed
.medium
size - Refactored state classes
- Responsive
- Added
.fluid
class for images, audio, canvas, etc
- Added
- Showcase
- Updated options to be inheritable at runtime through the activating node
- Replaced
a
withbutton
- Stalker
- Added nested marker support
- Added
targetBy
andmarkBy
options - Removed
marker
andtarget
properties
- Table
- Moved zebra-striping into an
.is-striped
class
- Moved zebra-striping into an
- Tabs
- Renamed
sectionsElement
option tosectionElement
- Renamed
- Type Ahead
- Renamed
process()
tosource()
- Renamed
1.1.0 - Boundless Basilisk
This minor release includes 2 new components, a rewritten jQuery class layer, improved swipe events,
a major rewrite to the Input component, and a many more bug fixes, improvements, and additions.
- Added a
Loader
component - displays loading animations using purely CSS - Added a
Mask
component - masks an element with a transparent overlay - Added a
clickout
event type that triggers when a click happens outside of an element - Added
reset-list()
andposition-center()
mixins - Added no conflict resolution through a component creation method
- Added a
--demo
parameter to Grunt that builds files for demo purposes - Improved the Grunt build process
- Refactored
debounce()
andthrottle()
methods - Replaced Toolkit
ie8
andie9
flags withhasTransition
feature flag - Renamed
Titon.js
toToolkit.js
- jQuery
- Prototype inheritance has been rewritten and improved
- New properties
component
andversion
have been added to all components - Namespaced element events are now triggered in the format of
<event>.toolkit.<component>
- Added
$.cookie()
and$.removeCookie()
methods - Added
swipe
,swipeleft
,swiperight
,swipeup
, andswipedown
event types for touch devices
- Component
- Added
process()
to handle non-HTML AJAX responses - Added
onProcess
option event - Updated
requestData()
to callposition()
for HTML responses andprocess()
for non-HTML - Updated
requestData()
to accept an object of options as the 1st argument - Updated
fireEvent()
to trigger namespaced element events (jQuery only)
- Added
- Accordion
- Renamed
.accordion-head
to.accordion-header
- Renamed
.accordion-handle
to.accordion-section
- Renamed
contentElement
option tosectionElement
- Renamed
- Blackout
- Rewritten to be a singleton to differ from the new
Mask
component - Added
Loader
support for in-between states - Added
showLoader()
andhideLoader()
methods that toggle the loader - Added
Toolkit.Blackout.factory()
to return the single instance - Added a
count
property that records how many times the blackout has been opened to allow for multiple components to display - Added a
loader
option that determines which loader class to render - Added a
loaderMessage
option that displays a loading message while the blackout is loading - Added a
waveCount
option that determines how many bars to display in wave loaders
- Rewritten to be a singleton to differ from the new
- Dropdown
- Renamed component to
Drop
- Renamed modifiers to
drop--down
,drop--up
,drop--left
, anddrop--right
- Replaced alignment classes with a single
reverse-align
class
- Renamed component to
- Grid
- Added an
.end
class that can be used on the last.col
for justification - Updated
$grid-columns-medium
from 8 to 9
- Added an
- Input
- Has been split up into 3 sub-components:
Radio
,Checkbox
, andSelect
- Added new jQuery methods
radio()
,checkbox()
, andselect()
(primaryinput()
method still exists and triggers all 3) - Added custom drop down support that replaces the native drop downs (requires the
Drop
component) - Added multiple select support (only possible when native is disabled)
- Added a
copyClasses
option that will copy classes from the form element to the custom one - Added a
native
option that opens native drop downs instead of custom drop downs - Added a
hideFirst
option that hides the first select option - Added a
hideSelected
option that hides the currently selected option - Added a
multipleFormat
option that describes the label format for multi-selects - Added a
countMessage
option that defines the message to use when format is count - Added a
listLimit
option that limits the number of items in the multiple message - Added a
arrowContent
option that renders the contents of a select arrow - Added a
getDefaultLabel
option that displays the default label for multi-selects - Added a
getOptionLabel
option that displays custom titles for options - Added a
getDescription
option that allows for option descriptions
- Has been split up into 3 sub-components:
- Modal
- Multiple modals can now be opened at the same time (requires separate modal instances)
- Added file uploading support for form submissions (requires the browser
FormData
API) - Added a
stopScroll
option that freezes the scrollbar while the modal is open - Refactored to handle the
Blackout
changes - Removed the
showLoading
option in favor of theBlackout
loader
- Showcase
- Added a
stopScroll
option that freezes the scrollbar while the showcase is open - Refactored to handle the
Blackout
changes - Updated gutter detection to include the showcase padding
- Added a
- Popover & Tooltip
- Fixed a bug where the title was not being displaying during an AJAX load
- Added a
loadingMessage
option to use during AJAX loading - Updated default
position
totopCenter
- Type Ahead
- Added
cycle
event
- Added
1.0.0 - Adventurous Akuma
- Released! Aww yiisss