@particles/tiered-select

A tiered select.

Usage no npm install needed!

<script type="module">
  import particlesTieredSelect from 'https://cdn.skypack.dev/@particles/tiered-select';
</script>

README

Tiered Select

A tiered select.

Example

tiered-select

Change Log

5.7.2
  • Fixed blank search results on scroll when searchResult prop is not passed
5.7.1
  • Fixed IE picker not scrolling when not in Tier 1
5.7.0
  • Adds prop canLoadMoreSearch to render load more button when searching
  • Adds props onDrillUp its the same as onDrillDown but for parent tiers in the breadcrumbs
5.6.0
  • Adds prop createInputError to show an error on the createInput
  • Adds prop for a onCreateInput callback called with the value and fullName, to allow reaction to change events in the create input
5.5.3
  • Dropdown opens above if no room bellow
5.5.2
  • Fix: "The selectedId passed to TieredSelect could not be found in the data." warning will not show when data is empty
5.5.0
  • Fix: selecting an already selected value does not clear out the picker
5.4.1
  • Fix inline style variant outline
5.4.0
  • Allow optional portalStyle
5.3.2
  • Use window.scrollY OR window.pageYOffset
5.3.1
  • Use window.scrollY
5.3.0
  • add fullNameKey for "First > Second > Garage Door" values to support nodeNameKey for "Garage Door"
  • simplify search logic
5.2.0
  • accepts didError prop to apply className .dropdownHead.error
  • make update from v4->v5 easier. node_name, full_name, my_name whatever the key for the last item in your path can be confirgued with nodeNameKey
5.1.0
  • Add SCSS for animations
  • Add I18n for Location Cancel and Create
  • Reset State onCollapse
  • Render Location breadcrumb ALWAYS
  • Render search items on optional max display prop
5.0.0
  • Fixed itemName. Was showing full name instead of just the node name.
  • Breaking Fixed name to node_name and name to full_name to match vapid endpoint (This was introduced in 4.5.1 but not marked as a breaking change.)
4.7.2
  • Fixed CSS for forward button
4.7.1
  • Added maxDisplay prop to control how much search results display
4.7.0
  • Remove font family declarations/set fonts to inherit
  • Use own webpack config instead of one in particles root
  • No longer imports core-css for just one class
  • Styles from core-link class have been added to loadMoreLink
4.6.0
  • Added inline style variant to match other particles
4.5.5
  • Added i18n for load_more
  • Made load more button only appear when not loading
4.5.4
  • Fixed bug with initial title value
  • Added tabbing out functionality
4.5.3
  • Added optional initial title value to display before data is loaded
  • Fixed create input css
4.5.2
  • Instead of focusing by default, onContainerKeyDown now passed in as prop
  • Prevent focus search from scrolling (to fit portals)
4.5.1
  • Added ref to self (selectRef)
  • Fixed keyboard tabbing in and 'Enter' refocusing to parent
  • Breaking Fixed name to node_name and name to full_name to match vapid endpoint
4.5.0
  • Added Portal, adjusted CSS accordingly
4.4.0
  • Performance improvement - the running time of setup data for 15000 items dropped from 400 seconds to 2 seconds.
  • Removed unnecessary sort of searched items.
  • Use JSON.parse(JSON.stringify(obj)) trick instead of Object.assign for deep clone.
4.3.1
  • Fixed the bug that you cannot search due to onChange is hijacked by onKeyDown.
4.3.0
  • Truncate full name such that head and tail always shown to the user.
  • Use esc key for closing the dropdown.
  • Hide the dropdown if user select an option.
  • Allow different actions on clicking create button.
  • Safe check some attributes to prevent crashing.
4.2.4
  • Stops dropdown from closing when create input is clicked
  • Linting
4.2.3
  • Check for currentId in memoizedData before evaluating
4.2.2
  • Upgraded to React 16
4.2.1
  • Check for parent-id in memoizedData before evaluating for lazy loading
4.2.0
  • Adds onFocus method for lazy loading

4.1.0

  • Added support for asynchronous data loading (requires use of allOptionsSelectable = false and adding can_select and can_drilldown within data options)
  • Added prop showAnimation to disable animation when not needed
  • Added callbacks for onSearch, onDrilldown and onLoadMore
  • Removes breadcrumbs at the root level
  • Only shows the footer when canCreate enabled

4.0.0

  • Breaking Now activated as dropdown
  • Breaking Checkboxes removed
  • Breaking Removed 8-level restriction
  • Breaking Footer markup changes
3.2.0
  • Add i18n create placeholder
3.1.0
  • Added support for arrow up, down, left, and right and enter keys

3.0.0

  • Breaking Current selection now ID not object
  • Breaking canAdd changed to canCreate
  • Breaking i18n added
  • Breaking Many evt.stopPropagation()s removed
  • Breaking Limit hard coded
  • Big refactor
2.2.1
  • Add unit tests, CSS module mocking, and code coverage reporting.
2.2.0
  • Analytics added
2.1.1
  • Webpack dev server upgrade
2.1.0
  • Animated transitions
  • Other style cleanup/upgrades
2.0.1
  • Modify create action for API compatibility

2.0.0

  • Overhaul to allow for tiered data to be navigated, selected, and created
1.0.1
  • Style fixes

1.0.0

  • Initial commit