;(function(factory) {
    //CommonJS
    if (typeof require === "function" && typeof exports === "object" && typeof module === "object") {
        factory(require("knockout"), require("jQuery"), exports);
        //AMD
    } else if (typeof define === "function" && define.amd) {
        define(["knockout", "jQuery", "exports"], factory);
        //normal script tag
    } else {
        factory(ko, $);
    }
}(function(ko, $) {

        function updater(state,cb){
            if (state.updating)
                return;

            state.updating=true;
            cb();
            state.updating=false;
        }

      ko.bindingHandlers.tokenfield = {
        init: function(element, valueAccessor, allBindings) {
            var $element=$(element),  value= valueAccessor(),
                tokens = value.tokens, options = allBindings.get('tokenfieldOptions'), state ={updating:false},
                display = options.display, tokenoptions = value.predefined,
                tokenFactory =value.tokenFactory || function(){return null;},
                counterCount = 0, finder = options.finder, typeaheadSource;

            ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
                $element.tokenfield('destroy');
            });

            $element.data('tokenfield_ko_options',options);
            $element.data('tokenfield_ko_state',state);

            if (!finder){
                var localsource = new Bloodhound({
                    datumTokenizer: function(d) { return Bloodhound.tokenizers.whitespace(d.label);},
                    queryTokenizer: Bloodhound.tokenizers.whitespace,
                    local: $.map(tokenoptions,function(el){return {value:el,label:el[display]};})
                });

                localsource.initialize();

                typeaheadSource =localsource.ttAdapter();
            }
            else{
                typeaheadSource = function (query, syncResults, asyncResults){
                    finder(query).then(function(val){
                        asyncResults($.map(val,function(el){return {value:el,label:el[display]};}));
                    });
                };
            }

            options.typeahead =[options.typeahead || null,{displayKey:'label',source:typeaheadSource}];


            $element.tokenfield(options)
            .on('tokenfield:createtoken', function (e) {
                if ((state.updating) || (e.fromSelection))
                    return true;

                //set temp label
                e.attrs.value = counterCount;

                var created = (function(count){
                    return tokenFactory(e.attrs.label,function(res){
                        $.each($element.tokenfield('getTokens'),function(index,element){
                            if (element.value===count){
                                if (res===null){

                                }
                                else{
                                    element.value=res;
                                    element.label = res[display];
                                }
                            }
                        });
                    });
                    })(counterCount++);

                if (created===null)
                    e.preventDefault();
                else if (typeof(created) != 'undefined'){
                     e.attrs.value = created;
                }
            })
            .on('tokenfield:createdtoken', function (e) {
                updater(state,function(){
                    var value = e.attrs.value;
                    if (value){
                        tokens.push(value);
                        console.log(value);
                    }
                });
            })
            .on('tokenfield:editedtoken', function (e) {
            })
            .on('tokenfield:edittoken', function (e) {
            })
            .on('tokenfield:removetoken', function (e) {
                 updater(state,function(){
                    tokens.splice($(e.relatedTarget).index(),1);
                });
            }).
            on('tokenfield:sortedtoken', function (e) {
                updater(state,function(){
                    var element = tokens()[e.oldPosition];
                    tokens.splice(e.oldPosition,1);
                    tokens.splice(e.newPosition,0,element);
                });
            });
        },

        update: function(element, valueAccessor, allBindingsAccessor, deprecated, bindingContext) {
            var $element=$(element), options= $element.data('tokenfield_ko_options'),
                value = ko.utils.unwrapObservable(valueAccessor()) || [], display = options.display;

             console.log('update');

            updater($element.data('tokenfield_ko_state'),function(){

                $element.tokenfield('setTokens', $.map(value.tokens(),function(el){
                    return {value:el, label:ko.utils.unwrapObservable(el[display])};
                }) );
            });
        }
    };
    
}));

@@ -2511,32 +2511,34 @@
 %0A               
+//
  e.attrs.value =
@@ -2564,24 +2564,27 @@
             
+ //
  var created
@@ -2611,32 +2611,35 @@
 %0A               
+ //
      return toke
@@ -2683,32 +2683,35 @@
 %0A               
+ //
          $.each(
@@ -2775,32 +2775,35 @@
 %0A               
+ //
              if 
@@ -2834,32 +2834,35 @@
 %0A               
+ //
                 
@@ -2887,32 +2887,35 @@
 %0A               
+ //
                 
@@ -2924,32 +2924,35 @@
 %0A               
+ //
                 
@@ -2965,32 +2965,35 @@
 %0A               
+ //
                 
@@ -3023,32 +3023,35 @@
 %0A               
+ //
                 
@@ -3092,32 +3092,35 @@
 %0A               
+ //
                 
@@ -3130,32 +3130,34 @@
                 
+//
             %7D%0A  
@@ -3144,32 +3144,33 @@
   //            
+ 
 %7D%0A              
@@ -3162,32 +3162,35 @@
 %0A               
+ //
          %7D);%0A   
@@ -3193,32 +3193,35 @@
 %0A               
+ //
      %7D);%0A       
@@ -3224,24 +3224,27 @@
             
+ //
      %7D)(coun
@@ -3268,24 +3268,27 @@
             
+ //
  if (created
@@ -3312,20 +3312,23 @@
         
+//
     
+ 
 e.preven
@@ -3350,24 +3350,27 @@
             
+ //
  else if (ty
@@ -3411,24 +3411,27 @@
             
+ //
       e.attr
@@ -3456,32 +3456,35 @@
 %0A               
+ //
  %7D%0A            %7D
@@ -3577,32 +3577,33 @@
 ate,function()%7B%0A
+%0A
                 
@@ -3629,24 +3629,25 @@
 ttrs.value;%0A
+%0A
             
@@ -3658,21 +3658,29 @@
     if (
-value
+state.editing
 )%7B%0A     
@@ -3709,13 +3709,37 @@
 ens.
-push(
+splice(state.editing.index,1,
 valu
@@ -3766,27 +3766,119 @@
         
-console.log
+state.editing=null;%0A                    %7D%0A                    else%7B%0A                        tokens.push
 (value);
@@ -4054,32 +4054,116 @@
  function (e) %7B%0A
+                state.editing=%7B attrs: e.attrs, index: $(e.relatedTarget).index()%7D;%0A
             %7D)%0A 

Handle transformation on edit