@simai-studio/ui 5.20261022.1938 → 5.20261023.16

package/distr/smart/dropdown/js/dropdown.min.js

@@ -1,6 +1,6 @@
-(()=>{"use strict";var e={"3a03d4610486"(e,t,s){s.d(t,{Q:()=>o});let i=0;function n(e,t){if(!e.id){let s;do{s=`${t}-${++i}`}while(document.getElementById(s));e.id=s}return e.id}function o(e,t){let s=null,i=null,o=null,r=!1;const a=new WeakMap,l=(e,t,s)=>{const i=a.get(e)||{};void 0!==i[t]&&e.getAttribute(t)===i[t]&&e.removeAttribute(t),delete i[t],!e.hasAttribute(t)&&s&&(e.setAttribute(t,s),i[t]=s),a.set(e,i)},c=()=>e.querySelector(".sf-dropdown-field, .sf-dropdown-trigger"),d=()=>c()?.querySelector(":scope > button")||c(),u=()=>c()?.querySelector('input:not([type="hidden"])'),p=()=>t.getList()?.querySelector(".sf-input input"),h=()=>[...t.getList()?.querySelectorAll(".sf-list-item")||[]],f=()=>h().filter(e=>!e.hidden&&!e.classList.contains("disabled")&&"true"!==e.getAttribute("aria-disabled")&&"true"!==e.getAttribute("aria-hidden")),g=e=>e.querySelector(".sf-list-item-container, .sf-avatar-label-group-title, .sf-tag-container")?.textContent?.trim()||e.dataset.value||"",b=e=>{e&&!e.disabled&&(e.focus({preventScroll:!0}),e.scrollIntoView({block:"nearest",inline:"nearest"}))},m=()=>{i="trigger",b(d()),t.close(),x()},v=e=>{if(t.isDisabled()||e.altKey||e.ctrlKey||e.metaKey)return;const s=e.target,n=s.closest?.(".sf-list-item"),o=t.getList()?.contains(s),r=s===d()||s===u()||s===c();let a=!1;if("Escape"===e.key&&t.isOpen())m(),a=!0;else{if("Tab"===e.key&&t.isOpen())return o&&b(d()),t.close(),void x();if(r&&["ArrowDown","ArrowUp","Enter"," "].includes(e.key))t.isOpen()&&["Enter"," "].includes(e.key)?m():(e=>{i=e,t.open(),x()})("ArrowUp"===e.key?"last":"search"),a=!0;else if(o&&["ArrowDown","ArrowUp"].includes(e.key)){const t=f(),s=t.indexOf(n),i=s<0?"ArrowUp"===e.key?t.length-1:0:Math.max(0,Math.min(t.length-1,s+("ArrowUp"===e.key?-1:1)));b(t[i]),a=!0}else if(n&&o&&["Home","End"].includes(e.key)){const t=f();b("Home"===e.key?t[0]:t.at(-1)),a=!0}else n&&o&&["Enter"," "].includes(e.key)&&(f().includes(n)&&(i=t.isMultiple()?{value:n.dataset.value}:"trigger",t.select(n),x()),a=!0)}a&&(e.preventDefault(),e.stopImmediatePropagation())},y=()=>{null!==o&&cancelAnimationFrame(o),o=requestAnimationFrame(()=>{var s;o=null,r||!t.isOpen()||i||(s=document.activeElement)&&(e.contains(s)||t.getList()?.contains(s))||(t.close(),x())})};let w=document.createElement("span");w.className="sf-dropdown-value",e.append(w),n(w,"sf-dropdown-value");const x=()=>{if(r)return;const o=t.getList();s!==o&&(s?.removeEventListener("keydown",v,!0),s?.removeEventListener("focusout",y),s=o,s?.addEventListener("keydown",v,!0),s?.addEventListener("focusout",y));const m=d(),x=s?.querySelector(".sf-list-container");if(!m||!x)return;w.isConnected||e.append(w);const S=e.querySelector(".sf-dropdown-label .sf-dropdown-text"),_=t.owner||e,$=S?.textContent.trim()?n(S,"sf-dropdown-label"):"",A=_.getAttribute("aria-label")||e.getAttribute("aria-label"),k=_.getAttribute("aria-labelledby")||e.getAttribute("aria-labelledby"),C=n(m,"sf-dropdown-trigger"),L=m.hasAttribute("aria-label")&&a.get(m)?.["aria-label"]!==m.getAttribute("aria-label");l(m,"aria-labelledby",k||(!A&&$?L?`${C} ${$}`:$:"")),l(m,"aria-label",A),"BUTTON"!==m.tagName&&m.setAttribute("role","button"),m.tabIndex=t.isDisabled()?-1:0,m.setAttribute("aria-expanded",String(t.isOpen())),m.setAttribute("aria-haspopup","listbox"),m.setAttribute("aria-controls",n(x,"sf-dropdown-listbox")),m.querySelectorAll(".sf-icon").forEach(e=>e.setAttribute("aria-hidden","true")),c()!==m&&(c().tabIndex=-1),u()&&(u().tabIndex=-1),x.setAttribute("role","listbox"),x.setAttribute("aria-multiselectable",String(t.isMultiple())),l(x,"aria-labelledby",k||$||C);const z=p();z&&(z.setAttribute("role","searchbox"),z.setAttribute("aria-controls",x.id),l(z,"aria-labelledby",z.hasAttribute("aria-label")?"":k||$||C)),h().forEach(e=>{e.setAttribute("role","option"),e.tabIndex=-1,e.setAttribute("aria-selected",String(e.classList.contains("selected"))),l(e,"aria-disabled",e.classList.contains("disabled")?"true":""),function(e,t){const s=e.querySelector('.sf-checkbox input[type="checkbox"]');if(!s)return;const i=e.querySelector(".sf-checkbox-box sf-icon, .sf-checkbox-box .sf-icon"),n="sf-icon"===i?.tagName?.toLowerCase()?i.getAttribute("icon")||"":i?.textContent;(s.checked!==t||s.indeterminate||i&&n!==(t?"check":""))&&(s.checked=t,s.indeterminate=!1,globalThis.SF?.Checkbox?.setState?.(s,{checked:t,indeterminate:!1}))}(e,e.classList.contains("selected")),e.querySelectorAll(".sf-checkbox").forEach(e=>{"true"!==e.getAttribute("aria-hidden")&&e.setAttribute("aria-hidden","true")}),e.querySelectorAll(".sf-icon, sf-icon").forEach(e=>{"true"!==e.getAttribute("aria-hidden")&&e.setAttribute("aria-hidden","true")}),e.querySelectorAll("input, button, a[href], [tabindex]").forEach(e=>{e.tabIndex=-1})});const T=t.selectedLabels?.()||h().filter(e=>e.classList.contains("selected")).map(g);w.textContent=T.join(", ")||u()?.value||u()?.placeholder||"";const E=new Set((m.getAttribute("aria-describedby")||"").split(/\s+/).filter(Boolean));E.add(w.id),m.setAttribute("aria-describedby",[...E].join(" ")),(()=>{if(!i)return;if("trigger"===i)return i=null,void b(d());if(!t.isOpen()||t.getList()?.hidden)return;const e=f(),s="search"===i?p()||e[0]||d():"last"===i?e.at(-1):"object"==typeof i?e.find(e=>e.dataset.value===i.value):e[0];i=null,b(s)})()};return e.addEventListener("keydown",v,!0),e.addEventListener("focusout",y),x(),{refresh:x,beforeClose:()=>{t.getList()?.contains(document.activeElement)&&(i="trigger")},release(){r=!0,null!==o&&cancelAnimationFrame(o),e.removeEventListener("keydown",v,!0),e.removeEventListener("focusout",y),s?.removeEventListener("keydown",v,!0),s?.removeEventListener("focusout",y);const t=d();if(t){const e=(t.getAttribute("aria-describedby")||"").split(/\s+/).filter(e=>e&&e!==w.id);e.length?t.setAttribute("aria-describedby",e.join(" ")):t.removeAttribute("aria-describedby")}w.remove()}}}},a0f23dca0b37(e,t,s){s.a(e,async(e,i)=>{try{s.d(t,{AL:()=>g,GD:()=>f});var n=s("5c1dc214bb5e"),o=e([n]);n=(o.then?(await o)():o)[0];var r=s.n(n);const a=()=>globalThis.SF?.Position||r(),l=new WeakMap,c=["position","inset","margin","width","max-width","max-height","overflow","left","top","right","bottom","z-index"],d=["font-family","font-size","font-weight","font-style","font-stretch","font-variant","font-feature-settings","font-variation-settings","font-optical-sizing","font-kerning","line-height","letter-spacing","word-spacing","text-transform","text-indent","white-space","word-break","overflow-wrap","text-rendering","direction","writing-mode","text-orientation","color","color-scheme","text-align"];function u(e,t){if(!t.context)return;const s=t.context,i=getComputedStyle(e),n=["sf-dropdown",...Array.from(e.classList).filter(e=>e.startsWith("sf-dropdown--")&&!["sf-dropdown--open","sf-dropdown--drop-up","sf-dropdown--drop-down"].includes(e))].join(" ");s.className!==n&&(s.className=n);const o=[...Array.from(i).filter(e=>e.startsWith("--sf-")),...d],r=new Set(o);for(const e of t.contextProperties||[])r.has(e)||s.style.removeProperty(e);for(const e of o){const t=i.getPropertyValue(e);s.style.getPropertyValue(e)!==t&&s.style.setProperty(e,t)}t.contextProperties=o}function p(e){return e?.querySelector(".sf-dropdown-field, .sf-dropdown-trigger")??null}function h(e,t){const s=l.get(t);if(!s||!e.isConnected||t.hidden)return!1;const i=p(e);return!!i&&(e.closest('[hidden], [inert], [aria-hidden="true"], dialog:not([open])')||!i.getClientRects().length||["hidden","collapse"].includes(getComputedStyle(i).visibility)?(s.onUnavailable?.(),!1):(u(e,s),s.wrap&&(s.wrap.style.minHeight="0",s.wrap.style.overflowY="auto"),s.anchor||(s.anchor=a().anchor(i,t,{side:"block-end",align:"start",matchWidth:i.classList.contains("sf-dropdown-field"),fitHeight:!0,autoUpdate:!1,onPosition:({side:s})=>{const i="block-start"===s;t.dataset.placement=e.dataset.placement=i?"top":"bottom",e.classList.toggle("sf-dropdown--drop-up",i),e.classList.toggle("sf-dropdown--drop-down",!i)}})),s.anchor.update(),!0))}function f(e,t,s){if(!t?.isConnected||!p(e))return!1;const i=t.contains(document.activeElement)?document.activeElement:null;if(!l.has(t)){const i=c.map(e=>[e,t.style.getPropertyValue(e),t.style.getPropertyPriority(e)]),n={root:e,saved:i,onUnavailable:s,popover:t.getAttribute("popover"),frame:0,native:"function"==typeof t.showPopover};if(n.wrap=t.querySelector(".sf-list-container-wrap"),n.wrapStyles=n.wrap?["min-height","overflow-y"].map(e=>[e,n.wrap.style.getPropertyValue(e),n.wrap.style.getPropertyPriority(e)]):[],n.schedule=()=>{n.frame||(n.frame=requestAnimationFrame(()=>{n.frame=0,h(e,t)}))},l.set(t,n),e.__sfDropdownPortalList=t,n.native)t.setAttribute("popover","manual");else{n.parent=t.parentNode,n.next=t.nextSibling,n.context=document.createElement("div"),n.context.style.cssText="display:contents;position:static",u(e,n);(e.closest('dialog[open], [role="dialog"][aria-modal="true"]')||document.body).append(n.context),n.context.append(t),t.style.zIndex="var(--sf-z-index-9)"}n.inheritance=new MutationObserver(n.schedule);for(let t=e;t;t=t.parentElement)n.inheritance.observe(t,{attributes:!0,attributeFilter:["class","style","dir","hidden","inert","aria-hidden","open"]});Object.assign(t.style,{position:"fixed",inset:"auto",margin:"0",overflow:n.wrap?"hidden":"auto"}),"function"==typeof ResizeObserver&&(n.resize=new ResizeObserver(n.schedule),n.resize.observe(p(e)),n.resize.observe(t)),window.visualViewport?.addEventListener("resize",n.schedule),window.visualViewport?.addEventListener("scroll",n.schedule)}return t.hidden=!1,l.get(t).native&&!t.matches(":popover-open")&&t.showPopover(),!!h(e,t)&&(i&&document.activeElement!==i&&i.focus({preventScroll:!0}),!0)}function g(e){const t=l.get(e);if(!t)return!1;const s=e.contains(document.activeElement)?document.activeElement:null;t.anchor?.stop(),t.resize?.disconnect(),cancelAnimationFrame(t.frame),t.inheritance?.disconnect(),window.visualViewport?.removeEventListener("resize",t.schedule),window.visualViewport?.removeEventListener("scroll",t.schedule),t.native?(e.matches(":popover-open")&&e.hidePopover(),null===t.popover?e.removeAttribute("popover"):e.setAttribute("popover",t.popover)):(t.next?.parentNode===t.parent?t.parent.insertBefore(e,t.next):t.parent.append(e),t.context.remove());for(const[s,i,n]of t.saved)i?e.style.setProperty(s,i,n):e.style.removeProperty(s);for(const[e,s,i]of t.wrapStyles)s?t.wrap.style.setProperty(e,s,i):t.wrap.style.removeProperty(e);return delete e.dataset.placement,delete t.root.dataset.placement,t.root.classList.remove("sf-dropdown--drop-up","sf-dropdown--drop-down"),t.root.__sfDropdownPortalList===e&&delete t.root.__sfDropdownPortalList,l.delete(e),s&&!e.hidden&&t.root.isConnected&&document.activeElement!==s&&s.focus({preventScroll:!0}),!0}i()}catch(b){i(b)}})},"98e26702f55a"(e,t,s){function i(){const e=globalThis.SF=globalThis.SF||{};return e.__deprecationNotes instanceof Map||Object.defineProperty(e,"__deprecationNotes",{value:new Map,configurable:!0}),e.__deprecationNotes}function n({component:e="",kind:t="attribute",attribute:s="",from:n,to:o=null}={}){if(!n)return;const r=[e,t,s,n].join("|"),a=i(),l=a.get(r);if(l)l.count+=1;else if(a.set(r,{component:e,kind:t,attribute:s,from:n,to:o,count:1}),function(){const e=globalThis.document?.documentElement;return"warn"===e?.dataset?.sfDeprecations||!0===globalThis.SF?.deprecations?.warn}()){const i=e?`${e}: `:"",r="value"===t?`${s}="${n}"`:`${t} ${n}`;globalThis.console?.warn?.(`[SIMAI Framework] ${i}${r} is a legacy name${o?`; write ${o}`:""}. See contracts/changes/journal.json.`)}}if(s.d(t,{id:()=>c,kA:()=>l}),"undefined"!=typeof globalThis){globalThis.SF=globalThis.SF||{};const e=globalThis.SF.deprecations||{};e.list=function(){return[...i().values()].map(e=>({...e}))},e.clear=function(){i().clear()},e.note=n,globalThis.SF.deprecations=e}const o=Object.freeze(["1/2","1","2"]),r=Object.freeze({"1/3":"1/2",3:"2"}),a=new Set;function l(e){const t=String(e??"").trim().toLowerCase();return o.includes(t)?t:Object.hasOwn(r,t)?r[t]:"1"}function c(e,t="field",s="1"){const i=String(e??"").trim().toLowerCase();if(o.includes(i))return i;if(Object.hasOwn(r,i)){const e=r[i];n({component:t,kind:"value",attribute:"size",from:i,to:e});const s=`${t}:${i}`;return a.has(s)||"undefined"==typeof console||(a.add(s),console.warn(`[SIMAI Framework] ${t}: size ${i} is retired for form fields; rendering size ${e}.`)),e}return s}},"67eed2647f47"(e,t,s){s.d(t,{z:()=>o});const i=new WeakMap,n=new WeakSet;function o(e,t){const s=e.ownerDocument;n.has(s)||(s.addEventListener("reset",e=>{const t=e.target;if("FORM"!==t?.tagName)return;const s=Array.from(t.elements);setTimeout(()=>{if(!e.defaultPrevented)for(const e of s)if(e.isConnected&&e.form===t)for(const t of i.get(e)||[])t()},0)},!0),n.add(s));let o=i.get(e);return o||i.set(e,o=new Set),o.add(t),()=>o.delete(t)}},"421676f72963"(e,t,s){s.d(t,{Ec:()=>a});const i="sfPopoverOpen",n=new WeakSet,o=Symbol.for("sf.openSurfaceLayers");function r(){const e=globalThis;return Array.isArray(e[o])||(e[o]=[]),e[o]}function a(e,t){if(!e)return;const s=Boolean(t);if(s===n.has(e))return;const o=r();if(s)n.add(e),o.push(e);else{n.delete(e);const t=o.lastIndexOf(e);t>=0&&o.splice(t,1)}!function(e){const t=globalThis.document?.documentElement;if(!t)return;const s=Math.max(0,Number(t.dataset[i]||0)+e);s?t.dataset[i]=String(s):delete t.dataset[i]}(s?1:-1)}},"50a1017ded91"(e,t,s){s.a(e,async(e,t)=>{try{var i=s("fbe0570fcc69"),n=s("0d662e4d7d63"),o=s("98e26702f55a"),r=s("5429d6e80991"),a=s("3a03d4610486"),l=s("67eed2647f47"),c=s("a0f23dca0b37"),d=s("421676f72963"),u=e([i,n,r,c]);[i,n,r,c]=u.then?(await u)():u;var p=s.n(i);const h={en:{search:"Search"},ru:{search:"Поиск"}};function f(e){return(0,o.id)(e,"sf-dropdown")}function g(e){const t=String(e||"").toLowerCase();return["text","icon","checkbox","avatar","color"].includes(t)?t:"text"}function b(e,t="1"){return e instanceof HTMLElement?"sf-list-item"!==e.tagName.toLowerCase()?null:{type:g(e.getAttribute("kind")||e.getAttribute("type")),size:f(e.getAttribute("size")||t),text:e.getAttribute("text")||"",icon:e.getAttribute("icon")||"person",checked:e.hasAttribute("checked")||(0,i.toBoolean)(e.getAttribute("checked")),selected:e.hasAttribute("selected")||(0,i.toBoolean)(e.getAttribute("selected")),disabled:e.hasAttribute("disabled")||(0,i.toBoolean)(e.getAttribute("disabled")),colorClass:e.getAttribute("color-class")||"bg-tertiary",avatarImageUrl:e.getAttribute("avatar-image-url")||"",avatarTitle:e.getAttribute("avatar-title")||e.getAttribute("text")||"",value:e.getAttribute("value")??e.getAttribute("text")??"",ariaLabel:e.getAttribute("aria-label")||"",group:e.getAttribute("group")||""}:null}function m(e,t="1"){if(!e||"object"!=typeof e)return null;const s=void 0===e.text||null===e.text?"":String(e.text),n=void 0===e.value||null===e.value?s:String(e.value);return""===s&&""===n?null:{type:g(e.kind||e.type),size:f(e.size||t),text:s,icon:e.icon?String(e.icon):"person",checked:(0,i.toBoolean)(e.checked),selected:(0,i.toBoolean)(e.selected),disabled:(0,i.toBoolean)(e.disabled),colorClass:e.colorClass?String(e.colorClass):"bg-tertiary",avatarImageUrl:e.avatarImageUrl?String(e.avatarImageUrl):"",avatarTitle:e.avatarTitle?String(e.avatarTitle):s,value:n,ariaLabel:e.ariaLabel?String(e.ariaLabel):"",group:e.group?String(e.group):""}}function v(e,t="1"){let s=e;if("string"==typeof s){const e=s.trim();if(""===e)return[];try{s=JSON.parse(e)}catch{return[]}}return Array.isArray(s)?s.map(e=>m("string"==typeof e||"number"==typeof e?{text:String(e),value:String(e)}:e,t)).filter(Boolean):[]}function y(e=""){return String(e||"").split(",").map(e=>e.trim()).filter(Boolean)}function w(e=[]){return e.map(e=>String(e)).join(",")}function x(e={}){return"avatar"===e.type?e.avatarTitle||e.text||e.value||"":e.text||e.avatarTitle||e.value||""}class S extends(p()){constructor(){super(),this._options=[],this._optionsCaptured=!1,this._optionsFromData=!1,this._open=!1,this._searchValue="",this._selectedValues=[],this._dropdownRoot=null,this._list=null,this._documentClickHandler=this.handleDocumentClick.bind(this),this._viewportHandler=this.positionPortalList.bind(this)}static get props(){return{templateName:{attribute:"template",default:"default"},size:{default:"1"},appearance:{default:"outlined",values:["filled","outlined"],aliases:["type"]},mode:{default:"select",values:["tag","select"]},multiple:{type:Boolean,default:!1},portal:{type:Boolean,default:!0},value:{default:""},name:{default:""},label:{default:""},required:{type:Boolean,default:!1},placeholder:{default:""},searchPlaceholder:{default:""},search:{type:Boolean,default:!0},layout:{default:"list",values:["list","grid"]},columns:{default:"6"},disabled:{type:Boolean,default:!1},ariaLabel:{default:""}}}connectedCallback(){this.captureOptions(),Object.prototype.hasOwnProperty.call(this,"_resetValues")||(this._resetValues=[...this.selectedValues]),super.connectedCallback()}attributeChangedCallback(e,t,s){t!==s&&("value"===e&&(this._selectedValues=y(s)),"disabled"===e&&this.disabled&&(this._open=!1,this._searchValue="")),super.attributeChangedCallback(e,t,s)}get componentName(){return"dropdown"}get templateName(){return this.getAttribute("template")||"default"}get size(){return f(this.getAttribute("size"))}get appearance(){return this.getProp("appearance")}get type(){return this.appearance}get mode(){return this.getEnumAttr("mode",["tag","select"],"select")}get multiple(){return this.hasAttribute("multiple")?this.getBooleanAttr("multiple",!0):"tag"===this.mode}get portal(){return this.getBooleanAttr("portal",!0)}get name(){return this.getAttribute("name")||""}get selectedValue(){return this.getAttribute("value")||""}get label(){return this.getAttribute("label")||""}get required(){return this.getBooleanAttr("required",!1)}get placeholder(){return this.getAttribute("placeholder")||""}get searchPlaceholder(){return this.getAttribute("search-placeholder")||(0,n.pageText)(h,"search",this)}get layout(){return this.getEnumAttr("layout",["list","grid"],"list")}get columns(){const e=Number.parseInt(this.getAttribute("columns")??"",10);return Number.isFinite(e)&&e>0?String(e):"6"}get search(){return this.getBooleanAttr("search",!0)}get disabled(){return this.getBooleanAttr("disabled",!1)}get ariaLabel(){return this.getAttribute("aria-label")||""}get selectedValues(){return this.hasAttribute("value")?y(this.selectedValue):this._selectedValues}get selectedOptions(){const e=this.options;return[...new Set(this.selectedValues)].map(t=>e.find(e=>String(e.value)===t)).filter(Boolean)}get triggerText(){if("tag"===this.mode)return"";return(this.multiple?this.selectedOptions:this.selectedOptions.slice(0,1)).map(x).join(", ")}get hiddenValue(){return this.selectedValues.join(",")}captureOptions(){if(this._optionsFromData)return;const e=Array.from(this.children).filter(e=>e instanceof HTMLElement&&"sf-list-item"===e.tagName.toLowerCase());e.length&&(this._options=e.map(e=>b(e,this.size)).filter(Boolean),this._optionsCaptured=!0,this.selectedValue||this._selectedValues.length||(this._selectedValues=this._options.filter(e=>e.selected).map(e=>String(e.value))),e.forEach(e=>e.remove()))}set options(e){const t=v(e,this.size);this._optionsFromData=!0,this._options=t,this._optionsCaptured=!0,this.selectedValue||this._selectedValues.length||(this._selectedValues=t.filter(e=>e.selected).map(e=>String(e.value))),this.requestComponentUpdate("options")}get options(){if(!Array.isArray(this._options)||!this._options.length)return[];const e=new Set(this.selectedValues);return this._options.map(t=>({...t,size:f(t.size||this.size),selected:e.has(String(t.value))}))}get visibleOptions(){const e=String(this._searchValue||"").trim().toLowerCase();return e?this.options.filter(t=>x(t).toLowerCase().includes(e)):this.options}templateContext(){const e=this.getPropsContext();return this.createTemplateContext({...e,component:this,open:this._open,multiple:this.multiple,value:this.hiddenValue,triggerText:this.triggerText,searchValue:this._searchValue,searchPlaceholder:this.searchPlaceholder,selectedValues:this.selectedValues,selectedOptions:this.selectedOptions,options:this.visibleOptions})}template(){return(0,r.g)(this.templateContext())}beforeRender(){this.captureOptions()}afterRender(){const e=this._dropdownRoot,t=this._list;this._dropdownRoot=this.querySelector(".sf-dropdown"),this._list=this.querySelector(".sf-list")||(e===this._dropdownRoot?t:null),t!==this._list&&(0,c.AL)(t),this.syncDocumentListeners(),this.syncPortalListeners(),this.syncOpenSurfaceMark(),this.positionPortalList(),e!==this._dropdownRoot&&(this._interaction?.release(),this._interaction=null),this._dropdownRoot&&!this._interaction&&(this._interaction=(0,a.Q)(this._dropdownRoot,{owner:this,getList:()=>this._list,isOpen:()=>this._open,isDisabled:()=>this.disabled,isMultiple:()=>this.multiple,open:()=>this.openDropdown(),close:()=>this.closeDropdown(),select:e=>this.selectValue(e.dataset.value||""),selectedLabels:()=>this.selectedOptions.map(x)})),this._interaction?.refresh();const s=this.querySelector(".sf-dropdown-hidden-input")||this.querySelector(".sf-dropdown-field > button");this._resetControl!==s&&(this._releaseReset?.(),this._resetControl=s,this._releaseReset=s?(0,l.z)(s,()=>{this._interaction?.beforeClose(),this._selectedValues=[...this._resetValues],this.setAttributeValue("value",w(this._selectedValues)),this._open=!1,this._searchValue="";const e=this.querySelector('.sf-dropdown-field input:not([type="hidden"])');e&&(e.value=this.triggerText),this.requestComponentUpdate("reset")}):null)}onDisconnected(){(0,d.Ec)(this,!1),(0,c.AL)(this._list),this._releaseReset?.(),this._releaseReset=null,this._resetControl=null,this._interaction?.release(),this._interaction=null,this.removeDocumentListeners(),this.removePortalListeners(),super.onDisconnected()}openDropdown(){return this.disabled||this._open||(this._open=!0,this.requestComponentUpdate("open")),this}closeDropdown(){return this._open?(this._interaction?.beforeClose(),this._open=!1,this._searchValue="",this.requestComponentUpdate("close"),this):this}toggleDropdown(){return this._open?this.closeDropdown():this.openDropdown()}handleTriggerClick(e){this.disabled||(e?.preventDefault?.(),this.toggleDropdown())}handleSearchInput(e){this._searchValue=e?.target?.value||"",this.requestComponentUpdate("search")}handleOptionClick(e){if(this.disabled)return;const t=e.target?.closest?.(".sf-list-item");t&&(this.contains(t)||this._list?.contains(t))&&!t.classList.contains("disabled")&&(e.preventDefault(),this.selectValue(t.dataset.value||""))}handleOptionKeydown(e){"Enter"!==e.key&&" "!==e.key||this.handleOptionClick(e)}handleDocumentClick(e){!this._open||this.contains(e.target)||this._list?.contains(e.target)||this.closeDropdown()}selectValue(e=""){if(this.disabled)return this;const t=this.options.find(t=>String(t.value)===String(e));if(!t||t.disabled)return this;const s=!this.multiple&&1===this.selectedValues.length&&this.selectedValues[0]===String(t.value);if(this.multiple){const e=new Set(this.selectedValues);e.has(String(t.value))?e.delete(String(t.value)):e.add(String(t.value)),this._selectedValues=Array.from(e)}else this._selectedValues=[String(t.value)];const i=[...this._selectedValues];return this.setAttributeValue("value",w(i)),s||this.dispatchDropdownChange(t,i),this.multiple||(this._interaction?.beforeClose(),this._open=!1,this._searchValue=""),this.requestComponentUpdate("select"),this}removeSelectedValue(e=""){if(this.disabled)return this;const t=new Set(this.selectedValues);t.delete(String(e)),this._selectedValues=Array.from(t);const s=[...this._selectedValues];return this.setAttributeValue("value",w(s)),this.dispatchDropdownChange(null,s),this.requestComponentUpdate("remove-tag"),this}dispatchDropdownChange(e=null,t=this.selectedValues){const s={value:e?.value||"",label:e?x(e):"",values:t,item:e,root:this,multiple:this.multiple};this.dispatchEvent(new CustomEvent("sf-dropdown:change",{bubbles:!0,composed:!0,detail:s})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:s}))}syncOpenSurfaceMark(){(0,d.Ec)(this,this._open)}syncDocumentListeners(){this._open?document.addEventListener("click",this._documentClickHandler):this.removeDocumentListeners()}removeDocumentListeners(){document.removeEventListener("click",this._documentClickHandler)}syncPortalListeners(){if(this._open&&this.portal)return window.addEventListener("resize",this._viewportHandler),void document.addEventListener("scroll",this._viewportHandler,!0);this.removePortalListeners()}removePortalListeners(){window.removeEventListener("resize",this._viewportHandler),document.removeEventListener("scroll",this._viewportHandler,!0)}positionPortalList(){this._list&&this._dropdownRoot&&this.portal&&this._open?(0,c.GD)(this._dropdownRoot,this._list,()=>this.closeDropdown()):(0,c.AL)(this._list)}get value(){return this.hiddenValue}set value(e){if(e&&"object"==typeof e&&!Array.isArray(e))return void this.setValueAttributes(e);const t=Array.isArray(e)?e.map(String):y(null==e?"":String(e));this.setAttributeValue("value",w(t))}}S.define("sf-dropdown"),t()}catch(_){t(_)}})},"5429d6e80991"(e,t,s){s.a(e,async(e,i)=>{try{s.d(t,{g:()=>h});var n=s("ddf1cdb42ecc"),o=s("c22590307c6c"),r=e([n,o]);[n,o]=r.then?(await r)():r;function a(e={}){return"avatar"===e.type?e.avatarTitle||e.text||e.value||"":e.text||e.avatarTitle||e.value||""}function l(e=[],t=!1){const s=[];let i=null;for(const n of e){const e=n.group?String(n.group):"";e!==i&&(i=e,e&&s.push((0,o.aU)(e,n.size)));const r=t&&(!n.type||"text"===n.type);s.push((0,o.lN)(r?{...n,type:"checkbox"}:n))}return s}const c=Object.freeze({"1/2":{size:"1/3",spacing:""},1:{size:"1",spacing:"compact"},2:{size:"2",spacing:"compact"}});function d(e){if(e.multiple||1!==e.selectedOptions?.length)return n.nothing;const t=e.selectedOptions[0];return"icon"===t.type&&t.icon?n.html`<i class="sf-icon sf-dropdown-field-visual" aria-hidden="true">${t.icon}</i>`:"color"===t.type&&t.colorClass?n.html`<span class="sf-tag-color-icon sf-dropdown-field-visual ${t.colorClass}" aria-hidden="true"></span>`:"avatar"===t.type&&t.avatarImageUrl?n.html`<span class="sf-avatar sf-avatar--size-1/2 bg-cover sf-dropdown-field-visual" aria-hidden="true" style=${`background-image: url(${t.avatarImageUrl});`}></span>`:n.nothing}function u(e,t){const s=a(t),i=c[e.size]||c[1],o=i.size,r=i.spacing?` spacing-${i.spacing}`:"",l="color"===t.type?"color":"avatar"===t.type?"avatar":"icon";return n.html`
+(()=>{"use strict";var e={"3a03d4610486"(e,t,i){i.d(t,{Q:()=>o});let s=0;function n(e,t){if(!e.id){let i;do{i=`${t}-${++s}`}while(document.getElementById(i));e.id=i}return e.id}function o(e,t){let i=null,s=null,o=null,a=!1;const r=new WeakMap,l=(e,t,i)=>{const s=r.get(e)||{};void 0!==s[t]&&e.getAttribute(t)===s[t]&&e.removeAttribute(t),delete s[t],!e.hasAttribute(t)&&i&&(e.setAttribute(t,i),s[t]=i),r.set(e,s)},c=()=>e.querySelector(".sf-dropdown-field, .sf-dropdown-trigger"),d=()=>c()?.querySelector(":scope > button")||c(),u=()=>c()?.querySelector('input:not([type="hidden"])'),p=()=>t.getList()?.querySelector(".sf-input input"),h=()=>[...t.getList()?.querySelectorAll(".sf-list-item")||[]],f=()=>h().filter(e=>!e.hidden&&!e.classList.contains("disabled")&&"true"!==e.getAttribute("aria-disabled")&&"true"!==e.getAttribute("aria-hidden")),g=e=>e.querySelector(".sf-list-item-container, .sf-avatar-label-group-title, .sf-tag-container")?.textContent?.trim()||e.dataset.value||"",b=e=>{e&&!e.disabled&&(e.focus({preventScroll:!0}),e.scrollIntoView({block:"nearest",inline:"nearest"}))},m=()=>{s="trigger",b(d()),t.close(),x()},v=e=>{if(t.isDisabled()||e.altKey||e.ctrlKey||e.metaKey)return;const i=e.target,n=i.closest?.(".sf-list-item"),o=t.getList()?.contains(i),a=i===d()||i===u()||i===c();let r=!1;if("Escape"===e.key&&t.isOpen())m(),r=!0;else{if("Tab"===e.key&&t.isOpen())return o&&b(d()),t.close(),void x();if(a&&["ArrowDown","ArrowUp","Enter"," "].includes(e.key))t.isOpen()&&["Enter"," "].includes(e.key)?m():(e=>{s=e,t.open(),x()})("ArrowUp"===e.key?"last":"search"),r=!0;else if(o&&["ArrowDown","ArrowUp"].includes(e.key)){const t=f(),i=t.indexOf(n),s=i<0?"ArrowUp"===e.key?t.length-1:0:Math.max(0,Math.min(t.length-1,i+("ArrowUp"===e.key?-1:1)));b(t[s]),r=!0}else if(n&&o&&["Home","End"].includes(e.key)){const t=f();b("Home"===e.key?t[0]:t.at(-1)),r=!0}else n&&o&&["Enter"," "].includes(e.key)&&(f().includes(n)&&(s=t.isMultiple()?{value:n.dataset.value}:"trigger",t.select(n),x()),r=!0)}r&&(e.preventDefault(),e.stopImmediatePropagation())},y=()=>{null!==o&&cancelAnimationFrame(o),o=requestAnimationFrame(()=>{var i;o=null,a||!t.isOpen()||s||(i=document.activeElement)&&(e.contains(i)||t.getList()?.contains(i))||(t.close(),x())})};let w=document.createElement("span");w.className="sf-dropdown-value",e.append(w),n(w,"sf-dropdown-value");const x=()=>{if(a)return;const o=t.getList();i!==o&&(i?.removeEventListener("keydown",v,!0),i?.removeEventListener("focusout",y),i=o,i?.addEventListener("keydown",v,!0),i?.addEventListener("focusout",y));const m=d(),x=i?.querySelector(".sf-list-container");if(!m||!x)return;w.isConnected||e.append(w);const $=e.querySelector(".sf-dropdown-label .sf-dropdown-text"),S=t.owner||e,_=$?.textContent.trim()?n($,"sf-dropdown-label"):"",A=S.getAttribute("aria-label")||e.getAttribute("aria-label"),k=S.getAttribute("aria-labelledby")||e.getAttribute("aria-labelledby"),C=n(m,"sf-dropdown-trigger"),L=m.hasAttribute("aria-label")&&r.get(m)?.["aria-label"]!==m.getAttribute("aria-label");l(m,"aria-labelledby",k||(!A&&_?L?`${C} ${_}`:_:"")),l(m,"aria-label",A),"BUTTON"!==m.tagName&&m.setAttribute("role","button"),m.tabIndex=t.isDisabled()?-1:0,m.setAttribute("aria-expanded",String(t.isOpen())),m.setAttribute("aria-haspopup","listbox"),m.setAttribute("aria-controls",n(x,"sf-dropdown-listbox")),m.querySelectorAll(".sf-icon").forEach(e=>e.setAttribute("aria-hidden","true")),c()!==m&&(c().tabIndex=-1),u()&&(u().tabIndex=-1),x.setAttribute("role","listbox"),x.setAttribute("aria-multiselectable",String(t.isMultiple())),l(x,"aria-labelledby",k||_||C);const z=p();z&&(z.setAttribute("role","searchbox"),z.setAttribute("aria-controls",x.id),l(z,"aria-labelledby",z.hasAttribute("aria-label")?"":k||_||C)),h().forEach(e=>{e.setAttribute("role","option"),e.tabIndex=-1,e.setAttribute("aria-selected",String(e.classList.contains("selected"))),l(e,"aria-disabled",e.classList.contains("disabled")?"true":""),function(e,t){const i=e.querySelector('.sf-checkbox input[type="checkbox"]');if(!i)return;const s=e.querySelector(".sf-checkbox-box sf-icon, .sf-checkbox-box .sf-icon"),n="sf-icon"===s?.tagName?.toLowerCase()?s.getAttribute("icon")||"":s?.textContent;(i.checked!==t||i.indeterminate||s&&n!==(t?"check":""))&&(i.checked=t,i.indeterminate=!1,globalThis.SF?.Checkbox?.setState?.(i,{checked:t,indeterminate:!1}))}(e,e.classList.contains("selected")),e.querySelectorAll(".sf-checkbox").forEach(e=>{"true"!==e.getAttribute("aria-hidden")&&e.setAttribute("aria-hidden","true")}),e.querySelectorAll(".sf-icon, sf-icon").forEach(e=>{"true"!==e.getAttribute("aria-hidden")&&e.setAttribute("aria-hidden","true")}),e.querySelectorAll("input, button, a[href], [tabindex]").forEach(e=>{e.tabIndex=-1})});const T=t.selectedLabels?.()||h().filter(e=>e.classList.contains("selected")).map(g);w.textContent=T.join(", ")||u()?.value||u()?.placeholder||"";const E=new Set((m.getAttribute("aria-describedby")||"").split(/\s+/).filter(Boolean));E.add(w.id),m.setAttribute("aria-describedby",[...E].join(" ")),(()=>{if(!s)return;if("trigger"===s)return s=null,void b(d());if(!t.isOpen()||t.getList()?.hidden)return;const e=f(),i="search"===s?p()||e[0]||d():"last"===s?e.at(-1):"object"==typeof s?e.find(e=>e.dataset.value===s.value):e[0];s=null,b(i)})()};return e.addEventListener("keydown",v,!0),e.addEventListener("focusout",y),x(),{refresh:x,beforeClose:()=>{t.getList()?.contains(document.activeElement)&&(s="trigger")},release(){a=!0,null!==o&&cancelAnimationFrame(o),e.removeEventListener("keydown",v,!0),e.removeEventListener("focusout",y),i?.removeEventListener("keydown",v,!0),i?.removeEventListener("focusout",y);const t=d();if(t){const e=(t.getAttribute("aria-describedby")||"").split(/\s+/).filter(e=>e&&e!==w.id);e.length?t.setAttribute("aria-describedby",e.join(" ")):t.removeAttribute("aria-describedby")}w.remove()}}}},a0f23dca0b37(e,t,i){i.a(e,async(e,s)=>{try{i.d(t,{AL:()=>g,GD:()=>f});var n=i("5c1dc214bb5e"),o=e([n]);n=(o.then?(await o)():o)[0];var a=i.n(n);const r=()=>globalThis.SF?.Position||a(),l=new WeakMap,c=["position","inset","margin","width","max-width","max-height","overflow","left","top","right","bottom","z-index"],d=["font-family","font-size","font-weight","font-style","font-stretch","font-variant","font-feature-settings","font-variation-settings","font-optical-sizing","font-kerning","line-height","letter-spacing","word-spacing","text-transform","text-indent","white-space","word-break","overflow-wrap","text-rendering","direction","writing-mode","text-orientation","color","color-scheme","text-align"];function u(e,t){if(!t.context)return;const i=t.context,s=getComputedStyle(e),n=["sf-dropdown",...Array.from(e.classList).filter(e=>e.startsWith("sf-dropdown--")&&!["sf-dropdown--open","sf-dropdown--drop-up","sf-dropdown--drop-down"].includes(e))].join(" ");i.className!==n&&(i.className=n);const o=[...Array.from(s).filter(e=>e.startsWith("--sf-")),...d],a=new Set(o);for(const e of t.contextProperties||[])a.has(e)||i.style.removeProperty(e);for(const e of o){const t=s.getPropertyValue(e);i.style.getPropertyValue(e)!==t&&i.style.setProperty(e,t)}t.contextProperties=o}function p(e){return e?.querySelector(".sf-dropdown-field, .sf-dropdown-trigger")??null}function h(e,t){const i=l.get(t);if(!i||!e.isConnected||t.hidden)return!1;const s=p(e);return!!s&&(e.closest('[hidden], [inert], [aria-hidden="true"], dialog:not([open])')||!s.getClientRects().length||["hidden","collapse"].includes(getComputedStyle(s).visibility)?(i.onUnavailable?.(),!1):(u(e,i),i.wrap&&(i.wrap.style.minHeight="0",i.wrap.style.overflowY="auto"),i.anchor||(i.anchor=r().anchor(s,t,{side:"block-end",align:"start",matchWidth:s.classList.contains("sf-dropdown-field"),fitHeight:!0,autoUpdate:!1,onPosition:({side:i})=>{const s="block-start"===i;t.dataset.placement=e.dataset.placement=s?"top":"bottom",e.classList.toggle("sf-dropdown--drop-up",s),e.classList.toggle("sf-dropdown--drop-down",!s)}})),i.anchor.update(),!0))}function f(e,t,i){if(!t?.isConnected||!p(e))return!1;const s=t.contains(document.activeElement)?document.activeElement:null;if(!l.has(t)){const s=c.map(e=>[e,t.style.getPropertyValue(e),t.style.getPropertyPriority(e)]),n={root:e,saved:s,onUnavailable:i,popover:t.getAttribute("popover"),frame:0,native:"function"==typeof t.showPopover};if(n.wrap=t.querySelector(".sf-list-container-wrap"),n.wrapStyles=n.wrap?["min-height","overflow-y"].map(e=>[e,n.wrap.style.getPropertyValue(e),n.wrap.style.getPropertyPriority(e)]):[],n.schedule=()=>{n.frame||(n.frame=requestAnimationFrame(()=>{n.frame=0,h(e,t)}))},l.set(t,n),e.__sfDropdownPortalList=t,n.native)t.setAttribute("popover","manual");else{n.parent=t.parentNode,n.next=t.nextSibling,n.context=document.createElement("div"),n.context.style.cssText="display:contents;position:static",u(e,n);(e.closest('dialog[open], [role="dialog"][aria-modal="true"]')||document.body).append(n.context),n.context.append(t),t.style.zIndex="var(--sf-z-index-9)"}n.inheritance=new MutationObserver(n.schedule);for(let t=e;t;t=t.parentElement)n.inheritance.observe(t,{attributes:!0,attributeFilter:["class","style","dir","hidden","inert","aria-hidden","open"]});Object.assign(t.style,{position:"fixed",inset:"auto",margin:"0",overflow:n.wrap?"hidden":"auto"}),"function"==typeof ResizeObserver&&(n.resize=new ResizeObserver(n.schedule),n.resize.observe(p(e)),n.resize.observe(t)),window.visualViewport?.addEventListener("resize",n.schedule),window.visualViewport?.addEventListener("scroll",n.schedule)}return t.hidden=!1,l.get(t).native&&!t.matches(":popover-open")&&t.showPopover(),!!h(e,t)&&(s&&document.activeElement!==s&&s.focus({preventScroll:!0}),!0)}function g(e){const t=l.get(e);if(!t)return!1;const i=e.contains(document.activeElement)?document.activeElement:null;t.anchor?.stop(),t.resize?.disconnect(),cancelAnimationFrame(t.frame),t.inheritance?.disconnect(),window.visualViewport?.removeEventListener("resize",t.schedule),window.visualViewport?.removeEventListener("scroll",t.schedule),t.native?(e.matches(":popover-open")&&e.hidePopover(),null===t.popover?e.removeAttribute("popover"):e.setAttribute("popover",t.popover)):(t.next?.parentNode===t.parent?t.parent.insertBefore(e,t.next):t.parent.append(e),t.context.remove());for(const[i,s,n]of t.saved)s?e.style.setProperty(i,s,n):e.style.removeProperty(i);for(const[e,i,s]of t.wrapStyles)i?t.wrap.style.setProperty(e,i,s):t.wrap.style.removeProperty(e);return delete e.dataset.placement,delete t.root.dataset.placement,t.root.classList.remove("sf-dropdown--drop-up","sf-dropdown--drop-down"),t.root.__sfDropdownPortalList===e&&delete t.root.__sfDropdownPortalList,l.delete(e),i&&!e.hidden&&t.root.isConnected&&document.activeElement!==i&&i.focus({preventScroll:!0}),!0}s()}catch(b){s(b)}})},"98e26702f55a"(e,t,i){function s(){const e=globalThis.SF=globalThis.SF||{};return e.__deprecationNotes instanceof Map||Object.defineProperty(e,"__deprecationNotes",{value:new Map,configurable:!0}),e.__deprecationNotes}function n({component:e="",kind:t="attribute",attribute:i="",from:n,to:o=null}={}){if(!n)return;const a=[e,t,i,n].join("|"),r=s(),l=r.get(a);if(l)l.count+=1;else if(r.set(a,{component:e,kind:t,attribute:i,from:n,to:o,count:1}),function(){const e=globalThis.document?.documentElement;return"warn"===e?.dataset?.sfDeprecations||!0===globalThis.SF?.deprecations?.warn}()){const s=e?`${e}: `:"",a="value"===t?`${i}="${n}"`:`${t} ${n}`;globalThis.console?.warn?.(`[SIMAI Framework] ${s}${a} is a legacy name${o?`; write ${o}`:""}. See contracts/changes/journal.json.`)}}if(i.d(t,{id:()=>c,kA:()=>l}),"undefined"!=typeof globalThis){globalThis.SF=globalThis.SF||{};const e=globalThis.SF.deprecations||{};e.list=function(){return[...s().values()].map(e=>({...e}))},e.clear=function(){s().clear()},e.note=n,globalThis.SF.deprecations=e}const o=Object.freeze(["1/2","1","2"]),a=Object.freeze({"1/3":"1/2",3:"2"}),r=new Set;function l(e){const t=String(e??"").trim().toLowerCase();return o.includes(t)?t:Object.hasOwn(a,t)?a[t]:"1"}function c(e,t="field",i="1"){const s=String(e??"").trim().toLowerCase();if(o.includes(s))return s;if(Object.hasOwn(a,s)){const e=a[s];n({component:t,kind:"value",attribute:"size",from:s,to:e});const i=`${t}:${s}`;return r.has(i)||"undefined"==typeof console||(r.add(i),console.warn(`[SIMAI Framework] ${t}: size ${s} is retired for form fields; rendering size ${e}.`)),e}return i}},"67eed2647f47"(e,t,i){i.d(t,{z:()=>o});const s=new WeakMap,n=new WeakSet;function o(e,t){const i=e.ownerDocument;n.has(i)||(i.addEventListener("reset",e=>{const t=e.target;if("FORM"!==t?.tagName)return;const i=Array.from(t.elements);setTimeout(()=>{if(!e.defaultPrevented)for(const e of i)if(e.isConnected&&e.form===t)for(const t of s.get(e)||[])t()},0)},!0),n.add(i));let o=s.get(e);return o||s.set(e,o=new Set),o.add(t),()=>o.delete(t)}},"421676f72963"(e,t,i){i.d(t,{Ec:()=>r});const s="sfPopoverOpen",n=new WeakSet,o=Symbol.for("sf.openSurfaceLayers");function a(){const e=globalThis;return Array.isArray(e[o])||(e[o]=[]),e[o]}function r(e,t){if(!e)return;const i=Boolean(t);if(i===n.has(e))return;const o=a();if(i)n.add(e),o.push(e);else{n.delete(e);const t=o.lastIndexOf(e);t>=0&&o.splice(t,1)}!function(e){const t=globalThis.document?.documentElement;if(!t)return;const i=Math.max(0,Number(t.dataset[s]||0)+e);i?t.dataset[s]=String(i):delete t.dataset[s]}(i?1:-1)}},"50a1017ded91"(e,t,i){i.a(e,async(e,t)=>{try{var s=i("fbe0570fcc69"),n=i("0d662e4d7d63"),o=i("98e26702f55a"),a=i("5429d6e80991"),r=i("3a03d4610486"),l=i("67eed2647f47"),c=i("a0f23dca0b37"),d=i("421676f72963"),u=e([s,n,a,c]);[s,n,a,c]=u.then?(await u)():u;var p=i.n(s);const h={en:{search:"Search"},ru:{search:"Поиск"}};function f(e){return(0,o.id)(e,"sf-dropdown")}function g(e){const t=String(e||"").toLowerCase();return["text","icon","checkbox","avatar","color"].includes(t)?t:"text"}function b(e,t="1"){return e instanceof HTMLElement?"sf-list-item"!==e.tagName.toLowerCase()?null:{type:g(e.getAttribute("kind")||e.getAttribute("type")),size:f(e.getAttribute("size")||t),text:e.getAttribute("text")||"",icon:e.getAttribute("icon")||"person",checked:e.hasAttribute("checked")||(0,s.toBoolean)(e.getAttribute("checked")),selected:e.hasAttribute("selected")||(0,s.toBoolean)(e.getAttribute("selected")),disabled:e.hasAttribute("disabled")||(0,s.toBoolean)(e.getAttribute("disabled")),colorClass:e.getAttribute("color-class")||"bg-tertiary",avatarImageUrl:e.getAttribute("avatar-image-url")||"",avatarTitle:e.getAttribute("avatar-title")||e.getAttribute("text")||"",value:e.getAttribute("value")??e.getAttribute("text")??"",ariaLabel:e.getAttribute("aria-label")||"",group:e.getAttribute("group")||""}:null}function m(e,t="1"){if(!e||"object"!=typeof e)return null;const i=void 0===e.text||null===e.text?"":String(e.text),n=void 0===e.value||null===e.value?i:String(e.value);return""===i&&""===n?null:{type:g(e.kind||e.type),size:f(e.size||t),text:i,icon:e.icon?String(e.icon):"person",checked:(0,s.toBoolean)(e.checked),selected:(0,s.toBoolean)(e.selected),disabled:(0,s.toBoolean)(e.disabled),colorClass:e.colorClass?String(e.colorClass):"bg-tertiary",avatarImageUrl:e.avatarImageUrl?String(e.avatarImageUrl):"",avatarTitle:e.avatarTitle?String(e.avatarTitle):i,value:n,ariaLabel:e.ariaLabel?String(e.ariaLabel):"",group:e.group?String(e.group):""}}function v(e,t="1"){let i=e;if("string"==typeof i){const e=i.trim();if(""===e)return[];try{i=JSON.parse(e)}catch{return[]}}return Array.isArray(i)?i.map(e=>m("string"==typeof e||"number"==typeof e?{text:String(e),value:String(e)}:e,t)).filter(Boolean):[]}function y(e=""){return String(e||"").split(",").map(e=>e.trim()).filter(Boolean)}function w(e=[]){return e.map(e=>String(e)).join(",")}function x(e={}){return"avatar"===e.type?e.avatarTitle||e.text||e.value||"":e.text||e.avatarTitle||e.value||""}class $ extends(p()){constructor(){super(),this._options=[],this._optionsCaptured=!1,this._optionsFromData=!1,this._open=!1,this._searchValue="",this._selectedValues=[],this._dropdownRoot=null,this._list=null,this._documentClickHandler=this.handleDocumentClick.bind(this),this._viewportHandler=this.positionPortalList.bind(this)}static get props(){return{templateName:{attribute:"template",default:"default"},size:{default:"1"},appearance:{default:"outlined",values:["filled","outlined"],aliases:["type"]},mode:{default:"select",values:["tag","select"]},multiple:{type:Boolean,default:!1},portal:{type:Boolean,default:!0},value:{default:""},name:{default:""},label:{default:""},required:{type:Boolean,default:!1},placeholder:{default:""},searchPlaceholder:{default:""},search:{type:Boolean,default:!0},layout:{default:"list",values:["list","grid"]},columns:{default:"6"},disabled:{type:Boolean,default:!1},ariaLabel:{default:""}}}connectedCallback(){this.captureOptions(),Object.prototype.hasOwnProperty.call(this,"_resetValues")||(this._resetValues=[...this.selectedValues]),super.connectedCallback()}attributeChangedCallback(e,t,i){t!==i&&("value"===e&&(this._selectedValues=y(i)),"disabled"===e&&this.disabled&&(this._open=!1,this._searchValue="")),super.attributeChangedCallback(e,t,i)}get componentName(){return"dropdown"}get templateName(){return this.getAttribute("template")||"default"}get size(){return f(this.getAttribute("size"))}get appearance(){return this.getProp("appearance")}get type(){return this.appearance}get mode(){return this.getEnumAttr("mode",["tag","select"],"select")}get multiple(){return this.hasAttribute("multiple")?this.getBooleanAttr("multiple",!0):"tag"===this.mode}get portal(){return this.getBooleanAttr("portal",!0)}get name(){return this.getAttribute("name")||""}get selectedValue(){return this.getAttribute("value")||""}get label(){return this.getAttribute("label")||""}get required(){return this.getBooleanAttr("required",!1)}get placeholder(){return this.getAttribute("placeholder")||""}get searchPlaceholder(){return this.getAttribute("search-placeholder")||(0,n.pageText)(h,"search",this)}get layout(){return this.getEnumAttr("layout",["list","grid"],"list")}get columns(){const e=Number.parseInt(this.getAttribute("columns")??"",10);return Number.isFinite(e)&&e>0?String(e):"6"}get search(){return this.getBooleanAttr("search",!0)}get disabled(){return this.getBooleanAttr("disabled",!1)}get ariaLabel(){return this.getAttribute("aria-label")||""}get selectedValues(){return this.hasAttribute("value")?y(this.selectedValue):this._selectedValues}get selectedOptions(){const e=this.options;return[...new Set(this.selectedValues)].map(t=>e.find(e=>String(e.value)===t)).filter(Boolean)}get triggerText(){if("tag"===this.mode)return"";return(this.multiple?this.selectedOptions:this.selectedOptions.slice(0,1)).map(x).join(", ")}get hiddenValue(){return this.selectedValues.join(",")}captureOptions(){if(this._optionsFromData)return;const e=Array.from(this.children).filter(e=>e instanceof HTMLElement&&"sf-list-item"===e.tagName.toLowerCase());e.length&&(this._options=e.map(e=>b(e,this.size)).filter(Boolean),this._optionsCaptured=!0,this.selectedValue||this._selectedValues.length||(this._selectedValues=this._options.filter(e=>e.selected).map(e=>String(e.value))),e.forEach(e=>e.remove()))}set options(e){const t=v(e,this.size);this._optionsFromData=!0,this._options=t,this._optionsCaptured=!0,this.selectedValue||this._selectedValues.length||(this._selectedValues=t.filter(e=>e.selected).map(e=>String(e.value))),this.requestComponentUpdate("options")}get options(){if(!Array.isArray(this._options)||!this._options.length)return[];const e=new Set(this.selectedValues);return this._options.map(t=>({...t,size:f(t.size||this.size),selected:e.has(String(t.value))}))}get visibleOptions(){const e=String(this._searchValue||"").trim().toLowerCase();return e?this.options.filter(t=>x(t).toLowerCase().includes(e)):this.options}templateContext(){const e=this.getPropsContext();return this.createTemplateContext({...e,component:this,open:this._open,multiple:this.multiple,value:this.hiddenValue,triggerText:this.triggerText,searchValue:this._searchValue,searchPlaceholder:this.searchPlaceholder,selectedValues:this.selectedValues,selectedOptions:this.selectedOptions,options:this.visibleOptions})}template(){return(0,a.g)(this.templateContext())}beforeRender(){this.captureOptions()}afterRender(){const e=this._dropdownRoot,t=this._list;this._dropdownRoot=this.querySelector(".sf-dropdown"),this._list=this.querySelector(".sf-list")||(e===this._dropdownRoot?t:null),t!==this._list&&(0,c.AL)(t),this.syncDocumentListeners(),this.syncPortalListeners(),this.syncOpenSurfaceMark(),this.positionPortalList(),e!==this._dropdownRoot&&(this._interaction?.release(),this._interaction=null),this._dropdownRoot&&!this._interaction&&(this._interaction=(0,r.Q)(this._dropdownRoot,{owner:this,getList:()=>this._list,isOpen:()=>this._open,isDisabled:()=>this.disabled,isMultiple:()=>this.multiple,open:()=>this.openDropdown(),close:()=>this.closeDropdown(),select:e=>this.selectValue(e.dataset.value||""),selectedLabels:()=>this.selectedOptions.map(x)})),this._interaction?.refresh();const i=this.querySelector(".sf-dropdown-hidden-input")||this.querySelector(".sf-dropdown-field > button");this._resetControl!==i&&(this._releaseReset?.(),this._resetControl=i,this._releaseReset=i?(0,l.z)(i,()=>{this._interaction?.beforeClose(),this._selectedValues=[...this._resetValues],this.setAttributeValue("value",w(this._selectedValues)),this._open=!1,this._searchValue="";const e=this.querySelector('.sf-dropdown-field input:not([type="hidden"])');e&&(e.value=this.triggerText),this.requestComponentUpdate("reset")}):null)}onDisconnected(){(0,d.Ec)(this,!1),(0,c.AL)(this._list),this._releaseReset?.(),this._releaseReset=null,this._resetControl=null,this._interaction?.release(),this._interaction=null,this.removeDocumentListeners(),this.removePortalListeners(),super.onDisconnected()}openDropdown(){return this.disabled||this._open||(this._open=!0,this.requestComponentUpdate("open")),this}closeDropdown(){return this._open?(this._interaction?.beforeClose(),this._open=!1,this._searchValue="",this.requestComponentUpdate("close"),this):this}toggleDropdown(){return this._open?this.closeDropdown():this.openDropdown()}handleTriggerClick(e){this.disabled||(e?.preventDefault?.(),this.toggleDropdown())}handleSearchInput(e){this._searchValue=e?.target?.value||"",this.requestComponentUpdate("search")}handleOptionClick(e){if(this.disabled)return;const t=e.target?.closest?.(".sf-list-item");t&&(this.contains(t)||this._list?.contains(t))&&!t.classList.contains("disabled")&&(e.preventDefault(),this.selectValue(t.dataset.value||""))}handleOptionKeydown(e){"Enter"!==e.key&&" "!==e.key||this.handleOptionClick(e)}handleDocumentClick(e){!this._open||this.contains(e.target)||this._list?.contains(e.target)||this.closeDropdown()}selectValue(e=""){if(this.disabled)return this;const t=this.options.find(t=>String(t.value)===String(e));if(!t||t.disabled)return this;const i=!this.multiple&&1===this.selectedValues.length&&this.selectedValues[0]===String(t.value);if(this.multiple){const e=new Set(this.selectedValues);e.has(String(t.value))?e.delete(String(t.value)):e.add(String(t.value)),this._selectedValues=Array.from(e)}else this._selectedValues=[String(t.value)];const s=[...this._selectedValues];return this.setAttributeValue("value",w(s)),i||this.dispatchDropdownChange(t,s),this.multiple||(this._interaction?.beforeClose(),this._open=!1,this._searchValue=""),this.requestComponentUpdate("select"),this}removeSelectedValue(e=""){if(this.disabled)return this;const t=new Set(this.selectedValues);t.delete(String(e)),this._selectedValues=Array.from(t);const i=[...this._selectedValues];return this.setAttributeValue("value",w(i)),this.dispatchDropdownChange(null,i),this.requestComponentUpdate("remove-tag"),this}dispatchDropdownChange(e=null,t=this.selectedValues){const i={value:e?.value||"",label:e?x(e):"",values:t,item:e,root:this,multiple:this.multiple};this.dispatchEvent(new CustomEvent("sf-dropdown:change",{bubbles:!0,composed:!0,detail:i})),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:i}))}syncOpenSurfaceMark(){(0,d.Ec)(this,this._open)}syncDocumentListeners(){this._open?document.addEventListener("click",this._documentClickHandler):this.removeDocumentListeners()}removeDocumentListeners(){document.removeEventListener("click",this._documentClickHandler)}syncPortalListeners(){if(this._open&&this.portal)return window.addEventListener("resize",this._viewportHandler),void document.addEventListener("scroll",this._viewportHandler,!0);this.removePortalListeners()}removePortalListeners(){window.removeEventListener("resize",this._viewportHandler),document.removeEventListener("scroll",this._viewportHandler,!0)}positionPortalList(){this._list&&this._dropdownRoot&&this.portal&&this._open?(0,c.GD)(this._dropdownRoot,this._list,()=>this.closeDropdown()):(0,c.AL)(this._list)}get value(){return this.hiddenValue}set value(e){if(e&&"object"==typeof e&&!Array.isArray(e))return void this.setValueAttributes(e);const t=Array.isArray(e)?e.map(String):y(null==e?"":String(e));this.setAttributeValue("value",w(t))}}$.define("sf-dropdown"),t()}catch(S){t(S)}})},"5429d6e80991"(e,t,i){i.a(e,async(e,s)=>{try{i.d(t,{g:()=>h});var n=i("ddf1cdb42ecc"),o=i("c22590307c6c"),a=e([n,o]);[n,o]=a.then?(await a)():a;function r(e={}){return"avatar"===e.type?e.avatarTitle||e.text||e.value||"":e.text||e.avatarTitle||e.value||""}function l(e=[],t=!1){const i=[];let s=null;for(const n of e){const e=n.group?String(n.group):"";e!==s&&(s=e,e&&i.push((0,o.aU)(e,n.size)));const a=t&&(!n.type||"text"===n.type);i.push((0,o.lN)(a?{...n,type:"checkbox"}:n))}return i}const c=Object.freeze({"1/2":{size:"1/3",spacing:""},1:{size:"1",spacing:"compact"},2:{size:"2",spacing:"compact"}});function d(e){if(e.multiple||1!==e.selectedOptions?.length)return n.nothing;const t=e.selectedOptions[0];return"icon"===t.type&&t.icon?n.html`<i class="sf-icon sf-dropdown-field-visual" aria-hidden="true">${t.icon}</i>`:"color"===t.type&&t.colorClass?n.html`<span class="sf-tag-color-icon sf-dropdown-field-visual ${t.colorClass}" aria-hidden="true"></span>`:"avatar"===t.type&&t.avatarImageUrl?n.html`<span class="sf-avatar sf-avatar--size-1/2 bg-cover sf-dropdown-field-visual" aria-hidden="true" style=${`background-image: url(${t.avatarImageUrl});`}></span>`:n.nothing}function u(e,t){const i=r(t),s=c[e.size]||c[1],o=s.size,a=s.spacing?` spacing-${s.spacing}`:"",l="color"===t.type?"color":"avatar"===t.type?"avatar":"icon";return n.html`
     <div
-      class="sf-tag transition sf-tag--${l} sf-tag--size-${o} sf-tag--inline${r} flex flex-row flex-nowrap items-center active"
+      class="sf-tag transition sf-tag--${l} sf-tag--size-${o} sf-tag--inline${a} flex flex-row flex-nowrap items-center active"
       data-value=${t.value}
     >
       ${"color"===t.type?n.html`<span class="sf-tag-color-icon ${t.colorClass}" aria-hidden="true"></span>`:n.nothing}
@@ -12,20 +12,20 @@
               style=${t.avatarImageUrl?`background-image: url(${t.avatarImageUrl});`:n.nothing}
             ></span>
           `:n.nothing}
-      <span class="sf-tag-container">${s}</span>
+      <span class="sf-tag-container">${i}</span>
       <button
         type="button"
         class="sf-icon-button sf-icon-button--link sf-icon-button--on-surface sf-icon-button--size-1/3"
-        aria-label=${`Remove ${s}`}
+        aria-label=${`Remove ${i}`}
         ?disabled=${e.disabled}
-        @click=${s=>{s.preventDefault(),s.stopPropagation(),e.component.removeSelectedValue(t.value)}}
+        @click=${i=>{i.preventDefault(),i.stopPropagation(),e.component.removeSelectedValue(t.value)}}
       >
         <div class="sf-close sf-close--size-1/3 flex">
           <div class="sf-close-icon"></div>
         </div>
       </button>
     </div>
-  `}const p={"1/2":"var(--sf-ui-1\\/2--control-height)",1:"var(--sf-ui-1--control-height)",2:"var(--sf-ui-2--control-height)"};function h(e){const t=["sf-dropdown",e.rootClass,e.open?"open":"",e.open?"sf-dropdown--open":"",`sf-dropdown--size-${e.size}`,`sf-dropdown--${e.appearance??e.type}`,"tag"===e.mode?"sf-dropdown--tag":"","grid"===e.layout?"sf-dropdown--grid":"","tag"!==e.mode?"sf-dropdown--text":"",e.disabled?"disabled":"","flex","flex-col"].filter(Boolean),s=["sf-dropdown-field",e.disabled?"":"cursor-pointer","items-cross-center","relative","transition","flex"].filter(Boolean),i="1"===e.size||"1/2"===e.size?"1/2":e.size,o=e.size,r=e.open?"keyboard_arrow_up":"keyboard_arrow_down";return n.html`
+  `}const p={"1/2":"var(--sf-ui-1\\/2--control-height)",1:"var(--sf-ui-1--control-height)",2:"var(--sf-ui-2--control-height)"};function h(e){const t=["sf-dropdown",e.rootClass,e.open?"open":"",e.open?"sf-dropdown--open":"",`sf-dropdown--size-${e.size}`,`sf-dropdown--${e.appearance??e.type}`,"tag"===e.mode?"sf-dropdown--tag":"","grid"===e.layout?"sf-dropdown--grid":"","tag"!==e.mode?"sf-dropdown--text":"",e.disabled?"disabled":"","flex","flex-col"].filter(Boolean),i=["sf-dropdown-field",e.disabled?"":"cursor-pointer","items-cross-center","relative","transition","flex"].filter(Boolean),s="1"===e.size||"1/2"===e.size?"1/2":e.size,o=e.size,a=e.open?"keyboard_arrow_up":"keyboard_arrow_down";return n.html`
     <div
       class=${t.join(" ")}
       style=${e.rootStyle||n.nothing}
@@ -66,7 +66,7 @@
           />
         `:n.nothing;return"tag"===e.mode?n.html`
         <div
-          class=${s.join(" ")}
+          class=${i.join(" ")}
           @click=${t=>e.component.handleTriggerClick(t)}
         >
           ${t}
@@ -75,15 +75,15 @@
           </div>
           <button
             type="button"
-            class="sf-icon-button sf-icon-button--icon sf-icon-button--on-surface sf-icon-button--link sf-icon-button--size-${i}"
+            class="sf-icon-button sf-icon-button--icon sf-icon-button--on-surface sf-icon-button--link sf-icon-button--size-${s}"
             ?disabled=${e.disabled}
           >
-            <i class="sf-icon" aria-hidden="true">${r}</i>
+            <i class="sf-icon" aria-hidden="true">${a}</i>
           </button>
         </div>
       `:n.html`
       <label
-        class=${s.join(" ")}
+        class=${i.join(" ")}
         @click=${t=>e.component.handleTriggerClick(t)}
       >
         ${t}
@@ -98,10 +98,10 @@
         />
         <button
           type="button"
-          class="sf-icon-button sf-icon-button--icon sf-icon-button--on-surface sf-icon-button--link sf-icon-button--size-${i} absolute"
+          class="sf-icon-button sf-icon-button--icon sf-icon-button--on-surface sf-icon-button--link sf-icon-button--size-${s} absolute"
           ?disabled=${e.disabled}
         >
-          <i class="sf-icon" aria-hidden="true">${r}</i>
+          <i class="sf-icon" aria-hidden="true">${a}</i>
         </button>
       </label>
     `})()}
@@ -141,20 +141,24 @@
         </div>
       </div>
     </div>
-  `}i()}catch(f){i(f)}})},c22590307c6c(e,t,s){s.a(e,async(e,i)=>{try{s.d(t,{aU:()=>d,lN:()=>c});var n=s("ddf1cdb42ecc"),o=s("98e26702f55a"),r=e([n]),a=r.then?(await r)():r;n=a[0];function l(e){const t=!0===e.option,s=e.component?.hasSlotContent?.("text")?e.component.getSlotContent("text"):e.text,i=e.component?.hasSlotContent?.("leading")?e.component.getSlotContent("leading"):n.nothing,o=e.component?.hasSlotContent?.("trailing")?e.component.getSlotContent("trailing"):n.nothing,r=["sf-list-item","flex","items-cross-center",`sf-list-item--${e.kind??e.type}`,`sf-list-item--size-${e.size}`,t?"cursor-pointer":"",e.selected?"selected":"",e.disabled?"disabled":"",e.rootClass].filter(Boolean),a=["sf-list-item-wrap","flex","flex-1"];["icon","checkbox","avatar","color"].includes(e.type)&&a.push("flex","flex-row","flex-nowrap","items-center","gap-2"),"avatar"!==e.type&&"color"!==e.type||(a.splice(a.indexOf("gap-2"),1),a.push("justify-between","gap-2"));return n.html`
+  `}s()}catch(f){s(f)}})},c22590307c6c(e,t,i){i.a(e,async(e,s)=>{try{i.d(t,{aU:()=>d,lN:()=>c});var n=i("ddf1cdb42ecc"),o=i("98e26702f55a"),a=e([n]),r=a.then?(await a)():a;n=r[0];function l(e){const t=!0===e.option,i=e.component?.hasSlotContent?.("text")?e.component.getSlotContent("text"):e.text,s=e.component?.hasSlotContent?.("leading")?e.component.getSlotContent("leading"):n.nothing,o=e.component?.hasSlotContent?.("trailing")?e.component.getSlotContent("trailing"):n.nothing,a=!t&&e.component?.hasSlotContent?.("supporting")?e.component.getSlotContent("supporting"):!t&&e.supporting||n.nothing,r=a!==n.nothing,l=t||e.pinned?"":e.sortableItem||"",c=!t&&Boolean(e.sortableItem||e.pinned),d=!t&&Boolean(e.interactive||l),u=["sf-list-item","flex","items-cross-center",`sf-list-item--${e.kind??e.type}`,`sf-list-item--size-${e.size}`,t?"cursor-pointer":"",e.selected?"selected":"",e.disabled?"disabled":"",r?"sf-list-item--two-line":"",!t&&e.interactive?"sf-list-item--interactive":"",c?"sf-list-item--sortable":"",!t&&e.pinned?"sf-list-item--pinned":"",e.rootClass].filter(Boolean),p=["sf-list-item-wrap","flex","flex-1"];["icon","checkbox","avatar","color"].includes(e.type)&&p.push("flex","flex-row","flex-nowrap","items-center","gap-2"),"avatar"!==e.type&&"color"!==e.type||(p.splice(p.indexOf("gap-2"),1),p.push("justify-between","gap-2"));return n.html`
     <div
-      class=${r.join(" ")}
+      class=${u.join(" ")}
       style=${e.rootStyle||n.nothing}
       role=${t?"option":n.nothing}
       tabindex=${t?"-1":n.nothing}
       data-value=${t&&e.value||n.nothing}
-      aria-label=${t&&e.ariaLabel||n.nothing}
+      aria-label=${(t||d)&&e.ariaLabel||n.nothing}
       title=${t&&e.ariaLabel||n.nothing}
-      aria-disabled=${t&&e.disabled?"true":n.nothing}
+      aria-disabled=${(t||d)&&e.disabled?"true":n.nothing}
       aria-selected=${t?e.selected?"true":"false":n.nothing}
+      data-sf-sortable-item=${l||n.nothing}
+      ?data-sf-list-roving=${d}
+      aria-current=${d&&e.selected?"true":n.nothing}
     >
-      <div class=${a.join(" ")}>
-        ${(()=>{if(i!==n.nothing)return i;if("icon"===e.type)return n.html`<i class="sf-icon" aria-hidden="true">${e.icon}</i>`;if("checkbox"===e.type)return n.html`
+      ${c?n.html`<span class="sf-list-item-handle" ?data-sf-sortable-handle=${Boolean(l)} aria-hidden="true">${l?n.html`<i class="sf-icon">drag_indicator</i>`:n.nothing}</span>`:n.nothing}
+      <div class=${p.join(" ")}>
+        ${(()=>{if(s!==n.nothing)return s;if("icon"===e.type)return n.html`<i class="sf-icon" aria-hidden="true">${e.icon}</i>`;if("checkbox"===e.type)return n.html`
         <label
           class="sf-checkbox sf-checkbox--size-${e.sizeGroup.checkbox} flex"
           aria-hidden="true"
@@ -187,9 +191,9 @@
       `}if("color"===e.type){const t=["sf-tag","sf-tag--color",`sf-tag--size-${e.sizeGroup.colorTag}`,"flex","flex-row","flex-nowrap","items-center","flex-1",e.disabled?"disabled":""].filter(Boolean);return n.html`
         <div class=${t.join(" ")}>
           <span class="sf-tag-color-icon ${e.colorClass}" aria-hidden="true"></span>
-          <span class="sf-tag-container">${s}</span>
+          <span class="sf-tag-container">${i}</span>
         </div>
-      `}return n.nothing})()} ${"color"===e.type||"avatar"===e.type?n.nothing:n.html`<div class="sf-list-item-container">${s}</div>`} ${o!==n.nothing?o:"avatar"===e.type||"color"===e.type?n.html`
+      `}return n.nothing})()} ${"color"===e.type||"avatar"===e.type?n.nothing:r?n.html`<div class="sf-list-item-container"><span class="sf-list-item-title">${i}</span><span class="sf-list-item-supporting">${a}</span></div>`:n.html`<div class="sf-list-item-container">${i}</div>`} ${o!==n.nothing?o:"avatar"===e.type||"color"===e.type?n.html`
         <label
           class="sf-checkbox sf-checkbox--size-${e.sizeGroup.checkbox} flex"
           aria-hidden="true"
@@ -211,4 +215,4 @@
     <div class="sf-list-heading sf-list-heading--size-${t}" role="presentation">
       <span class="sf-list-heading-container">${e}</span>
     </div>
-  `}function u(e){const t=String(e||"1");return"1/3"===t||"1/2"===t?{item:t,checkbox:(0,o.kA)(t),avatarGroup:"1/2",colorTag:"1/2"}:{item:t,checkbox:(0,o.kA)(t),avatarGroup:t,colorTag:"1"}}i()}catch(p){i(p)}})},ddf1cdb42ecc(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("lit"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("lit")),{once:!0}))},"0d662e4d7d63"(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("page-language"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("page-language")),{once:!0}))},"5c1dc214bb5e"(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("position"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("position")),{once:!0}))},fbe0570fcc69(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("smart-base"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("smart-base")),{once:!0}))}};const t={};function s(i){const n=t[i];if(void 0!==n)return n.exports;const o=t[i]={exports:{}};return e[i](o,o.exports,s),o.exports}(()=>{const e="function"==typeof Symbol,t=e?Symbol("webpack queues"):"__webpack_queues__",i=e?Symbol("webpack exports"):"__webpack_exports__",n=e?Symbol("webpack error"):"__webpack_error__",o=e=>{e?.d<1&&(e.d=1,e.forEach(e=>e.r--),e.forEach(e=>e.r--?e.r++:e()))};s.a=(e,s,r)=>{let a;r&&((a=[]).d=-1);const l=new Set,c=e.exports;let d,u,p;const h=new Promise((e,t)=>{p=t,u=e});h[i]=c,h[t]=e=>(a&&e(a),l.forEach(e),h.catch(e=>{})),e.exports=h;s(e=>{let s;d=(e=>e.map(e=>{if(null!==e&&"object"==typeof e){if(e[t])return e;if(e.then){const s=[];s.d=0,e.then(e=>{r[i]=e,o(s)},e=>{r[n]=e,o(s)});const r={};return r[t]=e=>e(s),r}}const s={};return s[t]=e=>{},s[i]=e,s}))(e);const r=()=>d.map(e=>{if(e[n])throw e[n];return e[i]}),c=new Promise(e=>{s=()=>e(r),s.r=0;const i=e=>e!==a&&!l.has(e)&&(l.add(e),e&&!e.d&&(s.r++,e.push(s)));d.map(e=>e[t](i))});return s.r?c:r()},e=>(e?p(h[n]=e):u(c),o(a))),a?.d<0&&(a.d=0)}})(),s.n=e=>{const t=e&&e.__esModule?()=>e.default:()=>e;return s.d(t,{a:t}),t},s.d=(e,t)=>{if(Array.isArray(t))for(var i=0;i<t.length;){var n=t[i++],o=t[i++];s.o(e,n)?0===o&&i++:0===o?Object.defineProperty(e,n,{enumerable:!0,value:t[i++]}):Object.defineProperty(e,n,{enumerable:!0,get:o})}else for(var n in t)s.o(t,n)&&!s.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},s.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);s("50a1017ded91")})();
+  `}function u(e){const t=String(e||"1");return"1/3"===t||"1/2"===t?{item:t,checkbox:(0,o.kA)(t),avatarGroup:"1/2",colorTag:"1/2"}:{item:t,checkbox:(0,o.kA)(t),avatarGroup:t,colorTag:"1"}}s()}catch(p){s(p)}})},ddf1cdb42ecc(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("lit"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("lit")),{once:!0}))},"0d662e4d7d63"(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("page-language"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("page-language")),{once:!0}))},"5c1dc214bb5e"(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("position"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("position")),{once:!0}))},fbe0570fcc69(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("smart-base"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("smart-base")),{once:!0}))}};const t={};function i(s){const n=t[s];if(void 0!==n)return n.exports;const o=t[s]={exports:{}};return e[s](o,o.exports,i),o.exports}(()=>{const e="function"==typeof Symbol,t=e?Symbol("webpack queues"):"__webpack_queues__",s=e?Symbol("webpack exports"):"__webpack_exports__",n=e?Symbol("webpack error"):"__webpack_error__",o=e=>{e?.d<1&&(e.d=1,e.forEach(e=>e.r--),e.forEach(e=>e.r--?e.r++:e()))};i.a=(e,i,a)=>{let r;a&&((r=[]).d=-1);const l=new Set,c=e.exports;let d,u,p;const h=new Promise((e,t)=>{p=t,u=e});h[s]=c,h[t]=e=>(r&&e(r),l.forEach(e),h.catch(e=>{})),e.exports=h;i(e=>{let i;d=(e=>e.map(e=>{if(null!==e&&"object"==typeof e){if(e[t])return e;if(e.then){const i=[];i.d=0,e.then(e=>{a[s]=e,o(i)},e=>{a[n]=e,o(i)});const a={};return a[t]=e=>e(i),a}}const i={};return i[t]=e=>{},i[s]=e,i}))(e);const a=()=>d.map(e=>{if(e[n])throw e[n];return e[s]}),c=new Promise(e=>{i=()=>e(a),i.r=0;const s=e=>e!==r&&!l.has(e)&&(l.add(e),e&&!e.d&&(i.r++,e.push(i)));d.map(e=>e[t](s))});return i.r?c:a()},e=>(e?p(h[n]=e):u(c),o(r))),r?.d<0&&(r.d=0)}})(),i.n=e=>{const t=e&&e.__esModule?()=>e.default:()=>e;return i.d(t,{a:t}),t},i.d=(e,t)=>{if(Array.isArray(t))for(var s=0;s<t.length;){var n=t[s++],o=t[s++];i.o(e,n)?0===o&&s++:0===o?Object.defineProperty(e,n,{enumerable:!0,value:t[s++]}):Object.defineProperty(e,n,{enumerable:!0,get:o})}else for(var n in t)i.o(t,n)&&!i.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);i("50a1017ded91")})();

