@formkit/pro 0.118.1-059b2c6 → 0.118.1-1824dd2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@formkit/pro",
3
- "version": "0.118.1-059b2c6",
3
+ "version": "0.118.1-1824dd2",
4
4
  "description": "FormKit Pro — Form inputs and tools for high quality forms.",
5
5
  "main": "index.cjs",
6
6
  "module": "index.mjs",
@@ -45,7 +45,6 @@
45
45
  ],
46
46
  "dependencies": {
47
47
  "@formkit/core": "^1.4.0",
48
- "@formkit/drag-and-drop": "^0.0.5",
49
48
  "@formkit/inputs": "^1.4.0"
50
49
  },
51
50
  "type": "module"
package/taglist/index.mjs CHANGED
@@ -1 +1 @@
1
- import{$if as e,createSectionFactory as t,createBaseSections as a}from"../index.mjs";import{icon as i}from"@formkit/inputs";const o=(e,t)=>()=>i(e,t),n=t("tl"),{outer:d,wrapper:l,inner:s,icon:r,label:$,prefix:p,suffix:c,help:u,messages:b,message:g}=a(n),x=n("input",(()=>({$el:"input",bind:"$attrs",attrs:{id:"$id",type:"text",onClick:"$handlers.click",onBlur:"$handlers.blur",onKeydown:"$handlers.keydown",onInput:"$handlers.input",onFocus:"$handlers.focus",value:"$inputText",tabindex:"0",placeholder:"$state.loading && $inputStd.length === 0 && $ui.isLoading.value || $placeholder || undefined",role:"combobox",autocomplete:"off",autocapitalize:"none",readonly:"$attrs.readonly || $isLoadingOption || undefined || $multiple && $max && $value && $value.length >= $max",disabled:"$disabled || $disabledInternally || undefined","aria-autocomplete":"list","aria-expanded":"$expanded","aria-controls":'$expanded && $id + "_listbox" || undefined',"aria-describedBy":"$describedBy","aria-activedescendant":"$expanded && $activeDescendant || undefined"}}))),h=n("listboxButton",(()=>({$el:"button",attrs:{style:"$visibilityStyles",id:'$id + "_listbox_button"',type:"button",onClick:"$handlers.toggleListbox",tabindex:"-1",disabled:"$disabled || undefined","aria-haspopup":"true","aria-expanded":"$expanded","aria-controls":'$expanded && $id + "_listbox" || undefined'}}))),v=n("tagWrapper",(()=>({$el:"span",for:["option","index","$selections"],attrs:{id:'$id + "_tag-wrapper_" + $index',key:"$option.value","data-value":"$option.value",tabindex:"-1",onClick:"$handlers.tagClick && $handlers.tagClick($option)",onFocus:"$handlers.tagFocus && $handlers.tagFocus($option)",onBlur:"$handlers.tagBlur && $handlers.tagBlur($option)",onKeydown:"$handlers.searchInputTagKeydown && $handlers.searchInputTagKeydown($option)","data-active-selection":"$activeSelectionValue === $option.value"}}))),m=n("tag",(()=>({$el:"div",attrs:{id:'$id + "_tag_" + $index',role:"button"}}))),y=n("removeSelection",(()=>({$el:"button",if:"$selections.length > 0",attrs:{id:'$id + "_remove_selection_" + $index',tabindex:"-1",type:"button",onClick:"$handlers.removeSelection && $handlers.removeSelection($option)",onTouchstart:"$handlers.removeSelection && $handlers.removeSelection($option)","aria-controls":"$id"}}))),f=n("tagLabel",(()=>({$el:"span"}))),_=n("tags",(()=>({$el:"div",attrs:{id:'$id + "_selections"',"aria-live":"polite"}}))),k=n("tagLoading","span"),S=function(t){const a=t("dropdownWrapper",(()=>({$el:"div",attrs:{id:'$id + "_dropdown_wrapper"',"data-is-wrapper":!0,style:"$dropdownWrapperStyles",onScroll:"$handlers.scroll"}}))),i=t("listbox",(()=>({$el:"ul",if:"$expanded || $setForceExpanded",attrs:{style:"$listboxStyles",id:'$id + "_listbox"',role:"listbox","aria-activedescendant":"$activeDescendant","aria-labelledby":'$id + "_label"'}}))),n=t("listitem",(()=>({$el:"li",for:["option","index","$options"],bind:"$option.attrs",attrs:{id:'$id + "_listitem_" + $index',"data-disabled":"$option.attrs.disabled","data-value":"$option.value",key:"$option.value",onClick:"$handlers.selectOption($option)",onBlur:"$handlers.blurListitem",role:"option","aria-selected":"$hidingValue === true && false || $fns.isSelected($option)","data-is-active":"$fns.isActive($option)",tabindex:"-1"}}))),d=t("loadMore",(()=>({$el:"li",if:"$state.loading || $state.hasNextPage",attrs:{id:'$id + "_load_more"',key:"loadMore",role:"option",onClick:"$handlers.selectOption($loadMoreOption)","aria-selected":"false","data-is-active":"$fns.isActive($loadMoreOption)",tabindex:"-1"}}))),l=t("loadMoreInner","span"),s=t("emptyMessage",(()=>({$el:"li",if:"$showEmptyMessage && $state.loading !== true",attrs:{id:'$id + "_empty_message"',key:"$emptyMessage",role:"presentation"}}))),r=t("emptyMessageInner","span"),$=t("option",(()=>({$el:"div",attrs:{"data-checked":"$fns.isSelected($option)"}})));return()=>a(i(s(r("$emptyMessage")),n(e("$fns.isSelected($option)",o("selected")),$("$option.label")),d(e("$state.loading && $optionLoadingCounter === 0 || $state.hasNextPage",l(e("$state.loading",o("loader")),"$state.loading && $ui.isLoading.value || $ui.loadMore.value")))))}(n);export{n as createSection,u as help,r as icon,s as inner,x as input,$ as label,S as listbox,h as listboxButton,g as message,b as messages,d as outer,p as prefix,y as removeSelection,c as suffix,m as tag,f as tagLabel,k as tagLoading,v as tagWrapper,_ as tags,l as wrapper};
1
+ import{$if as e,createSectionFactory as t,createBaseSections as a}from"../index.mjs";import{icon as i}from"@formkit/inputs";const o=(e,t)=>()=>i(e,t),n=t("tl"),{outer:d,wrapper:l,inner:s,icon:r,label:$,prefix:p,suffix:c,help:u,messages:b,message:h}=a(n),g=n("input",(()=>({$el:"input",bind:"$attrs",attrs:{id:"$id",type:"text",onClick:"$handlers.click",onBlur:"$handlers.blur",onKeydown:"$handlers.keydown",onInput:"$handlers.input",onFocus:"$handlers.focus",value:"$inputText",tabindex:"0",placeholder:"$state.loading && $inputStd.length === 0 && $ui.isLoading.value || $placeholder || undefined",role:"combobox",autocomplete:"off",autocapitalize:"none",readonly:"$attrs.readonly || $isLoadingOption || undefined || $multiple && $max && $value && $value.length >= $max",disabled:"$disabled || $disabledInternally || undefined",onTouchmove:"$handlers.touchmove",onTouchstart:"$handlers.touchmove",onTouchend:"$handlers.touchend","aria-autocomplete":"list","aria-expanded":"$expanded","aria-controls":'$expanded && $id + "_listbox" || undefined',"aria-describedBy":"$describedBy","aria-activedescendant":"$expanded && $activeDescendant || undefined"}}))),x=n("listboxButton",(()=>({$el:"button",attrs:{style:"$visibilityStyles",id:'$id + "_listbox_button"',type:"button",onClick:"$handlers.toggleListbox",tabindex:"-1",disabled:"$disabled || undefined","aria-haspopup":"true","aria-expanded":"$expanded","aria-controls":'$expanded && $id + "_listbox" || undefined'}}))),v=n("tagWrapper",(()=>({$el:"span",for:["option","index","$selections"],attrs:{id:'$id + "_tag-wrapper_" + $index',key:"$option.value","data-value":"$option.value",tabindex:"-1",onClick:"$handlers.tagClick && $handlers.tagClick($option)",onFocus:"$handlers.tagFocus && $handlers.tagFocus($option)",onBlur:"$handlers.tagBlur && $handlers.tagBlur($option)",onKeydown:"$handlers.searchInputTagKeydown && $handlers.searchInputTagKeydown($option)","data-active-selection":"$activeSelectionValue === $option.value"}}))),m=n("tag",(()=>({$el:"div",attrs:{id:'$id + "_tag_" + $index',role:"button"}}))),y=n("removeSelection",(()=>({$el:"button",if:"$selections.length > 0",attrs:{id:'$id + "_remove_selection_" + $index',tabindex:"-1",type:"button",onClick:"$handlers.removeSelection && $handlers.removeSelection($option)","aria-controls":"$id"}}))),f=n("tagLabel",(()=>({$el:"span"}))),_=n("tags",(()=>({$el:"div",attrs:{id:'$id + "_selections"',"aria-live":"polite"}}))),k=n("tagLoading","span"),w=function(t){const a=t("dropdownWrapper",(()=>({$el:"div",attrs:{id:'$id + "_dropdown_wrapper"',"data-is-wrapper":!0,style:"$dropdownWrapperStyles",onScroll:"$handlers.scroll"}}))),i=t("listbox",(()=>({$el:"ul",if:"$expanded || $setForceExpanded",attrs:{style:"$listboxStyles",id:'$id + "_listbox"',role:"listbox","aria-activedescendant":"$activeDescendant","aria-labelledby":'$id + "_label"'}}))),n=t("listitem",(()=>({$el:"li",for:["option","index","$options"],bind:"$option.attrs",attrs:{id:'$id + "_listitem_" + $index',"data-disabled":"$option.attrs.disabled","data-value":"$option.value",key:"$option.value",onClick:"$handlers.selectOption($option)",onBlur:"$handlers.blurListitem",role:"option","aria-selected":"$hidingValue === true && false || $fns.isSelected($option)","data-is-active":"$fns.isActive($option)",tabindex:"-1"}}))),d=t("loadMore",(()=>({$el:"li",if:"$state.loading || $state.hasNextPage",attrs:{id:'$id + "_load_more"',key:"loadMore",role:"option",onClick:"$handlers.selectOption($loadMoreOption)","aria-selected":"false","data-is-active":"$fns.isActive($loadMoreOption)",tabindex:"-1"}}))),l=t("loadMoreInner","span"),s=t("emptyMessage",(()=>({$el:"li",if:"$showEmptyMessage && $state.loading !== true",attrs:{id:'$id + "_empty_message"',key:"$emptyMessage",role:"presentation"}}))),r=t("emptyMessageInner","span"),$=t("option",(()=>({$el:"div",attrs:{"data-checked":"$fns.isSelected($option)"}})));return()=>a(i(s(r("$emptyMessage")),n(e("$fns.isSelected($option)",o("selected")),$("$option.label")),d(e("$state.loading && $isLoadingOptions || $state.hasNextPage",l(e("$state.loading",o("loader")),"$state.loading && $ui.isLoading.value || $ui.loadMore.value")))))}(n);export{n as createSection,u as help,r as icon,s as inner,g as input,$ as label,w as listbox,x as listboxButton,h as message,b as messages,d as outer,p as prefix,y as removeSelection,c as suffix,m as tag,f as tagLabel,k as tagLoading,v as tagWrapper,_ as tags,l as wrapper};
@@ -45,7 +45,7 @@ export const taglist: FormKitProInput = {
45
45
  tagWrapper(
46
46
  tag(
47
47
  $if(
48
- '$state.loading && $optionLoaderValues.includes($option.value)',
48
+ '$state.loading && $currentOptionsLoading.includes($option.value)',
49
49
  tagLoading('$ui.isLoading.value'),
50
50
  tagLabel('$option.label')
51
51
  ),
@@ -1 +1 @@
1
- import{createSectionFactory as e,createBaseSections as s}from"../index.mjs";const t=e("tf"),{outer:a,wrapper:r,inner:l,icon:o,prefix:i,suffix:n,help:d,messages:c,message:$}=s(t),u=t("fieldset",(()=>({$el:"fieldset",attrs:{id:'$id + "_fieldset"',role:"presentation","aria-describedby":{if:"$help",then:'$: "help-" + $id',else:void 0}}}))),h=t("legend",(()=>({if:"$label",$el:"legend"}))),p=t("area",(()=>({$el:"div",attrs:{id:'$id + "_area"'}}))),f=t("source",(()=>({$el:"div",attrs:{id:'$id + "_source"',class:'$classes.transferlist + " " + $classes.source'}}))),_=t("sourceHeader",(()=>({$el:"div",attrs:{id:'$id + "_source_header"',role:"presentation",class:'$classes.transferlistHeader + " " + $classes.sourceHeader'}}))),m=t("sourceHeaderLabel",(()=>({if:"$sourceLabel",$el:"label",attrs:{id:'$id + "_source_header_label"',for:'$id + "_source_search_input"',class:'$classes.transferlistHeaderLabel + " " + $classes.sourceHeaderLabel'},children:"$sourceLabel || $label"}))),g=t("sourceHeaderItemCount",(()=>({$el:"span",attrs:{id:'$id + "_source_header_item_count"',role:"presentation","aria-label":'$sourceOptions.length " items"',class:'$classes.transferlistHeaderItemCount + " " + $classes.sourceHeaderItemCount'}}))),b=t("targetHeaderLabel",(()=>({if:"$targetLabel",$el:"label",attrs:{id:'$id + "_target_header_label"',for:'$id + "_target_search_input"',class:'$classes.transferlistHeaderLabel + " " + $classes.targetHeaderLabel'},children:"$targetLabel || $label"}))),v=t("targetHeaderItemCount",(()=>({$el:"span",attrs:{id:'$id + "_target_header_item_count"',role:"presentation","aria-label":'$targetOptions.length + " items"',class:'$classes.transferlistHeaderItemCount + " " + $classes.targetHeaderItemCount'},children:"$targetOptions.length"}))),L=t("sourceControls",(()=>({$el:"div",if:"$searchable",attrs:{id:'$id + "_source_controls"',class:'$classes.transferlistControls + " " + $classes.sourceControls'}}))),S=t("sourceSearch",(()=>({if:"$searchable",$el:"div",attrs:{id:'$id + "_source_search"',class:'$classes.transferlistSearch + " " + $classes.sourceSearch'}}))),y=t("sourceSearchInput",(()=>({$el:"input",attrs:{id:'$id + "_source_search_input"',type:"text",placeholder:"$placeholder",onInput:"$handlers.onSearch",value:"$inputText",onKeydown:"$handlers.sourceSearchKeydown",disabled:"$disabled","aria-label":"Search",role:"searchbox",autocomplete:"off",class:'$classes.transferlistSearchInput + " " + $classes.sourceSearchInput',onFocus:"$handlers.sourceSearchFocus",onBlur:"$handlers.sourceSearchBlur"}}))),I=t("sourceSearchClear",(()=>({$el:"button",if:'$inputText !== ""',attrs:{id:'$id + "_source_search_clear"',type:"button",onClick:"$handlers.clearSearch","aria-label":"Clear search",class:'$classes.transferlistSearchClear + " " + $classes.sourceSearchClear'}}))),k=t("sourceListItems",(()=>({$el:"ul",attrs:{id:'$id + "_source_list_items"',"aria-activedescendant":"$activeDescendant",onMouseenter:"$handlers.onMouseenter(true)",onMouseout:"$handlers.onMouseleave(true)",role:"listbox","aria-multiselectable":"true","aria-roledescription":"List of options to choose from.",class:'$classes.transferlistListItems + " " + $classes.sourceListItems',onKeydown:"$handlers.sourceListKeydown",tabindex:"$searchable || $sourceOptions.length === 0 && -1 || 0",onFocus:"$handlers.sourceListFocused",onBlur:"$handlers.sourceListBlurred"}}))),w=t("sourceListItem",(()=>({for:["option","index","$sourceOptions"],$el:"li",attrs:{id:'$id + "_source_list_item_" + $index',"data-value":"$option.value","aria-selected":"$transferOnSelect === false && $fns.isSelected($option, $selectedSourceItems)","data-is-active":"$fns.isActive($option, $activeValue)","data-disabled":"$option.attrs.disabled",role:"option",onClick:"$handlers.listitemClick($option, true)",onTouchstart:"$handlers.listitemTouchstart($option, true)",onTouchmove:"$handlers.listitemTouchmove($option, true)",onTouchend:"$handlers.listitemTouchend($option, true)",key:"$option.value",class:'$classes.transferlistListItem + " " + $classes.sourceListItem'}}))),M=t("sourceOption",(()=>({$el:"div",attrs:{"data-checked":"$fns.isSelected($option, $selectedSourceItems)",class:'$classes.transferlistOption + " " + $classes.sourceOption'}}))),C=t("sourceLoadMore",(()=>({$el:"li",if:"$state.loading || $state.hasNextPage",attrs:{id:'$id + "_source_load_more"',key:"loadMore",onClick:"$handlers.listitemClick($loadMoreOption)","aria-selected":"false","data-is-active":"$fns.isActive($loadMoreOption)",tabindex:"-1"}}))),B=t("loadMoreInner","span"),O=t("target",(()=>({$el:"div",attrs:{id:'$id + "_target"',class:'$classes.transferlist + " " + $classes.target'}}))),x=t("targetHeader",(()=>({$el:"div",attrs:{id:'$id + "_target_header"',role:"presentation",class:'$classes.transferlistHeader + " " + $classes.targetHeader'}}))),H=t("targetListItems",(()=>({$el:"ul",attrs:{id:"$id","aria-activedescendant":"$activeDescendant",onMouseenter:"$handlers.onMouseenter(false)",onMouseout:"$handlers.onMouseleave(false)",class:'$classes.transferlistListItems + " " + $classes.targetListItems',tabindex:"$targetOptions.length === 0 && -1 || 0",onKeydown:"$handlers.targetListKeydown",onFocus:"$handlers.targetListFocused",onBlur:"$handlers.targetListBlurred"}}))),T=t("targetListItem",(()=>({for:["option","index","$targetOptions"],$el:"li",attrs:{id:'$id + "_target_list_item_" + $index',"data-disabled":"$option.attrs.disabled","data-value":"$option.value","aria-selected":"$transferOnSelect === false && $fns.isSelected($option, $selectedTargetItems)","data-is-active":"$fns.isActive($option, $activeValue)",role:"option",onClick:"$handlers.listitemClick($option, false)",onTouchstart:"$handlers.listitemTouchstart($option, false)",onTouchmove:"$handlers.listitemTouchmove($option, false)",onTouchend:"$handlers.listitemTouchend($option, false)",key:"$option.value",class:'$classes.transferlistListItem + " " + $classes.targetListItem'}}))),F=t("targetOption",(()=>({$el:"div",attrs:{id:'$id + "_target_list_item_" + $index + "_option"',"data-checked":"$fns.isSelected($option, $selectedTargetItems)",class:'$classes.transferlistOption + " " + $classes.targetOption'}}))),A=t("targetLoadMore",(()=>({$el:"li",if:"$targetLoading && $state.loading",attrs:{id:'$id + "_target_load_more"',key:"loadMore","aria-selected":"false",class:'$classes.transferlistLoadMore + " " + $classes.targetLoadMore'}}))),V=t("transferControls",(()=>({$el:"div",attrs:{id:'$id + "_transfer_controls"'}}))),E=t("transferButtonForward",(()=>({if:"$transferOnSelect !== true",$el:"button",attrs:{id:'$id + "_transfer_button_forward"',type:"button",disabled:"$selectedSourceItems.length === 0 || $disabled || ($max && $value && $value.length >= $max)",onClick:"$handlers.transferForward","aria-label":"$ui.addSelectedValues.value",title:"$ui.addSelectedValues.value",class:'$classes.transferlistButton + " " + $classes.transferButtonForward'}}))),K=t("transferButtonForwardAll",(()=>({$el:"button",attrs:{id:'$id + "_transfer_button_forward_all"',type:"button",disabled:"$sourceOptions.length === 0 || $disabled || ($max && $value && $value.length >= $max)",onClick:"$handlers.transferForwardAll","aria-label":"$ui.addAllValues.value",title:"$ui.addAllValues.value",onFocus:"$handlers.transferForwardAllFocused",class:'$classes.transferlistButton + " " + $classes.transferButtonForwardAll'}}))),D=t("transferButtonBackward",(()=>({if:"$transferOnSelect !== true",$el:"button",attrs:{id:'$id + "_transfer_button_backward"',onClick:"$handlers.transferBackward",type:"button",disabled:"$selectedTargetItems.length === 0 || $targetOptions.length === 0 || $disabled","aria-label":"$ui.removeSelectedValues.value",title:"$ui.removeSelectedValues.value",class:'$classes.transferlistButton + " " + $classes.transferButtonBackward'}}))),N=t("transferButtonBackwardAll",(()=>({$el:"button",attrs:{id:'$id + "_transfer_button_backward_all"',onClick:"$handlers.transferBackwardAll",type:"button",disabled:"$targetOptions.length === 0 || $disabled","aria-label":"$ui.removeAllValues.value",title:"$ui.removeAllValues.value",class:'$classes.transferlistButton + " " + $classes.transferButtonBackwardAll'}}))),P=t("controlLabel","span"),j=t("sourceEmptyMessage",(()=>({$el:"li",if:"$showSourceEmptyMessage && $sourceEmptyMessage && $state.loading !== true",attrs:{id:'$id + "_source_empty_message"',key:"$sourceEmptyMessage",role:"presentation"}}))),q=t("targetEmptyMessage",(()=>({$el:"li",if:"$showTargetEmptyMessage && $targetEmptyMessage",attrs:{id:'$id + "_empty_message"',key:"$emptyMessage",role:"presentation"}}))),z=t("emptyMessageInner","span");export{p as area,P as controlLabel,t as createSection,z as emptyMessageInner,u as fieldset,d as help,o as icon,l as inner,h as legend,B as loadMoreInner,$ as message,c as messages,a as outer,i as prefix,f as source,L as sourceControls,j as sourceEmptyMessage,_ as sourceHeader,g as sourceHeaderItemCount,m as sourceHeaderLabel,w as sourceListItem,k as sourceListItems,C as sourceLoadMore,M as sourceOption,S as sourceSearch,I as sourceSearchClear,y as sourceSearchInput,n as suffix,O as target,q as targetEmptyMessage,x as targetHeader,v as targetHeaderItemCount,b as targetHeaderLabel,T as targetListItem,H as targetListItems,A as targetLoadMore,F as targetOption,D as transferButtonBackward,N as transferButtonBackwardAll,E as transferButtonForward,K as transferButtonForwardAll,V as transferControls,r as wrapper};
1
+ import{createSectionFactory as e,createBaseSections as s}from"../index.mjs";const t=e("tf"),{outer:a,wrapper:r,inner:l,icon:o,prefix:i,suffix:n,help:d,messages:c,message:$}=s(t),u=t("fieldset",(()=>({$el:"fieldset",attrs:{id:'$id + "_fieldset"',role:"presentation","aria-describedby":{if:"$help",then:'$: "help-" + $id',else:void 0}}}))),f=t("legend",(()=>({if:"$label",$el:"legend"}))),p=t("area",(()=>({$el:"div",attrs:{id:'$id + "_area"'}}))),_=t("source",(()=>({$el:"div",attrs:{id:'$id + "_source"',class:'$classes.transferlist + " " + $classes.source'}}))),g=t("sourceHeader",(()=>({$el:"div",attrs:{id:'$id + "_source_header"',role:"presentation",class:'$classes.transferlistHeader + " " + $classes.sourceHeader'}}))),h=t("sourceHeaderLabel",(()=>({if:"$sourceLabel",$el:"label",attrs:{id:'$id + "_source_header_label"',for:'$id + "_source_search_input"',class:'$classes.transferlistHeaderLabel + " " + $classes.sourceHeaderLabel'},children:"$sourceLabel || $label"}))),b=t("sourceHeaderItemCount",(()=>({$el:"span",attrs:{id:'$id + "_source_header_item_count"',role:"presentation","aria-label":'$fns.getOptionCount() + " items"',class:'$classes.transferlistHeaderItemCount + " " + $classes.sourceHeaderItemCount'},children:"$fns.getOptionCount()"}))),m=t("targetHeaderLabel",(()=>({if:"$targetLabel",$el:"label",attrs:{id:'$id + "_target_header_label"',for:'$id + "_target_search_input"',class:'$classes.transferlistHeaderLabel + " " + $classes.targetHeaderLabel'},children:"$targetLabel || $label"}))),v=t("targetHeaderItemCount",(()=>({$el:"span",attrs:{id:'$id + "_target_header_item_count"',role:"presentation","aria-label":'$fns.getOptionCount(true) + " items"',class:'$classes.transferlistHeaderItemCount + " " + $classes.targetHeaderItemCount'},children:"$fns.getOptionCount(true)"}))),L=t("sourceControls",(()=>({$el:"div",if:"$searchable",attrs:{id:'$id + "_source_controls"',class:'$classes.transferlistControls + " " + $classes.sourceControls'}}))),y=t("sourceSearch",(()=>({if:"$searchable",$el:"div",attrs:{id:'$id + "_source_search"',class:'$classes.transferlistSearch + " " + $classes.sourceSearch'}}))),M=t("sourceSearchInput",(()=>({$el:"input",attrs:{id:'$id + "_source_search_input"',type:"text",placeholder:"$placeholder",onInput:"$handlers.onSearch",value:"$inputText",onKeydown:"$handlers.handleSourceSearchKeyDown",disabled:"$disabled","aria-label":"Search",role:"searchbox",class:'$classes.transferlistSearchInput + " " + $classes.sourceSearchInput'}}))),S=t("sourceSearchClear",(()=>({$el:"button",if:"$inputText !== undefined",attrs:{id:'$id + "_source_search_clear"',type:"button",onClick:"$handlers.clearSearch","aria-label":"Clear search",class:'$classes.transferlistSearchClear + " " + $classes.sourceSearchClear'}}))),w=t("sourceListItems",(()=>({$el:"ul",attrs:{id:'$id + "_source_list_items"',"aria-activedescendant":"$activeDescendant",onMouseover:"$handlers.onMouseEnter(true)",onMouseout:"$handlers.onMouseLeave(true)",role:"listbox","aria-multiselectable":"true","aria-roledescription":"List of options to choose from.",class:'$classes.transferlistListItems + " " + $classes.sourceListItems',onKeydown:"$handlers.sourceKeyDown",tabindex:"0",onFocus:"$handlers.sourceFocused"}}))),C=t("sourceListItem",(()=>({for:["option","index","$sourceOptions"],$el:"li",attrs:{id:'$id + "_source_list_item_" + $index',"data-value":"$option.value","aria-selected":"$selections && $selections.length > 0 && $fns.isSelected($option)","data-is-active":"$fns.isActive($option)","data-disabled":"$option.attrs.disabled",role:"option",onClick:"$option.attrs.disabled !== true && $handlers.selectOption($option, true)",key:"$option.value",class:'$classes.transferlistListItem + " " + $classes.sourceListItem'}}))),I=t("sourceOption",(()=>({$el:"div",attrs:{"data-checked":"$selections && $selections.length > 0 && $fns.isSelected($option)",class:'$classes.transferlistOption + " " + $classes.sourceOption'}}))),k=t("sourceLoadMore",(()=>({$el:"li",if:"$targetLoading !== true && $state.loading || $state.hasNextPage",attrs:{id:'$id + "_source_load_more"',key:"loadMore","aria-selected":"false",class:'$classes.transferlistLoadMore + " " + $classes.sourceLoadMore'}}))),x=t("loadMoreInner","span"),B=t("target",(()=>({$el:"div",attrs:{id:'$id + "_target"',class:'$classes.transferlist + " " + $classes.target'}}))),H=t("targetHeader",(()=>({$el:"div",attrs:{id:'$id + "_target_header"',role:"presentation",class:'$classes.transferlistHeader + " " + $classes.targetHeader'}}))),O=t("targetListItems",(()=>({$el:"ul",attrs:{id:"$id","aria-activedescendant":"$activeDescendant",onMouseover:"$handlers.onMouseEnter(false)",onMouseout:"$handlers.onMouseLeave(false)",class:'$classes.transferlistListItems + " " + $classes.targetListItems',tabindex:"0",onKeydown:"$handlers.targetKeyDown",onFocus:"$handlers.targetFocused"}}))),A=t("targetListItem",(()=>({for:["option","index","$targetOptions"],$el:"li",attrs:{id:'$id + "_target_list_item_" + $index',"data-disabled":"$option.attrs.disabled","data-value":"$option.value","aria-selected":"$selections && $selections.length && $fns.isSelected($option, $target)","data-is-active":"$fns.isActive($option)",role:"option",onClick:"$option.attrs.disabled !== true && $handlers.selectOption($option, false)",key:"$option.value",class:'$classes.transferlistListItem + " " + $classes.targetListItem'}}))),F=t("targetOption",(()=>({$el:"div",attrs:{id:'$id + "_target_list_item_" + $index',class:'$classes.transferlistOption + " " + $classes.targetOption'}}))),E=t("targetLoadMore",(()=>({$el:"li",if:"$targetLoading && $state.loading",attrs:{id:'$id + "_target_load_more"',key:"loadMore","aria-selected":"false",class:'$classes.transferlistLoadMore + " " + $classes.targetLoadMore'}}))),V=t("transferControls",(()=>({$el:"div",attrs:{id:'$id + "_transfer_controls"'}}))),K=t("transferButtonForward",(()=>({if:"$transferOnSelect !== true",$el:"button",attrs:{id:'$id + "_transfer_button_forward"',type:"button",disabled:"$selections.length === 0 || $sourceSelected === false || $disabled || ($max && $value && $value.length >= $max)",onClick:"$handlers.transferForward","aria-label":"$ui.addSelectedValues.value",title:"$ui.addSelectedValues.value",class:'$classes.transferlistButton + " " + $classes.transferButtonForward'}}))),D=t("transferButtonForwardAll",(()=>({$el:"button",attrs:{id:'$id + "_transfer_button_forward_all"',type:"button",disabled:"$options.length === $targetOptions.length || $disabled || ($max && $value && $value.length >= $max)",onClick:"$handlers.transferForwardAll","aria-label":"$ui.addAllValues.value",title:"$ui.addAllValues.value",class:'$classes.transferlistButton + " " + $classes.transferButtonForwardAll'}}))),T=t("transferButtonBackward",(()=>({if:"$transferOnSelect !== true",$el:"button",attrs:{id:'$id + "_transfer_button_backward"',onClick:"$handlers.transferBackward",type:"button",disabled:"$selections.length === 0 || $sourceSelected === true || $disabled","aria-label":"$ui.removeSelectedValues.value",title:"$ui.removeSelectedValues.value",class:'$classes.transferlistButton + " " + $classes.transferButtonBackward'}}))),N=t("transferButtonBackwardAll",(()=>({$el:"button",attrs:{id:'$id + "_transfer_button_backward_all"',onClick:"$handlers.transferBackwardAll",type:"button",disabled:"$targetOptions.length === 0 || $disabled","aria-label":"$ui.removeAllValues.value",title:"$ui.removeAllValues.value",class:'$classes.transferlistButton + " " + $classes.transferButtonBackwardAll'}}))),P=t("controlLabel","span"),j=t("sourceEmptyMessage",(()=>({$el:"li",if:"$showSourceEmptyMessage && $sourceEmptyMessage && $state.loading !== true",attrs:{id:'$id + "_source_empty_message"',key:"$sourceEmptyMessage",role:"presentation"}}))),q=t("targetEmptyMessage",(()=>({$el:"li",if:"$showTargetEmptyMessage && $targetEmptyMessage",attrs:{id:'$id + "_empty_message"',key:"$emptyMessage",role:"presentation"}}))),z=t("emptyMessageInner","span");export{p as area,P as controlLabel,t as createSection,z as emptyMessageInner,u as fieldset,d as help,o as icon,l as inner,f as legend,x as loadMoreInner,$ as message,c as messages,a as outer,i as prefix,_ as source,L as sourceControls,j as sourceEmptyMessage,g as sourceHeader,b as sourceHeaderItemCount,h as sourceHeaderLabel,C as sourceListItem,w as sourceListItems,k as sourceLoadMore,I as sourceOption,y as sourceSearch,S as sourceSearchClear,M as sourceSearchInput,n as suffix,B as target,q as targetEmptyMessage,H as targetHeader,v as targetHeaderItemCount,m as targetHeaderLabel,A as targetListItem,O as targetListItems,E as targetLoadMore,F as targetOption,T as transferButtonBackward,N as transferButtonBackwardAll,K as transferButtonForward,D as transferButtonForwardAll,V as transferControls,r as wrapper};
@@ -26,8 +26,9 @@ import {
26
26
  sourceListItems,
27
27
  sourceListItem,
28
28
  sourceOption,
29
- loadMoreInner,
30
29
  sourceLoadMore,
30
+ targetLoadMore,
31
+ loadMoreInner,
31
32
  transferControls,
32
33
  transferButtonForward,
33
34
  transferButtonBackward,
@@ -38,7 +39,7 @@ import {
38
39
  targetEmptyMessage,
39
40
  emptyMessageInner,
40
41
  } from '../sections/transferListSections'
41
- import { default as transferListFeature } from '../features/transferlist/index'
42
+ import { default as transferListFeature } from '../features/transferlist'
42
43
  import { options, defaultIcon, localize } from '@formkit/inputs'
43
44
  import { $if } from '../compose'
44
45
 
@@ -56,16 +57,7 @@ export const transferlist: FormKitProInput = {
56
57
  help('$help'),
57
58
  wrapper(
58
59
  source(
59
- sourceHeader(
60
- sourceHeaderLabel(),
61
- sourceHeaderItemCount(
62
- $if(
63
- '$optionsLoadingCounter > 0',
64
- icon('loader'),
65
- '$fns.getSourceItemCount($selectedSourceItems)'
66
- )
67
- )
68
- ),
60
+ sourceHeader(sourceHeaderLabel(), sourceHeaderItemCount()),
69
61
  sourceControls(
70
62
  sourceSearch(sourceSearchInput(), sourceSearchClear(icon('close')))
71
63
  ),
@@ -73,18 +65,18 @@ export const transferlist: FormKitProInput = {
73
65
  sourceEmptyMessage(emptyMessageInner('$sourceEmptyMessage')),
74
66
  sourceListItem(
75
67
  $if(
76
- '$transferOnSelect !== true && $fns.isSelected($option, $selectedSourceItems)',
68
+ '$transferOnSelect !== true && $fns.isSelected($option)',
77
69
  icon('selected')
78
70
  ),
79
71
  sourceOption('$option.label')
80
72
  ),
81
73
  sourceLoadMore(
82
- $if(
83
- '$state.loading && $optionLoadingCounter === 0 || $state.hasNextPage',
84
- loadMoreInner(
85
- $if('$state.loading', icon('loader')),
86
- '$state.loading && $ui.isLoading.value || $ui.loadMore.value'
87
- )
74
+ loadMoreInner(
75
+ $if(
76
+ '$targetLoading !== true && $state.loading',
77
+ icon('loader')
78
+ ),
79
+ '$state.loading && $ui.isLoading.value || $ui.loadMore.value'
88
80
  )
89
81
  )
90
82
  )
@@ -108,12 +100,7 @@ export const transferlist: FormKitProInput = {
108
100
  )
109
101
  ),
110
102
  target(
111
- targetHeader(
112
- targetHeaderLabel(),
113
- targetHeaderItemCount(
114
- '$fns.getTargetItemCount($selectedTargetItems)'
115
- )
116
- ),
103
+ targetHeader(targetHeaderLabel(), targetHeaderItemCount()),
117
104
  targetListItems(
118
105
  targetEmptyMessage(
119
106
  $if(
@@ -123,15 +110,15 @@ export const transferlist: FormKitProInput = {
123
110
  ),
124
111
  targetListItem(
125
112
  $if(
126
- '$transferOnSelect !== true && $fns.isSelected($option, $selectedTargetItems)',
113
+ '$transferOnSelect !== true && $fns.isSelected($option)',
127
114
  icon('selected')
128
115
  ),
129
- targetOption(
130
- $if(
131
- '$fns.optionLoading($option, $optionLoaderValues)',
132
- '$ui.isLoading.value',
133
- '$option.label'
134
- )
116
+ targetOption('$option.label')
117
+ ),
118
+ targetLoadMore(
119
+ loadMoreInner(
120
+ $if('$targetLoading && $state.loading', icon('loader')),
121
+ '$state.loading && $ui.isLoading.value || $ui.loadMore.value'
135
122
  )
136
123
  )
137
124
  )
@@ -149,12 +136,43 @@ export const transferlist: FormKitProInput = {
149
136
  /**
150
137
  * An array of extra props to accept for this input.
151
138
  */
152
- props: [],
139
+ props: [
140
+ 'options',
141
+ 'selections',
142
+ 'activeValue',
143
+ 'activeDescendant',
144
+ 'sourceSelected',
145
+ 'targetOptions',
146
+ 'sourceOptions',
147
+ 'optionLoader',
148
+ 'filterOptions',
149
+ 'inputText',
150
+ 'hasNextPage',
151
+ 'page',
152
+ 'targetOptionValues',
153
+ 'targetLoading',
154
+ 'searchable',
155
+ 'sourceLabel',
156
+ 'targetLabel',
157
+ 'transferOnSelect',
158
+ 'disabled',
159
+ 'placeholder',
160
+ 'filter',
161
+ 'showSourceEmptyMessage',
162
+ 'showTargetEmptyMessage',
163
+ 'sourceEmptyMessage',
164
+ 'targetEmptyMessage',
165
+ 'clearOnSelect',
166
+ 'max',
167
+ 'debounce',
168
+ ],
153
169
 
154
170
  /**
155
171
  * Additional features that make this input work.
156
172
  */
157
173
  features: [
174
+ transferListFeature,
175
+ options,
158
176
  defaultIcon('moveRight', 'right'),
159
177
  defaultIcon('moveLeft', 'left'),
160
178
  defaultIcon('fastForward', 'fastForward'),
@@ -168,7 +186,5 @@ export const transferlist: FormKitProInput = {
168
186
  localize('addSelectedValues'),
169
187
  localize('removeSelectedValues'),
170
188
  localize('removeAllValues'),
171
- options,
172
- transferListFeature,
173
189
  ],
174
190
  }