๎กป

Droppers
Snippets 

	<!-- Droper . Links -->
	<dropper class="dropper" type="link">
		<ul>
			<li data-value="https://google.com"><a>Google</a></li>
			<li data-value="https://youtube.com" class="active">
			<a>Youtube</a>
			</li>
		</ul>
	</dropper>

	<!-- Droper . Selectable -->
	<dropper class="dropper" type="select" required="required">
		<ul>
			<li><a>-</a></li>
			<li data-value="option_a" class="active"><a>Option A</a></li>
			<li data-value="option_b"><a>Option B</a></li>
		</ul>
	</dropper>

	<!-- Droper . Action -->
	<dropper class="dropper" type="action" data-label="Select action">
		<ul>
			<li data-value="dummy_function"><a>Action A</a></li>
			<li data-value="print"><a>Print</a></li>
		</ul>
	</dropper>
Options
Type Value
Status none, locked, disabled valid, invalid, changed
Size none, tiny, small, default, medium, large, huge, xs-[size], sm-[size], md-[size], lg-[size]
Styles none, rounded
Colors . Background none, color
Type Name Value
default id string
default title string
default type link, action, select
validation required required
callback data-callback-initialize function Triggers on initialization
callback data-callback-create function Triggers on creation
callback data-callback-update function Triggers on updating
callback data-callback-change function Triggers on changing
callback data-callback-reset function Triggers on reset
callback data-callback-validate function Triggers on validation
callback data-callback-persist function Triggers on persisting
callback data-callback-hover function Triggers on hover
callback data-callback-focus function Triggers on focus
callback data-callback-lock function Triggers on locking
callback data-callback-unlock function Triggers on unlocking
callback data-callback-disable function Triggers on disabling
callback data-callback-enable function Triggers on enabling
callback data-callback-hide function Triggers on hiding
callback data-callback-show function Triggers on showing
Methods 

	// Scan droppers
	basekit.components.droppers.scan(scope);
Parameters Value
scope null element 

	// Initialize droppers
	basekit.components.droppers.initialize(scope);
Parameters Value
scope null container rater(s) 

	// Create raters
	basekit.components.raters.create(type,id,name,value,values,title,options,callback);
Parameters Value
type 'link', 'action', 'select'
id string
name string
value string
values json
title string
options 'locked', 'disabled'
callback function 

	// Update droppers
	basekit.components.droppers.update(scope,type,id,name,value,values,title,options);
Parameters Value
scope dropper(s)
type 'link', 'action', 'select'
id string
name string
value string
values json
title string
options 'locked', 'disabled' 

	// Cancel active droppers
	basekit.components.droppers.cancel();
Parameters Value
- - 

	// Set scope
	var scope= $('dropper');

	// Reset droppers
	basekit.components.droppers.reset(scope);
Parameters Value
scope null dropper(s) 

	// Set scope
	var scope= $('dropper');

	// Validate droppers
	basekit.components.droppers.validate(scope);
Parameters Value
scope null dropper(es) 

	// Set scope
	var scope= $('dropper');

	// Persist droppers
	basekit.components.droppers.persist(scope);
Parameters Value
scope null dropper(s) 

	// Set scope
	var scope= $('dropper');

	// Lock droppers
	basekit.components.droppers.lock(scope);
Parameters Value
scope null dropper(s) 

	// Set scope
	var scope= $('dropper');

	// Unlock droppers
	basekit.components.droppers.unlock(scope);
Parameters Value
scope null dropper(s) 

	// Set scope
	var scope= $('dropper');

	// Disable droppers
	basekit.components.droppers.disable(scope);
Parameters Value
scope null dropper(s) 

	// Set scope
	var scope= $('dropper');

	// Enable droppers
	basekit.components.droppers.enable(scope);
Parameters Value
scope null dropper(s)
Sizes 
tiny
 
small
 
default
 
medium
 
large
 
huge
Styles 
default
 
rounded
Colors 
primary
 
secondary
 
transparent
 
transparent light
 
red
 
green
 
blue
 
orange
 
yellow
 
grey
 
black
 
white
 
red_dark
 
green_dark
 
blue_dark
 
orange_dark
 
yellow_dark
 
grey_dark
 
black_dark
 
white_dark
 
red_medium
 
green_medium
 
blue_medium
 
orange_medium
 
yellow_medium
 
grey_medium
 
black_medium
 
white
 
red_light
 
green_light
 
blue_light
 
orange_light
 
yellow_light
 
grey_light
 
black_light
 
white_light
Droppers . Outlines 
primary outline
 
secondary outline
 
red outline
 
green outline
 
blue outline
 
orange outline
 
yellow outline
 
grey outline
 
black outline
 
white outline
 
red_dark outline
 
green_dark outline
 
blue_dark outline
 
orange_dark outline
 
yellow_dark outline
 
grey_dark outline
 
black_dark outline
 
white_dark outline
 
red_medium outline
 
green_medium outline
 
blue_medium outline
 
orange_medium outline
 
yellow_medium outline
 
grey_medium outline
 
black_medium outline
 
white outline
 
red_light outline
 
green_light outline
 
blue_light outline
 
orange_light outline
 
yellow_light outline
 
grey_light outline
 
black_light outline
 
white_light outline
 
primary outline
 
secondary outline
 
red outline
 
green outline
 
blue outline
 
orange outline
 
yellow outline
 
grey outline
 
black outline
 
white outline
 
red_dark outline
 
green_dark outline
 
blue_dark outline
 
orange_dark outline
 
yellow_dark outline
 
grey_dark outline
 
black_dark outline
 
white_dark outline
 
red_medium outline
 
green_medium outline
 
blue_medium outline
 
orange_medium outline
 
yellow_medium outline
 
grey_medium outline
 
black_medium outline
 
white_medium outline
 
red_light outline
 
green_light outline
 
blue_light outline
 
orange_light outline
 
yellow_light outline
 
grey_light outline
 
black_light outline
 
white_light outline