package/distr/smart/list-item/js/list-item.min.js

@@ -1,17 +1,21 @@
-(()=>{"use strict";var e={"98e26702f55a"(e,t,a){function s(){const e=globalThis.SF=globalThis.SF||{};return e.__deprecationNotes instanceof Map||Object.defineProperty(e,"__deprecationNotes",{value:new Map,configurable:!0}),e.__deprecationNotes}if(a.d(t,{kA:()=>o}),"undefined"!=typeof globalThis){globalThis.SF=globalThis.SF||{};const e=globalThis.SF.deprecations||{};e.list=function(){return[...s().values()].map(e=>({...e}))},e.clear=function(){s().clear()},e.note=function({component:e="",kind:t="attribute",attribute:a="",from:i,to:r=null}={}){if(!i)return;const o=[e,t,a,i].join("|"),l=s(),n=l.get(o);if(n)n.count+=1;else if(l.set(o,{component:e,kind:t,attribute:a,from:i,to:r,count:1}),function(){const e=globalThis.document?.documentElement;return"warn"===e?.dataset?.sfDeprecations||!0===globalThis.SF?.deprecations?.warn}()){const s=e?`${e}: `:"",o="value"===t?`${a}="${i}"`:`${t} ${i}`;globalThis.console?.warn?.(`[SIMAI Framework] ${s}${o} is a legacy name${r?`; write ${r}`:""}. See contracts/changes/journal.json.`)}},globalThis.SF.deprecations=e}const i=Object.freeze(["1/2","1","2"]),r=Object.freeze({"1/3":"1/2",3:"2"});new Set;function o(e){const t=String(e??"").trim().toLowerCase();return i.includes(t)?t:Object.hasOwn(r,t)?r[t]:"1"}},e4b691e01e6b(e,t,a){a.a(e,async(e,t)=>{try{var s=a("fbe0570fcc69"),i=a("c22590307c6c"),r=a("98e26702f55a"),o=e([s,i]);[s,i]=o.then?(await o)():o;var l=a.n(s);function n(e){const t=e;return"1/3"===t||"1/2"===t?{item:t,checkbox:(0,r.kA)(t),avatarGroup:"1/2",colorTag:"1/2"}:{item:t,checkbox:(0,r.kA)(t),avatarGroup:t,colorTag:"1"}}class c extends(l()){static get props(){return{templateName:{attribute:"template",default:"default"},itemValue:{attribute:"value",default:""},kind:{default:"text",values:["text","icon","checkbox","avatar","color"],aliases:["type"]},size:{default:"1",values:["1/3","1/2","1","2","3"]},text:{default:""},icon:{default:"person"},checked:{type:Boolean,default:!1},selected:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},colorClass:{default:"bg-tertiary"},avatarImageUrl:{default:""},avatarTitle:{default:""},ariaLabel:{default:""}}}get componentName(){return"list-item"}get templateName(){return this.getAttribute("template")||"default"}get kind(){return this.getProp("kind")}get type(){return this.kind}get itemValue(){return this.getAttribute("value")||""}get size(){return this.getEnumAttr("size",["1/3","1/2","1","2","3"],"1")}get sizeGroup(){return n(this.size)}get text(){return this.getAttribute("text")||""}get icon(){return this.getAttribute("icon")||"person"}get checked(){return this.getBooleanAttr("checked",!1)}get selected(){return this.getBooleanAttr("selected",!1)}get disabled(){return this.getBooleanAttr("disabled",!1)}get colorClass(){return this.getAttribute("color-class")||"bg-tertiary"}get avatarImageUrl(){return this.getAttribute("avatar-image-url")||""}get avatarTitle(){return this.getAttribute("avatar-title")||this.text}get ariaLabel(){return this.getAttribute("aria-label")||""}templateContext(){const e=this.getPropsContext();return this.createTemplateContext({...e,component:this,sizeGroup:this.sizeGroup,avatarTitle:this.avatarTitle,type:this.type,value:this.itemValue,option:!1})}template(){return(0,i.Ws)(this.templateContext())}resolveUpdateMode(e=[]){return e.length>0&&e.every(e=>["text","aria-label","disabled","selected","checked"].includes(e))?"dom":"lit"}updateDom(e=[]){const t=this.querySelector(".sf-list-item"),a=this.querySelector(".sf-list-item-container, .sf-avatar-label-group-title, .sf-tag-container"),s=this.querySelector(".sf-checkbox input");return!!t&&(e.includes("text")&&a&&(a.textContent=this.text),e.includes("disabled")&&(t.classList.toggle("disabled",this.disabled),s&&(s.disabled=this.disabled)),e.includes("selected")&&t.classList.toggle("selected",this.selected),s&&(e.includes("checked")||e.includes("selected"))&&(s.checked=this.checked||this.selected),!0)}get value(){return{template:this.templateName,value:this.itemValue,type:this.type,size:this.size,text:this.text,icon:this.icon,checked:this.checked,selected:this.selected,disabled:this.disabled,colorClass:this.colorClass,avatarImageUrl:this.avatarImageUrl,avatarTitle:this.avatarTitle,ariaLabel:this.ariaLabel}}set value(e){if(!e||"object"!=typeof e)return;const{value:t,...a}=e;Object.prototype.hasOwnProperty.call(e,"value")&&this.setAttributeValue("value",t),this.setValueAttributes(a)}}c.define("sf-list-item"),t()}catch(d){t(d)}})},c22590307c6c(e,t,a){a.a(e,async(e,s)=>{try{a.d(t,{Ws:()=>l});var i=a("ddf1cdb42ecc"),r=(a("98e26702f55a"),e([i])),o=r.then?(await r)():r;i=o[0];function l(e){const t=!0===e.option,a=e.component?.hasSlotContent?.("text")?e.component.getSlotContent("text"):e.text,s=e.component?.hasSlotContent?.("leading")?e.component.getSlotContent("leading"):i.nothing,r=e.component?.hasSlotContent?.("trailing")?e.component.getSlotContent("trailing"):i.nothing,o=["sf-list-item","flex","items-cross-center",`sf-list-item--${e.kind??e.type}`,`sf-list-item--size-${e.size}`,t?"cursor-pointer":"",e.selected?"selected":"",e.disabled?"disabled":"",e.rootClass].filter(Boolean),l=["sf-list-item-wrap","flex","flex-1"];["icon","checkbox","avatar","color"].includes(e.type)&&l.push("flex","flex-row","flex-nowrap","items-center","gap-2"),"avatar"!==e.type&&"color"!==e.type||(l.splice(l.indexOf("gap-2"),1),l.push("justify-between","gap-2"));return i.html`
+(()=>{"use strict";var e={"98e26702f55a"(e,t,s){function a(){const e=globalThis.SF=globalThis.SF||{};return e.__deprecationNotes instanceof Map||Object.defineProperty(e,"__deprecationNotes",{value:new Map,configurable:!0}),e.__deprecationNotes}if(s.d(t,{kA:()=>r}),"undefined"!=typeof globalThis){globalThis.SF=globalThis.SF||{};const e=globalThis.SF.deprecations||{};e.list=function(){return[...a().values()].map(e=>({...e}))},e.clear=function(){a().clear()},e.note=function({component:e="",kind:t="attribute",attribute:s="",from:i,to:n=null}={}){if(!i)return;const r=[e,t,s,i].join("|"),o=a(),l=o.get(r);if(l)l.count+=1;else if(o.set(r,{component:e,kind:t,attribute:s,from:i,to:n,count:1}),function(){const e=globalThis.document?.documentElement;return"warn"===e?.dataset?.sfDeprecations||!0===globalThis.SF?.deprecations?.warn}()){const a=e?`${e}: `:"",r="value"===t?`${s}="${i}"`:`${t} ${i}`;globalThis.console?.warn?.(`[SIMAI Framework] ${a}${r} is a legacy name${n?`; write ${n}`:""}. See contracts/changes/journal.json.`)}},globalThis.SF.deprecations=e}const i=Object.freeze(["1/2","1","2"]),n=Object.freeze({"1/3":"1/2",3:"2"});new Set;function r(e){const t=String(e??"").trim().toLowerCase();return i.includes(t)?t:Object.hasOwn(n,t)?n[t]:"1"}},e4b691e01e6b(e,t,s){s.a(e,async(e,t)=>{try{var a=s("fbe0570fcc69"),i=s("c22590307c6c"),n=s("98e26702f55a"),r=e([a,i]);[a,i]=r.then?(await r)():r;var o=s.n(a);const l="[data-sf-list-roving]",c='sf-sortable, [role="listbox"], [role="list"], [data-sf-list]',d='a[href], button, input, select, textarea, summary, [contenteditable]:not([contenteditable="false"]), [tabindex]:not([data-sf-list-roving])',u=new Set;function h(e){const t=e.closest("sf-list-item")||e;return t.parentElement?.closest(c)||t.parentElement}function p(e){return[...e.querySelectorAll(l)].filter(t=>h(t)===e)}function f(e){if(!e?.isConnected)return;const t=p(e),s=t.filter(e=>!e.classList.contains("disabled")),a=s.find(e=>"true"===e.dataset.sfListCurrent)||s.find(e=>e.classList.contains("selected"))||s[0];for(const e of t)e.tabIndex=e===a?0:-1,e!==a&&delete e.dataset.sfListCurrent}function b(e){e&&!u.has(e)&&(u.add(e),queueMicrotask(()=>{u.delete(e),f(e)}))}function g(e){const t=h(e);for(const e of p(t))delete e.dataset.sfListCurrent;e.dataset.sfListCurrent="true",f(t),e.focus()}function m(e){const t=e;return"1/3"===t||"1/2"===t?{item:t,checkbox:(0,n.kA)(t),avatarGroup:"1/2",colorTag:"1/2"}:{item:t,checkbox:(0,n.kA)(t),avatarGroup:t,colorTag:"1"}}class v extends(o()){static get props(){return{templateName:{attribute:"template",default:"default"},itemValue:{attribute:"value",default:""},kind:{default:"text",values:["text","icon","checkbox","avatar","color"],aliases:["type"]},size:{default:"1",values:["1/3","1/2","1","2","3"]},text:{default:""},icon:{default:"person"},checked:{type:Boolean,default:!1},selected:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},colorClass:{default:"bg-tertiary"},avatarImageUrl:{default:""},avatarTitle:{default:""},ariaLabel:{default:""},supporting:{default:""},interactive:{type:Boolean,default:!1},sortableItem:{attribute:"sortable-item",default:""},pinned:{type:Boolean,default:!1}}}connectedCallback(){super.connectedCallback(),this._rowBound||(this._rowBound=!0,this.addEventListener("sf-after-render",()=>{const e=this.querySelector(":scope > .sf-list-item");e?.matches(l)&&b(h(e))}),this.addEventListener("keydown",e=>this.onRowKeyDown(e)),this.addEventListener("click",e=>this.onRowClick(e)),this.addEventListener("focusin",e=>{const t=this.querySelector(":scope > .sf-list-item");if(t?.matches(l)&&e.target===t&&0!==t.tabIndex){for(const e of p(h(t)))delete e.dataset.sfListCurrent;t.dataset.sfListCurrent="true",f(h(t))}}))}disconnectedCallback(){const e=this.querySelector(":scope > .sf-list-item"),t=e?.matches(l)?h(e):null;super.disconnectedCallback?.(),t&&b(t)}focusDelegate(){const e=this.querySelector(":scope > .sf-list-item");return e?.matches(l)?e:null}onRowKeyDown(e){const t=this.querySelector(":scope > .sf-list-item");if(!t?.matches(l)||e.target!==t||e.defaultPrevented||Boolean(globalThis.__sfSortableSharedV1?.session))return;if(e.altKey||e.ctrlKey||e.metaKey)return;const s=p(h(t)).filter(e=>!e.classList.contains("disabled")),a=s.indexOf(t),i={ArrowDown:s[a+1],ArrowUp:s[a-1],Home:s[0],End:s.at(-1)}[e.key];if(void 0!==i)return e.preventDefault(),void(i&&i!==t&&g(i));"Enter"===e.key&&this.interactive&&!t.hasAttribute("data-sf-sortable-item")&&(e.preventDefault(),this.activate(e))}onRowClick(e){const t=this.querySelector(":scope > .sf-list-item");if(!this.interactive||!t||!t.contains(e.target))return;const s=e.target.closest(d);if(!s||s===t||!t.contains(s)){if(t.matches(l)&&h(t)){for(const e of p(h(t)))delete e.dataset.sfListCurrent;t.dataset.sfListCurrent="true",f(h(t))}this.activate(e)}}activate(e){this.disabled||this.dispatchEvent(new CustomEvent("sf-list-item-activate",{bubbles:!0,composed:!0,detail:{value:this.itemValue,item:this,trigger:"keydown"===e?.type?"keyboard":"pointer"}}))}get supporting(){return this.getAttribute("supporting")||""}get interactive(){return this.getBooleanAttr("interactive",!1)}get sortableItem(){return this.getAttribute("sortable-item")||""}get pinned(){return this.getBooleanAttr("pinned",!1)}get componentName(){return"list-item"}get templateName(){return this.getAttribute("template")||"default"}get kind(){return this.getProp("kind")}get type(){return this.kind}get itemValue(){return this.getAttribute("value")||""}get size(){return this.getEnumAttr("size",["1/3","1/2","1","2","3"],"1")}get sizeGroup(){return m(this.size)}get text(){return this.getAttribute("text")||""}get icon(){return this.getAttribute("icon")||"person"}get checked(){return this.getBooleanAttr("checked",!1)}get selected(){return this.getBooleanAttr("selected",!1)}get disabled(){return this.getBooleanAttr("disabled",!1)}get colorClass(){return this.getAttribute("color-class")||"bg-tertiary"}get avatarImageUrl(){return this.getAttribute("avatar-image-url")||""}get avatarTitle(){return this.getAttribute("avatar-title")||this.text}get ariaLabel(){return this.getAttribute("aria-label")||""}templateContext(){const e=this.getPropsContext();return this.createTemplateContext({...e,component:this,sizeGroup:this.sizeGroup,avatarTitle:this.avatarTitle,supporting:this.supporting,interactive:this.interactive,sortableItem:this.sortableItem,pinned:this.pinned,type:this.type,value:this.itemValue,option:!1})}template(){return(0,i.Ws)(this.templateContext())}resolveUpdateMode(e=[]){return e.length>0&&!this.supporting&&!this.interactive&&!this.sortableItem&&e.every(e=>["text","aria-label","disabled","selected","checked"].includes(e))?"dom":"lit"}updateDom(e=[]){const t=this.querySelector(".sf-list-item"),s=this.querySelector(".sf-list-item-container, .sf-avatar-label-group-title, .sf-tag-container"),a=this.querySelector(".sf-checkbox input");return!!t&&(e.includes("text")&&s&&(s.textContent=this.text),e.includes("disabled")&&(t.classList.toggle("disabled",this.disabled),a&&(a.disabled=this.disabled)),e.includes("selected")&&t.classList.toggle("selected",this.selected),a&&(e.includes("checked")||e.includes("selected"))&&(a.checked=this.checked||this.selected),!0)}get value(){return{template:this.templateName,value:this.itemValue,type:this.type,size:this.size,text:this.text,icon:this.icon,checked:this.checked,selected:this.selected,disabled:this.disabled,colorClass:this.colorClass,avatarImageUrl:this.avatarImageUrl,avatarTitle:this.avatarTitle,ariaLabel:this.ariaLabel,supporting:this.supporting,interactive:this.interactive,sortableItem:this.sortableItem,pinned:this.pinned}}set value(e){if(!e||"object"!=typeof e)return;const{value:t,...s}=e;Object.prototype.hasOwnProperty.call(e,"value")&&this.setAttributeValue("value",t),this.setValueAttributes(s)}}v.define("sf-list-item"),t()}catch(y){t(y)}})},c22590307c6c(e,t,s){s.a(e,async(e,a)=>{try{s.d(t,{Ws:()=>o});var i=s("ddf1cdb42ecc"),n=(s("98e26702f55a"),e([i])),r=n.then?(await n)():n;i=r[0];function o(e){const t=!0===e.option,s=e.component?.hasSlotContent?.("text")?e.component.getSlotContent("text"):e.text,a=e.component?.hasSlotContent?.("leading")?e.component.getSlotContent("leading"):i.nothing,n=e.component?.hasSlotContent?.("trailing")?e.component.getSlotContent("trailing"):i.nothing,r=!t&&e.component?.hasSlotContent?.("supporting")?e.component.getSlotContent("supporting"):!t&&e.supporting||i.nothing,o=r!==i.nothing,l=t||e.pinned?"":e.sortableItem||"",c=!t&&Boolean(e.sortableItem||e.pinned),d=!t&&Boolean(e.interactive||l),u=["sf-list-item","flex","items-cross-center",`sf-list-item--${e.kind??e.type}`,`sf-list-item--size-${e.size}`,t?"cursor-pointer":"",e.selected?"selected":"",e.disabled?"disabled":"",o?"sf-list-item--two-line":"",!t&&e.interactive?"sf-list-item--interactive":"",c?"sf-list-item--sortable":"",!t&&e.pinned?"sf-list-item--pinned":"",e.rootClass].filter(Boolean),h=["sf-list-item-wrap","flex","flex-1"];["icon","checkbox","avatar","color"].includes(e.type)&&h.push("flex","flex-row","flex-nowrap","items-center","gap-2"),"avatar"!==e.type&&"color"!==e.type||(h.splice(h.indexOf("gap-2"),1),h.push("justify-between","gap-2"));return i.html`
     <div
-      class=${o.join(" ")}
+      class=${u.join(" ")}
       style=${e.rootStyle||i.nothing}
       role=${t?"option":i.nothing}
       tabindex=${t?"-1":i.nothing}
       data-value=${t&&e.value||i.nothing}
-      aria-label=${t&&e.ariaLabel||i.nothing}
+      aria-label=${(t||d)&&e.ariaLabel||i.nothing}
       title=${t&&e.ariaLabel||i.nothing}
-      aria-disabled=${t&&e.disabled?"true":i.nothing}
+      aria-disabled=${(t||d)&&e.disabled?"true":i.nothing}
       aria-selected=${t?e.selected?"true":"false":i.nothing}
+      data-sf-sortable-item=${l||i.nothing}
+      ?data-sf-list-roving=${d}
+      aria-current=${d&&e.selected?"true":i.nothing}
     >
-      <div class=${l.join(" ")}>
-        ${(()=>{if(s!==i.nothing)return s;if("icon"===e.type)return i.html`<i class="sf-icon" aria-hidden="true">${e.icon}</i>`;if("checkbox"===e.type)return i.html`
+      ${c?i.html`<span class="sf-list-item-handle" ?data-sf-sortable-handle=${Boolean(l)} aria-hidden="true">${l?i.html`<i class="sf-icon">drag_indicator</i>`:i.nothing}</span>`:i.nothing}
+      <div class=${h.join(" ")}>
+        ${(()=>{if(a!==i.nothing)return a;if("icon"===e.type)return i.html`<i class="sf-icon" aria-hidden="true">${e.icon}</i>`;if("checkbox"===e.type)return i.html`
         <label
           class="sf-checkbox sf-checkbox--size-${e.sizeGroup.checkbox} flex"
           aria-hidden="true"
@@ -44,9 +48,9 @@
       `}if("color"===e.type){const t=["sf-tag","sf-tag--color",`sf-tag--size-${e.sizeGroup.colorTag}`,"flex","flex-row","flex-nowrap","items-center","flex-1",e.disabled?"disabled":""].filter(Boolean);return i.html`
         <div class=${t.join(" ")}>
           <span class="sf-tag-color-icon ${e.colorClass}" aria-hidden="true"></span>
-          <span class="sf-tag-container">${a}</span>
+          <span class="sf-tag-container">${s}</span>
         </div>
-      `}return i.nothing})()} ${"color"===e.type||"avatar"===e.type?i.nothing:i.html`<div class="sf-list-item-container">${a}</div>`} ${r!==i.nothing?r:"avatar"===e.type||"color"===e.type?i.html`
+      `}return i.nothing})()} ${"color"===e.type||"avatar"===e.type?i.nothing:o?i.html`<div class="sf-list-item-container"><span class="sf-list-item-title">${s}</span><span class="sf-list-item-supporting">${r}</span></div>`:i.html`<div class="sf-list-item-container">${s}</div>`} ${n!==i.nothing?n:"avatar"===e.type||"color"===e.type?i.html`
         <label
           class="sf-checkbox sf-checkbox--size-${e.sizeGroup.checkbox} flex"
           aria-hidden="true"
@@ -64,4 +68,4 @@
       `:i.nothing}
       </div>
     </div>
-  `}s()}catch(n){s(n)}})},ddf1cdb42ecc(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("lit"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("lit")),{once:!0}))},fbe0570fcc69(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("smart-base"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("smart-base")),{once:!0}))}};const t={};function a(s){const i=t[s];if(void 0!==i)return i.exports;const r=t[s]={exports:{}};return e[s](r,r.exports,a),r.exports}(()=>{const e="function"==typeof Symbol,t=e?Symbol("webpack queues"):"__webpack_queues__",s=e?Symbol("webpack exports"):"__webpack_exports__",i=e?Symbol("webpack error"):"__webpack_error__",r=e=>{e?.d<1&&(e.d=1,e.forEach(e=>e.r--),e.forEach(e=>e.r--?e.r++:e()))};a.a=(e,a,o)=>{let l;o&&((l=[]).d=-1);const n=new Set,c=e.exports;let d,u,h;const p=new Promise((e,t)=>{h=t,u=e});p[s]=c,p[t]=e=>(l&&e(l),n.forEach(e),p.catch(e=>{})),e.exports=p;a(e=>{let a;d=(e=>e.map(e=>{if(null!==e&&"object"==typeof e){if(e[t])return e;if(e.then){const a=[];a.d=0,e.then(e=>{o[s]=e,r(a)},e=>{o[i]=e,r(a)});const o={};return o[t]=e=>e(a),o}}const a={};return a[t]=e=>{},a[s]=e,a}))(e);const o=()=>d.map(e=>{if(e[i])throw e[i];return e[s]}),c=new Promise(e=>{a=()=>e(o),a.r=0;const s=e=>e!==l&&!n.has(e)&&(n.add(e),e&&!e.d&&(a.r++,e.push(a)));d.map(e=>e[t](s))});return a.r?c:o()},e=>(e?h(p[i]=e):u(c),r(l))),l?.d<0&&(l.d=0)}})(),a.n=e=>{const t=e&&e.__esModule?()=>e.default:()=>e;return a.d(t,{a:t}),t},a.d=(e,t)=>{if(Array.isArray(t))for(var s=0;s<t.length;){var i=t[s++],r=t[s++];a.o(e,i)?0===r&&s++:0===r?Object.defineProperty(e,i,{enumerable:!0,value:t[s++]}):Object.defineProperty(e,i,{enumerable:!0,get:r})}else for(var i in t)a.o(t,i)&&!a.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);a("e4b691e01e6b")})();
+  `}a()}catch(l){a(l)}})},ddf1cdb42ecc(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("lit"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("lit")),{once:!0}))},fbe0570fcc69(e){e.exports=globalThis.SF&&globalThis.SF.runtimeModule?globalThis.SF.runtimeModule("smart-base"):new Promise(e=>globalThis.addEventListener("sf-runtime-ready",()=>e(globalThis.SF.runtimeModule("smart-base")),{once:!0}))}};const t={};function s(a){const i=t[a];if(void 0!==i)return i.exports;const n=t[a]={exports:{}};return e[a](n,n.exports,s),n.exports}(()=>{const e="function"==typeof Symbol,t=e?Symbol("webpack queues"):"__webpack_queues__",a=e?Symbol("webpack exports"):"__webpack_exports__",i=e?Symbol("webpack error"):"__webpack_error__",n=e=>{e?.d<1&&(e.d=1,e.forEach(e=>e.r--),e.forEach(e=>e.r--?e.r++:e()))};s.a=(e,s,r)=>{let o;r&&((o=[]).d=-1);const l=new Set,c=e.exports;let d,u,h;const p=new Promise((e,t)=>{h=t,u=e});p[a]=c,p[t]=e=>(o&&e(o),l.forEach(e),p.catch(e=>{})),e.exports=p;s(e=>{let s;d=(e=>e.map(e=>{if(null!==e&&"object"==typeof e){if(e[t])return e;if(e.then){const s=[];s.d=0,e.then(e=>{r[a]=e,n(s)},e=>{r[i]=e,n(s)});const r={};return r[t]=e=>e(s),r}}const s={};return s[t]=e=>{},s[a]=e,s}))(e);const r=()=>d.map(e=>{if(e[i])throw e[i];return e[a]}),c=new Promise(e=>{s=()=>e(r),s.r=0;const a=e=>e!==o&&!l.has(e)&&(l.add(e),e&&!e.d&&(s.r++,e.push(s)));d.map(e=>e[t](a))});return s.r?c:r()},e=>(e?h(p[i]=e):u(c),n(o))),o?.d<0&&(o.d=0)}})(),s.n=e=>{const t=e&&e.__esModule?()=>e.default:()=>e;return s.d(t,{a:t}),t},s.d=(e,t)=>{if(Array.isArray(t))for(var a=0;a<t.length;){var i=t[a++],n=t[a++];s.o(e,i)?0===n&&a++:0===n?Object.defineProperty(e,i,{enumerable:!0,value:t[a++]}):Object.defineProperty(e,i,{enumerable:!0,get:n})}else for(var i in t)s.o(t,i)&&!s.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})},s.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);s("e4b691e01e6b")})();

package/distr/smart/list-item/smart.manifest.json

@@ -1,9 +1,9 @@
 {
   "schema_version": 2,
   "id": "smart.list-item",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "title": "List Item",
-  "summary": "Declarative option descriptor and visual row primitive owned by Dropdown.",
+  "summary": "Declarative option descriptor owned by Dropdown, and a general list row: supporting line, interactive rows with roving focus, sf-sortable items and pinned rows.",
   "kind": "smart",
   "reuse_mode": "whole",
   "lifecycle": "experimental",
@@ -14,7 +14,10 @@
     "render",
     "theme",
     "responsive",
-    "option-descriptor"
+    "option-descriptor",
+    "list-row",
+    "roving-focus",
+    "sortable-item"
   ],
   "custom_element": "sf-list-item",
   "templates": [
@@ -106,6 +109,26 @@
           "avatar",
           "color"
         ]
+      },
+      "supporting": {
+        "type": "string",
+        "default": "",
+        "description": "A second line under the title, one step of the size ladder smaller. Not used by a Dropdown option."
+      },
+      "interactive": {
+        "type": "boolean",
+        "default": false,
+        "description": "A row a person acts on: hover, focus and selection states, one Tab stop per list with arrow keys, Home and End, and sf-list-item-activate on click or Enter."
+      },
+      "sortable-item": {
+        "type": "string",
+        "default": "",
+        "description": "The row's item id in the surrounding sf-sortable list. The row carries data-sf-sortable-item and a drag handle; the list's keyboard reordering applies."
+      },
+      "pinned": {
+        "type": "boolean",
+        "default": false,
+        "description": "A row of an sf-sortable list that does not move: no handle, not an item of the list, its handle slot kept empty so the text columns line up."
       }
     },
     "additionalProperties": false
@@ -118,22 +141,48 @@
   },
   "contracts": {
     "standalone": {
-      "const": "Non-interactive visual preview without a synthetic role or Tab stop."
+      "const": "Non-interactive visual preview without a synthetic role or Tab stop, unless interactive or sortable-item makes it a list row."
     },
     "owned_option": {
       "const": "Dropdown owns listbox semantics, focus, selection, form state and events."
     },
     "decorations": {
       "const": "Icons, avatar images, color swatches and checkbox marks do not add focus targets."
+    },
+    "list_row": {
+      "const": "An interactive or sortable row is one stop of its list (the nearest sf-sortable, listbox, list or [data-sf-list], else its parent): roving tabindex, ArrowUp/ArrowDown/Home/End between rows; a keyboard reorder in progress keeps the arrows. One-line height is the control height of the size; two-line adds one line of the step below."
     }
   },
   "methods": {},
-  "events": {},
+  "events": {
+    "sf-list-item-activate": {
+      "summary": "An interactive row was clicked or took Enter (not a control inside it, and not Enter on a row of an sf-sortable list, where Enter picks the row up).",
+      "payload": {
+        "type": "object",
+        "required": [
+          "value",
+          "trigger"
+        ],
+        "properties": {
+          "value": {
+            "type": "string"
+          },
+          "trigger": {
+            "enum": [
+              "pointer",
+              "keyboard"
+            ]
+          }
+        }
+      }
+    }
+  },
   "state": {
     "machines": {},
     "visual_states": [
       "default",
       "selected",
+      "active",
       "disabled"
     ]
   },
@@ -161,7 +210,7 @@
     "network_policy": "deny"
   },
   "accessibility": {
-    "role": "option when rendered by Dropdown; none in standalone preview",
+    "role": "option when rendered by Dropdown; none in standalone preview and list rows (the list owns the role; aria-current marks a selected row)",
     "accessible_name": "required",
     "keyboard": [
       "ArrowDown",
@@ -172,7 +221,7 @@
       "Space",
       "Escape"
     ],
-    "focus": "Owned by the parent Dropdown composite; standalone preview is not focusable."
+    "focus": "Owned by the parent Dropdown composite for options; a standalone preview is not focusable; an interactive or sortable row is a roving Tab stop of its list, with an inset focus ring."
   },
   "presentation": {
     "themes": [
@@ -237,7 +286,7 @@
     "source_artifacts": [
       {
         "path": "src/smart/list-item/index.js",
-        "sha256": "b3f5d110f37b8344f272ab111cf358dbd75bfe961e9dc41d57ca102a80fbb157"
+        "sha256": "eccf58c306ff17a33e01103ef3fba97f0dfde2e5a878e3f5eb6037583d6c9f43"
       }
     ],
     "generated_runtime": [
@@ -250,12 +299,13 @@
     ]
   },
   "ai_guidance": {
-    "use_when": "Use sf-list-item as a direct child of sf-dropdown to declare an option value and presentation.",
+    "use_when": "Use sf-list-item as a direct child of sf-dropdown to declare an option, or as a list row: supporting for a second line, interactive for a row a person acts on, sortable-item inside sf-sortable, pinned for a row that stays in place.",
     "do_not": [
       "Do not copy generated ui-smart code",
       "Do not move host data or access decisions into the component",
-      "Do not use standalone sf-list-item as a button, link or independent checkbox",
-      "Do not place independently interactive controls inside a listbox option"
+      "Do not use a standalone sf-list-item without interactive as a button, link or independent checkbox",
+      "Do not place independently interactive controls inside a listbox option",
+      "Do not put data-sf-sortable-item on the sf-list-item host: it is boxless; use sortable-item"
     ],
     "required_reads": [
       "inputs",

package/distr/smart/list-item/template/default.js

@@ -19,6 +19,18 @@ export function renderListItemTemplate(context) {
     ? context.component.getSlotContent("trailing")
     : nothing;
 
+  // A general list row (simai/ui-source#18): a second, supporting line under
+  // the title; a row a person acts on (interactive); a row of an sf-sortable
+  // list, which carries the list's item id and a drag handle, or is pinned and
+  // carries neither. None of these exist for an option, which Dropdown owns.
+  const supportingContent = !isOption && context.component?.hasSlotContent?.("supporting")
+    ? context.component.getSlotContent("supporting")
+    : (!isOption && context.supporting) || nothing;
+  const twoLine = supportingContent !== nothing;
+  const sortableItem = !isOption && !context.pinned ? context.sortableItem || "" : "";
+  const handleSlot = !isOption && Boolean(context.sortableItem || context.pinned);
+  const roving = !isOption && Boolean(context.interactive || sortableItem);
+
   const classes = [
     "sf-list-item",
     "flex",
@@ -28,6 +40,10 @@ export function renderListItemTemplate(context) {
     isOption ? "cursor-pointer" : "",
     context.selected ? "selected" : "",
     context.disabled ? "disabled" : "",
+    twoLine ? "sf-list-item--two-line" : "",
+    !isOption && context.interactive ? "sf-list-item--interactive" : "",
+    handleSlot ? "sf-list-item--sortable" : "",
+    !isOption && context.pinned ? "sf-list-item--pinned" : "",
     context.rootClass,
   ].filter(Boolean);
 
@@ -134,9 +150,19 @@ export function renderListItemTemplate(context) {
   const renderText = () => {
     if (context.type === "color") return nothing;
     if (context.type === "avatar") return nothing;
+    if (twoLine) {
+      return html`<div class="sf-list-item-container"><span class="sf-list-item-title">${textContent}</span><span class="sf-list-item-supporting">${supportingContent}</span></div>`;
+    }
     return html`<div class="sf-list-item-container">${textContent}</div>`;
   };
 
+  // The handle stands in a slot of its own before everything else; a pinned
+  // row keeps the slot empty, so its text starts where its neighbours' does.
+  const renderHandle = () => {
+    if (!handleSlot) return nothing;
+    return html`<span class="sf-list-item-handle" ?data-sf-sortable-handle=${Boolean(sortableItem)} aria-hidden="true">${sortableItem ? html`<i class="sf-icon">drag_indicator</i>` : nothing}</span>`;
+  };
+
   const renderTrailing = () => {
     if (trailingContent !== nothing) return trailingContent;
 
@@ -170,11 +196,15 @@ export function renderListItemTemplate(context) {
       role=${isOption ? "option" : nothing}
       tabindex=${isOption ? "-1" : nothing}
       data-value=${isOption ? context.value || nothing : nothing}
-      aria-label=${isOption ? context.ariaLabel || nothing : nothing}
+      aria-label=${isOption || roving ? context.ariaLabel || nothing : nothing}
       title=${isOption ? context.ariaLabel || nothing : nothing}
-      aria-disabled=${isOption && context.disabled ? "true" : nothing}
+      aria-disabled=${(isOption || roving) && context.disabled ? "true" : nothing}
       aria-selected=${isOption ? (context.selected ? "true" : "false") : nothing}
+      data-sf-sortable-item=${sortableItem || nothing}
+      ?data-sf-list-roving=${roving}
+      aria-current=${roving && context.selected ? "true" : nothing}
     >
+      ${renderHandle()}
       <div class=${wrapClasses.join(" ")}>
         ${renderLeading()} ${renderText()} ${renderTrailing()}
       </div>