@prolibu-suite/cobalt-core 0.9.4 → 0.9.5

package/dist/components/co-ref-field.js

@@ -1 +1 @@
-import{p as e,H as i,c as o,h as t,t as r}from"./index.js";import{R as s}from"./p-CWneqh4n.js";import{F as a}from"./p-C4U2tbRp.js";import{i as c,d as l}from"./p-BZIB4JDs.js";import{d as n}from"./p-Dj1EZ5qD.js";import{d as f}from"./p-BH184F0X.js";import{d}from"./p-C1Kv3zYZ.js";import{d as h}from"./p-DP0bbhfN.js";import{d as p}from"./p-gI62K3Be.js";const g=e(class e extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.coChange=o(this,"coChange",7),this.coClear=o(this,"coClear",7),this.coSearch=o(this,"coSearch",7),this.coLoadMore=o(this,"coLoadMore",7),this.coOpen=o(this,"coOpen",3),this.coClose=o(this,"coClose",3),this.coRemove=o(this,"coRemove",7),this.coFooterPrimary=o(this,"coFooterPrimary",7),this.coFooterSecondary=o(this,"coFooterSecondary",7),this.coPinToggle=o(this,"coPinToggle",7),this.coListReorder=o(this,"coListReorder",7),this.coEditSelected=o(this,"coEditSelected",7),this.required=!1,this.placeholder="Select…",this.disabled=!1,this.clearable=!0,this.editable=!1,this.editLabel="Edit",this.multiple=!1,this.status="default",this.layout="vertical",this.size="md",this.variant="default",this.value="",this.options="[]",this.selectedDisplay="[]",this.loading=!1,this.total=0,this.searchable=!0,this.searchPlaceholder="Search…",this.searchDebounce=350,this.emptyMessage="No results found",this.showFooter=!1,this.footerPrimaryLabel="Ok",this.footerSecondaryLabel="New",this.maxChips=0,this.panelTheme="auto",this.colorMode="dot",this.triggerBadgeIcon="",this.triggerBadgeLabel="",this.avatarShape="circle",this.pinnable=!1,this.listReorderable=!1,this.isOpen=!1,this.overflowCount=0,this.lastChipsKey="\0",this.pendingFocus=!1,this.handlePopoverOpen=()=>{this.isOpen=!0},this.handlePopoverClose=()=>{this.isOpen=!1},this.handleTriggerClick=e=>{this.disabled&&e.stopPropagation()},this.handleTriggerKeyDown=e=>{this.disabled||e.target===this.triggerEl&&("Enter"===e.key||" "===e.key?(e.preventDefault(),this.isOpen=!this.isOpen):"ArrowDown"!==e.key||this.isOpen||(e.preventDefault(),this.isOpen=!0))},this.handleListChange=e=>{if(!this.multiple&&null===e.value)return this.value="",this.coClear.emit(),void(this.isOpen=!1);this.handleOptionClick(e.item)},this.handleOptionClick=e=>{if(this.multiple){const i=this.parsedValue;let o;o=i.indexOf(e._id)>=0?i.filter((i=>i!==e._id)):[...i,e._id],this.value=JSON.stringify(o),this.coChange.emit({value:o,item:e})}else this.value=e._id,this.coChange.emit({value:e._id,item:e}),this.isOpen=!1},this.handleReorder=e=>{this.value=JSON.stringify(e.value),this.coChange.emit({value:e.value,item:e.item})},this.handleClear=e=>{e.stopPropagation(),this.value=this.multiple?"[]":"",this.coClear.emit()},this.handleEditClick=e=>{e.stopPropagation();const i=this.effectiveDisplayItems[0];i&&this.coEditSelected.emit(i._id)},this.handleRemoveChip=(e,i)=>{i.stopPropagation();const o=this.parsedValue.filter((i=>i!==e));this.value=JSON.stringify(o),this.coRemove.emit(e)},this.handleFooterPrimary=()=>{this.coFooterPrimary.emit(),this.isOpen=!1},this.handleFooterSecondary=()=>{this.coFooterSecondary.emit()}}get normalizedSize(){return"default"===this.size?"md":this.size}get parsedOptions(){try{const e="string"==typeof this.options?JSON.parse(this.options):this.options;return Array.isArray(e)?e:[]}catch(e){return[]}}get parsedSelectedDisplay(){try{const e="string"==typeof this.selectedDisplay?JSON.parse(this.selectedDisplay):this.selectedDisplay;return Array.isArray(e)?e:[]}catch(e){return[]}}get effectiveDisplayItems(){const e=this.parsedValue;if(0===e.length)return[];const i=new Map;for(const e of this.parsedSelectedDisplay)i.set(e._id,e);for(const e of this.parsedOptions)i.has(e._id)||i.set(e._id,{_id:e._id,label:e.label,description:e.description,color:e.color,avatar:e.avatar,image:e.image});return e.map((e=>i.get(e))).filter(Boolean)}get parsedValue(){if(!this.value)return[];try{const e=JSON.parse(this.value);return Array.isArray(e)?e:[this.value]}catch(e){return this.value?[this.value]:[]}}connectedCallback(){this.resizeObserver=new ResizeObserver((()=>this.calcOverflow()))}componentDidRender(){var e,i,o,t;this.chipsEl!==this.observedChipsEl&&(null===(e=this.resizeObserver)||void 0===e||e.disconnect(),this.chipsEl&&(null===(i=this.resizeObserver)||void 0===i||i.observe(this.chipsEl)),this.observedChipsEl=this.chipsEl);const r=null===(o=this.chipsEl)||void 0===o?void 0:o.querySelectorAll(".co-ref-field__chip"),s=r?Array.from(r,(e=>e.textContent)).join("
"):"";s!==this.lastChipsKey&&(this.lastChipsKey=s,this.calcOverflow()),this.pendingFocus&&(null===(t=this.optionListEl)||void 0===t?void 0:t.isConnected)&&(this.pendingFocus=!1,this.optionListEl.focusSearch())}disconnectedCallback(){var e;null===(e=this.resizeObserver)||void 0===e||e.disconnect()}calcOverflow(){if(!this.multiple||this.maxChips>0||!this.chipsEl)return void(0!==this.overflowCount&&(this.overflowCount=0));const e=Array.from(this.chipsEl.querySelectorAll(".co-ref-field__chip"));if(0===e.length)return void(0!==this.overflowCount&&(this.overflowCount=0));const i=this.chipsEl.getBoundingClientRect().right;let o=0;for(let t=e.length-1;t>=0&&e[t].getBoundingClientRect().right>i+1;t--)o++;o!==this.overflowCount&&(this.overflowCount=o)}onOpenChange(e){e?(this.coOpen.emit(),this.pendingFocus=!0):(this.coClose.emit(),this.restoreTriggerFocus())}restoreTriggerFocus(){var e;const i=document.activeElement;(i===this.el||this.el.contains(i))&&(null===(e=this.triggerEl)||void 0===e||e.focus())}renderTrigger(){const i=this.effectiveDisplayItems,o=i.length>0;return t("div",{class:{"co-ref-field__trigger":!0,"co-ref-field--open":this.isOpen,"co-ref-field--disabled":this.disabled,["co-ref-field--"+this.normalizedSize]:!0,["co-ref-field--"+this.status]:"default"!==this.status,"co-ref-field--flat":"flat"===this.variant},role:"combobox","aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-label":this.label||void 0,"aria-disabled":this.disabled?"true":void 0,"aria-controls":this.isOpen?e.LIST_ID:void 0,tabIndex:this.disabled?-1:0,ref:e=>this.triggerEl=e,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown},this.iconLeft&&t("span",{class:"co-ref-field__icon"},t("co-icon",{name:this.iconLeft,size:16})),t("div",{class:"co-ref-field__value"},!o&&t("span",{class:"co-ref-field__placeholder",part:"trigger-placeholder"},this.placeholder),o&&!this.multiple&&this.renderSingleValue(i[0]),o&&this.multiple&&this.renderMultipleValue(i)),o&&this.triggerBadgeIcon&&t("span",{class:"co-ref-field__trigger-badge",part:"trigger-badge",role:"img",title:this.triggerBadgeLabel||void 0,"aria-label":this.triggerBadgeLabel||void 0},t("co-icon",{name:this.triggerBadgeIcon,size:11,weight:"fill"})),o&&!this.multiple&&this.editable&&!this.disabled&&t("button",{class:"co-ref-field__edit",part:"trigger-edit",tabIndex:-1,onClick:this.handleEditClick,type:"button",title:this.editLabel||void 0,"aria-label":this.editLabel||void 0},t("co-icon",{name:"pencil-simple",size:14})),o&&this.clearable&&!this.disabled&&t("button",{class:"co-ref-field__clear",part:"trigger-clear",tabIndex:-1,onClick:this.handleClear,type:"button"},t("co-icon",{name:"x",size:14})),t("span",{class:"co-ref-field__caret",part:"trigger-chevron"},t("co-icon",{name:"caret-up-down",size:16})))}renderItemAvatar(e){return e.image||e.avatar?t("co-avatar",{class:"co-ref-field__avatar",type:e.image?"image":"text",src:e.image,text:e.avatar,color:e.color,size:"xxs",shape:this.avatarShape}):e.color?t("span",{class:"co-ref-field__color-dot",style:{backgroundColor:e.color}}):null}renderSingleValue(e){return t("div",{class:"co-ref-field__selected"},this.renderItemAvatar(e),t("span",{class:"co-ref-field__selected-label",part:"trigger-text"},e.label))}renderMultipleValue(e){const i=this.maxChips>0,o=Math.min(this.overflowCount,Math.max(0,e.length-1)),r=i?e.slice(0,this.maxChips):e,s=i?e.length-this.maxChips:o,l=e.length-(i?0:o);return t("div",{class:"co-ref-field__chips-row"},t("div",{class:"co-ref-field__chips",ref:e=>this.chipsEl=e},r.map(((e,o)=>{const r="fill"===this.colorMode&&!!e.color&&!(e.image||e.avatar);return t(a,{key:e._id,baseClass:"co-ref-field__chip",label:e.label,modifiers:{"co-ref-field__chip--avatar":!(!e.image&&!e.avatar),"co-ref-field__chip--fill":r,"co-ref-field__chip--fill-light":r&&c(e.color),"co-ref-field__chip--clipped":!i&&o>=l,["co-ref-field__chip--"+this.normalizedSize]:!0},style:r?{backgroundColor:e.color}:void 0,onRemove:i=>this.handleRemoveChip(e._id,i)},e.image||e.avatar?this.renderItemAvatar(e):e.color&&!r?t("span",{class:"co-ref-field__chip-dot",style:{backgroundColor:e.color}}):null)}))),s>0&&t("span",{class:"co-ref-field__chip-overflow"},"+",s))}renderPanel(){return t("div",{class:{"co-ref-field__panel":!0,"co-ref-field__panel--dark":"dark"===this.panelTheme,"co-ref-field__panel--light":"light"===this.panelTheme},style:this.panelWidth?{width:this.panelWidth}:void 0},t("co-option-list",{id:e.LIST_ID,ref:e=>this.optionListEl=e,items:"string"==typeof this.options?this.options:JSON.stringify(this.options),value:this.value,selectedItems:"string"==typeof this.selectedDisplay?this.selectedDisplay:JSON.stringify(this.selectedDisplay),multiple:this.multiple,selectedFirst:this.multiple,reorderable:this.multiple,pinnable:this.pinnable,listReorderable:this.listReorderable,selectedAffordance:"deselect",searchable:this.searchable,searchPlaceholder:this.searchPlaceholder,searchDebounce:this.searchDebounce,loading:this.loading,total:this.total,emptyMessage:this.emptyMessage,avatarShape:this.avatarShape,onCoSearch:e=>this.coSearch.emit(e.detail),onCoChange:e=>this.handleListChange(e.detail),onCoReorder:e=>this.handleReorder(e.detail),onCoPinToggle:e=>this.coPinToggle.emit(e.detail),onCoListReorder:e=>this.coListReorder.emit(e.detail),onCoLoadMore:()=>this.coLoadMore.emit()},t("slot",{name:"panel-footer",slot:"footer"}),this.showFooter&&t("div",{class:"co-ref-field__footer",slot:"footer"},this.footerSecondaryLabel&&t("button",{class:"co-ref-field__footer-btn co-ref-field__footer-btn--secondary",type:"button",onClick:this.handleFooterSecondary},t("co-icon",{name:"plus",size:16}),t("span",null,this.footerSecondaryLabel)),t("button",{class:"co-ref-field__footer-btn co-ref-field__footer-btn--primary",type:"button",onClick:this.handleFooterPrimary},t("co-icon",{name:"check",size:16}),t("span",null,this.footerPrimaryLabel)))))}render(){return t("div",{key:"6bfad2357faa70a7fe4d71aa61b8eaab589c26f2",class:"co-ref-field"},(this.label||this.secondaryLabel)&&t("div",{key:"0de5d626d21c9cc3d96b7c39da180369bfd2b228",class:"co-ref-field__labels"},this.label&&t("label",{key:"ae25a6e7630ce52208ae0d13c0228fa0cac9496d",class:"co-ref-field__label"},this.labelIcon&&t("co-icon",{key:"bce6b7a835f291d658eab0ca3589d39bf5ab7d5c",class:"co-ref-field__label-icon",name:this.labelIcon,size:16}),this.label,t(s,{key:"84f6a8d95f46674717e1b7e5699790b317a69a67",required:this.required})),this.secondaryLabel&&t("span",{key:"f9bbcdcb833a0347b2b2ee050e1ba58f95bb3d40",class:"co-ref-field__secondary-label"},this.secondaryLabel)),t("co-popover",{key:"18ac882e39908cd9fdda86d70ed750faca8bc8d1",open:this.isOpen,placement:"bottom-start",matchWidth:!this.panelWidth,offset:4,onCoOpen:this.handlePopoverOpen,onCoClose:this.handlePopoverClose},t("div",{key:"e542d937f4738a7199f38057986931a21fc8462f",slot:"trigger"},this.renderTrigger()),this.isOpen&&this.renderPanel()),this.helperText&&t("div",{key:"f75928e549c2c1f6f5f0589e105c00b71e85f661",class:"co-ref-field__helper co-ref-field__helper--"+this.status},"default"!==this.status&&t("co-icon",{key:"1f329a60a6b03fdfc77361c8c2287cc55369764f",name:"error"===this.status?"warning-circle":"success"===this.status?"check-circle":"info",size:14}),t("span",{key:"5fa6dbe648f63789c496081c9197eac7ac89c9b3"},this.helperText)))}get el(){return this}static get watchers(){return{isOpen:[{onOpenChange:0}]}}static get style(){return":host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1;position:relative}.co-ref-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-ref-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-ref-field__label{display:inline-flex;align-items:center;color:var(--co-ref-field-label-color, var(--co-semantic-text-secondary));font-family:var(--co-ref-field-label-font-family, var(--co-font-family-primary));font-size:var(--co-ref-field-label-font-size, var(--co-font-size-14));font-weight:var(--co-ref-field-label-font-weight, 400);line-height:1;white-space:nowrap;cursor:default;text-transform:var(--co-ref-field-label-text-transform, none);letter-spacing:var(--co-ref-field-label-letter-spacing, var(--co-font-letter-spacing-body))}.co-ref-field__secondary-label{color:var(--co-semantic-text-muted);font-family:var(--co-font-family-mono);font-size:var(--co-font-size-12);font-weight:400;line-height:1;white-space:nowrap;text-align:right}.co-ref-field__trigger{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-ref-field-trigger-bg, var(--co-semantic-surface-page));border:1px solid var(--co-ref-field-trigger-border-color, var(--co-semantic-border-field));border-radius:var(--co-border-radius-xs);min-height:40px;box-sizing:border-box;cursor:pointer;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field--flat{background:transparent;border-color:transparent}.co-ref-field--s{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--sm{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--lg{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-ref-field--open{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field__trigger:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field--disabled{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-ref-field--error{border-color:var(--co-semantic-status-error)}.co-ref-field--success{border-color:var(--co-semantic-status-success)}.co-ref-field--warning{border-color:var(--co-color-status-review)}.co-ref-field--s .co-ref-field__selected{--co-avatar-size:20px}.co-ref-field--sm .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--md .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--lg .co-ref-field__selected{--co-avatar-size:28px}.co-ref-field__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__label-icon{flex-shrink:0;margin-right:var(--co-spacing-xs);color:var(--co-semantic-text-secondary)}.co-ref-field__value{flex:1;min-width:0;display:flex;align-items:center}.co-ref-field__placeholder{color:var(--co-semantic-text-muted);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__caret{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__trigger-badge{flex-shrink:0;display:grid;place-items:center;width:18px;height:18px;border-radius:var(--co-border-radius-xxs);background:var(--co-ref-field-trigger-badge-bg, rgba(0, 0, 0, 0.22));color:var(--co-semantic-text-default)}.co-ref-field__clear{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__clear:hover{color:var(--co-semantic-text-default)}.co-ref-field__edit{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__edit:hover{color:var(--co-semantic-text-default)}.co-ref-field__selected{display:flex;align-items:center;gap:var(--co-spacing-sm);min-width:0}.co-ref-field__color-dot{width:10px;height:10px;min-width:10px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__avatar{flex-shrink:0}.co-ref-field__selected-label{color:var(--co-semantic-text-default);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__chips-row{flex:1;min-width:0;display:flex;align-items:center;gap:var(--co-spacing-xs)}.co-ref-field__chips{flex:1;min-width:0;display:flex;flex-wrap:nowrap;overflow:hidden;gap:var(--co-spacing-xs);align-items:center}.co-ref-field__chip{display:inline-flex;align-items:center;gap:var(--co-spacing-sm);padding:0 var(--co-spacing-sm2);background:var(--co-color-gray-100);border-radius:var(--co-border-radius-full);line-height:1;max-width:min(160px, 100%);flex-shrink:0}.co-ref-field__chip--avatar{padding-left:var(--co-spacing-xxs)}.co-ref-field__chip--s{min-height:20px;--co-avatar-size:20px;font-size:var(--co-font-size-12)}.co-ref-field__chip--sm{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-12)}.co-ref-field__chip--md{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-14)}.co-ref-field__chip--lg{min-height:28px;--co-avatar-size:28px;font-size:var(--co-font-size-14)}.co-ref-field__chip--clipped{visibility:hidden}.co-ref-field__chip-dot{width:8px;height:8px;min-width:8px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__chip--fill{color:var(--co-color-base-blanco);border-radius:var(--co-spacing-sm)}.co-ref-field__chip--fill-light{color:var(--co-color-base-negro)}.co-ref-field__chip--fill .co-ref-field__chip-label,.co-ref-field__chip--fill .co-ref-field__chip-remove{color:inherit}.co-ref-field__chip--fill .co-ref-field__chip-remove{opacity:0.72}.co-ref-field__chip--fill .co-ref-field__chip-remove:hover{color:inherit;opacity:1}.co-ref-field__chip-label{color:var(--co-semantic-text-default);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.co-ref-field__chip-remove{display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-color-gray-500);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out);flex-shrink:0}.co-ref-field__chip-remove:hover{color:var(--co-semantic-text-default)}.co-ref-field__chip-overflow{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:var(--co-spacing-xs) var(--co-spacing-sm);background:var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-full);font-size:var(--co-font-size-12);font-weight:600;color:var(--co-semantic-text-secondary);line-height:1}.co-ref-field__panel{display:flex;flex-direction:column;border-radius:var(--co-border-radius-sm, 12px);overflow:hidden}.co-ref-field__panel--dark{--co-semantic-surface-page:#0A0A0A;--co-semantic-surface-primary:#0A0A0A;--co-semantic-surface-hover:rgba(255, 255, 255, 0.08);--co-semantic-surface-muted:rgba(255, 255, 255, 0.12);--co-semantic-text-default:#ffffff;--co-semantic-text-secondary:rgba(255, 255, 255, 0.8);--co-semantic-text-muted:rgba(255, 255, 255, 0.5);--co-semantic-border-subtle:rgba(255, 255, 255, 0.12);--co-semantic-border-default:rgba(255, 255, 255, 0.16);background:#0A0A0A;color:#ffffff}.co-ref-field__panel--light{--co-semantic-surface-page:#ffffff;--co-semantic-surface-primary:#ffffff;--co-semantic-surface-hover:var(--co-color-gray-100, #f5f5f5);--co-semantic-surface-muted:var(--co-color-gray-200, #e5e5e5);--co-semantic-text-default:var(--co-color-gray-700, #1F1C1B);--co-semantic-text-secondary:rgba(0, 0, 0, 0.6);--co-semantic-text-muted:rgba(0, 0, 0, 0.45);--co-semantic-border-subtle:var(--co-color-gray-200, #e5e5e5);--co-semantic-border-default:var(--co-color-gray-300, #d4d4d4);background:#ffffff;color:var(--co-color-gray-700, #1F1C1B)}.co-ref-field__footer{display:flex;gap:var(--co-spacing-sm2);border-top:1px solid var(--co-semantic-border-subtle);padding:var(--co-spacing-sm2)}.co-ref-field__footer-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md);border-radius:var(--co-border-radius-xs);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12, 12px);font-weight:500;line-height:1;letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;cursor:pointer;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box;min-height:32px}.co-ref-field__footer-btn:hover{opacity:0.85}.co-ref-field__footer-btn--secondary{background:transparent;color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-default)}.co-ref-field__footer-btn--primary{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none}.co-ref-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs);font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-muted)}.co-ref-field__helper--error{color:var(--co-semantic-status-error)}.co-ref-field__helper--success{color:var(--co-semantic-status-success)}.co-ref-field__helper--warning{color:var(--co-color-status-review)}:host([layout='horizontal']) .co-ref-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-ref-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-ref-field__label{white-space:normal}:host([layout='horizontal']) .co-ref-field>:not(.co-ref-field__labels){grid-column:2;min-width:0}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}"}},[257,"co-ref-field",{label:[1],required:[4],secondaryLabel:[1,"secondary-label"],labelIcon:[513,"label-icon"],placeholder:[1],disabled:[4],clearable:[4],editable:[4],editLabel:[1,"edit-label"],multiple:[4],status:[1],helperText:[1,"helper-text"],iconLeft:[1,"icon-left"],layout:[513],size:[513],variant:[513],value:[1025],options:[1],selectedDisplay:[1,"selected-display"],loading:[4],total:[2],searchable:[4],searchPlaceholder:[1,"search-placeholder"],searchDebounce:[2,"search-debounce"],emptyMessage:[1,"empty-message"],showFooter:[4,"show-footer"],footerPrimaryLabel:[1,"footer-primary-label"],footerSecondaryLabel:[1,"footer-secondary-label"],maxChips:[2,"max-chips"],panelTheme:[1,"panel-theme"],colorMode:[1,"color-mode"],triggerBadgeIcon:[1,"trigger-badge-icon"],triggerBadgeLabel:[1,"trigger-badge-label"],panelWidth:[1,"panel-width"],avatarShape:[1,"avatar-shape"],pinnable:[4],listReorderable:[4,"list-reorderable"],isOpen:[32],overflowCount:[32]},void 0,{isOpen:[{onOpenChange:0}]}]);function m(){"undefined"!=typeof customElements&&["co-ref-field","co-avatar","co-icon","co-loader","co-option-list","co-popover","co-tooltip"].forEach((e=>{switch(e){case"co-ref-field":customElements.get(r(e))||customElements.define(r(e),g);break;case"co-avatar":customElements.get(r(e))||l();break;case"co-icon":customElements.get(r(e))||n();break;case"co-loader":customElements.get(r(e))||f();break;case"co-option-list":customElements.get(r(e))||d();break;case"co-popover":customElements.get(r(e))||h();break;case"co-tooltip":customElements.get(r(e))||p()}}))}g.LIST_ID="co-ref-field-list",m();const v=g,u=m;export{v as CoRefField,u as defineCustomElement}
+import{p as e,H as i,c as o,h as t,t as r}from"./index.js";import{R as s}from"./p-CWneqh4n.js";import{F as a}from"./p-C4U2tbRp.js";import{i as c,d as l}from"./p-BZIB4JDs.js";import{d as n}from"./p-Dj1EZ5qD.js";import{d as f}from"./p-BH184F0X.js";import{d}from"./p-C1Kv3zYZ.js";import{d as h}from"./p-DP0bbhfN.js";import{d as p}from"./p-gI62K3Be.js";const g=e(class e extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.coChange=o(this,"coChange",7),this.coClear=o(this,"coClear",7),this.coSearch=o(this,"coSearch",7),this.coLoadMore=o(this,"coLoadMore",7),this.coOpen=o(this,"coOpen",3),this.coClose=o(this,"coClose",3),this.coRemove=o(this,"coRemove",7),this.coFooterPrimary=o(this,"coFooterPrimary",7),this.coFooterSecondary=o(this,"coFooterSecondary",7),this.coPinToggle=o(this,"coPinToggle",7),this.coListReorder=o(this,"coListReorder",7),this.coEditSelected=o(this,"coEditSelected",7),this.required=!1,this.placeholder="Select…",this.disabled=!1,this.clearable=!0,this.editable=!1,this.editLabel="Edit",this.multiple=!1,this.status="default",this.layout="vertical",this.size="md",this.variant="default",this.value="",this.options="[]",this.selectedDisplay="[]",this.loading=!1,this.total=0,this.searchable=!0,this.searchPlaceholder="Search…",this.searchDebounce=350,this.emptyMessage="No results found",this.showFooter=!1,this.footerPrimaryLabel="Ok",this.footerSecondaryLabel="New",this.maxChips=0,this.panelTheme="auto",this.colorMode="dot",this.triggerBadgeIcon="",this.triggerBadgeLabel="",this.avatarShape="circle",this.pinnable=!1,this.listReorderable=!1,this.isOpen=!1,this.overflowCount=0,this.lastChipsKey="\0",this.pendingFocus=!1,this.handlePopoverOpen=()=>{this.isOpen=!0},this.handlePopoverClose=()=>{this.isOpen=!1},this.handleTriggerClick=e=>{this.disabled&&e.stopPropagation()},this.handleTriggerKeyDown=e=>{this.disabled||e.target===this.triggerEl&&("Enter"===e.key||" "===e.key?(e.preventDefault(),this.isOpen=!this.isOpen):"ArrowDown"!==e.key||this.isOpen||(e.preventDefault(),this.isOpen=!0))},this.handleListChange=e=>{if(!this.multiple&&null===e.value)return this.value="",this.coClear.emit(),void(this.isOpen=!1);this.handleOptionClick(e.item)},this.handleOptionClick=e=>{if(this.multiple){const i=this.parsedValue;let o;o=i.indexOf(e._id)>=0?i.filter((i=>i!==e._id)):[...i,e._id],this.value=JSON.stringify(o),this.coChange.emit({value:o,item:e})}else this.value=e._id,this.coChange.emit({value:e._id,item:e}),this.isOpen=!1},this.handleReorder=e=>{this.value=JSON.stringify(e.value),this.coChange.emit({value:e.value,item:e.item})},this.handleClear=e=>{e.stopPropagation(),this.value=this.multiple?"[]":"",this.coClear.emit()},this.handleEditClick=e=>{e.stopPropagation();const i=this.effectiveDisplayItems[0];i&&this.coEditSelected.emit(i._id)},this.handleRemoveChip=(e,i)=>{var o;i.stopPropagation();const t=null!==(o=this.effectiveDisplayItems.find((i=>i._id===e)))&&void 0!==o?o:{_id:e,label:e},r=this.parsedValue.filter((i=>i!==e));this.value=JSON.stringify(r),this.coRemove.emit(e),this.coChange.emit({value:r,item:t})},this.handleFooterPrimary=()=>{this.coFooterPrimary.emit(),this.isOpen=!1},this.handleFooterSecondary=()=>{this.coFooterSecondary.emit()}}get normalizedSize(){return"default"===this.size?"md":this.size}get parsedOptions(){try{const e="string"==typeof this.options?JSON.parse(this.options):this.options;return Array.isArray(e)?e:[]}catch(e){return[]}}get parsedSelectedDisplay(){try{const e="string"==typeof this.selectedDisplay?JSON.parse(this.selectedDisplay):this.selectedDisplay;return Array.isArray(e)?e:[]}catch(e){return[]}}get effectiveDisplayItems(){const e=this.parsedValue;if(0===e.length)return[];const i=new Map;for(const e of this.parsedSelectedDisplay)i.set(e._id,e);for(const e of this.parsedOptions)i.has(e._id)||i.set(e._id,{_id:e._id,label:e.label,description:e.description,color:e.color,avatar:e.avatar,image:e.image});return e.map((e=>i.get(e))).filter(Boolean)}get parsedValue(){if(!this.value)return[];try{const e=JSON.parse(this.value);return Array.isArray(e)?e:[this.value]}catch(e){return this.value?[this.value]:[]}}connectedCallback(){this.resizeObserver=new ResizeObserver((()=>this.calcOverflow()))}componentDidRender(){var e,i,o,t;this.chipsEl!==this.observedChipsEl&&(null===(e=this.resizeObserver)||void 0===e||e.disconnect(),this.chipsEl&&(null===(i=this.resizeObserver)||void 0===i||i.observe(this.chipsEl)),this.observedChipsEl=this.chipsEl);const r=null===(o=this.chipsEl)||void 0===o?void 0:o.querySelectorAll(".co-ref-field__chip"),s=r?Array.from(r,(e=>e.textContent)).join("
"):"";s!==this.lastChipsKey&&(this.lastChipsKey=s,this.calcOverflow()),this.pendingFocus&&(null===(t=this.optionListEl)||void 0===t?void 0:t.isConnected)&&(this.pendingFocus=!1,this.optionListEl.focusSearch())}disconnectedCallback(){var e;null===(e=this.resizeObserver)||void 0===e||e.disconnect()}calcOverflow(){if(!this.multiple||this.maxChips>0||!this.chipsEl)return void(0!==this.overflowCount&&(this.overflowCount=0));const e=Array.from(this.chipsEl.querySelectorAll(".co-ref-field__chip"));if(0===e.length)return void(0!==this.overflowCount&&(this.overflowCount=0));const i=this.chipsEl.getBoundingClientRect().right;let o=0;for(let t=e.length-1;t>=0&&e[t].getBoundingClientRect().right>i+1;t--)o++;o!==this.overflowCount&&(this.overflowCount=o)}onOpenChange(e){e?(this.coOpen.emit(),this.pendingFocus=!0):(this.coClose.emit(),this.restoreTriggerFocus())}restoreTriggerFocus(){var e;const i=document.activeElement;(i===this.el||this.el.contains(i))&&(null===(e=this.triggerEl)||void 0===e||e.focus())}renderTrigger(){const i=this.effectiveDisplayItems,o=i.length>0;return t("div",{class:{"co-ref-field__trigger":!0,"co-ref-field--open":this.isOpen,"co-ref-field--disabled":this.disabled,["co-ref-field--"+this.normalizedSize]:!0,["co-ref-field--"+this.status]:"default"!==this.status,"co-ref-field--flat":"flat"===this.variant},role:"combobox","aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-label":this.label||void 0,"aria-disabled":this.disabled?"true":void 0,"aria-controls":this.isOpen?e.LIST_ID:void 0,tabIndex:this.disabled?-1:0,ref:e=>this.triggerEl=e,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown},this.iconLeft&&t("span",{class:"co-ref-field__icon"},t("co-icon",{name:this.iconLeft,size:16})),t("div",{class:"co-ref-field__value"},!o&&t("span",{class:"co-ref-field__placeholder",part:"trigger-placeholder"},this.placeholder),o&&!this.multiple&&this.renderSingleValue(i[0]),o&&this.multiple&&this.renderMultipleValue(i)),o&&this.triggerBadgeIcon&&t("span",{class:"co-ref-field__trigger-badge",part:"trigger-badge",role:"img",title:this.triggerBadgeLabel||void 0,"aria-label":this.triggerBadgeLabel||void 0},t("co-icon",{name:this.triggerBadgeIcon,size:11,weight:"fill"})),o&&!this.multiple&&this.editable&&!this.disabled&&t("button",{class:"co-ref-field__edit",part:"trigger-edit",tabIndex:-1,onClick:this.handleEditClick,type:"button",title:this.editLabel||void 0,"aria-label":this.editLabel||void 0},t("co-icon",{name:"pencil-simple",size:14})),o&&this.clearable&&!this.disabled&&t("button",{class:"co-ref-field__clear",part:"trigger-clear",tabIndex:-1,onClick:this.handleClear,type:"button"},t("co-icon",{name:"x",size:14})),t("span",{class:"co-ref-field__caret",part:"trigger-chevron"},t("co-icon",{name:"caret-up-down",size:16})))}renderItemAvatar(e){return e.image||e.avatar?t("co-avatar",{class:"co-ref-field__avatar",type:e.image?"image":"text",src:e.image,text:e.avatar,color:e.color,size:"xxs",shape:this.avatarShape}):e.color?t("span",{class:"co-ref-field__color-dot",style:{backgroundColor:e.color}}):null}renderSingleValue(e){return t("div",{class:"co-ref-field__selected"},this.renderItemAvatar(e),t("span",{class:"co-ref-field__selected-label",part:"trigger-text"},e.label))}renderMultipleValue(e){const i=this.maxChips>0,o=Math.min(this.overflowCount,Math.max(0,e.length-1)),r=i?e.slice(0,this.maxChips):e,s=i?e.length-this.maxChips:o,l=e.length-(i?0:o);return t("div",{class:"co-ref-field__chips-row"},t("div",{class:"co-ref-field__chips",ref:e=>this.chipsEl=e},r.map(((e,o)=>{const r="fill"===this.colorMode&&!!e.color&&!(e.image||e.avatar);return t(a,{key:e._id,baseClass:"co-ref-field__chip",label:e.label,modifiers:{"co-ref-field__chip--avatar":!(!e.image&&!e.avatar),"co-ref-field__chip--fill":r,"co-ref-field__chip--fill-light":r&&c(e.color),"co-ref-field__chip--clipped":!i&&o>=l,["co-ref-field__chip--"+this.normalizedSize]:!0},style:r?{backgroundColor:e.color}:void 0,onRemove:i=>this.handleRemoveChip(e._id,i)},e.image||e.avatar?this.renderItemAvatar(e):e.color&&!r?t("span",{class:"co-ref-field__chip-dot",style:{backgroundColor:e.color}}):null)}))),s>0&&t("span",{class:"co-ref-field__chip-overflow"},"+",s))}renderPanel(){return t("div",{class:{"co-ref-field__panel":!0,"co-ref-field__panel--dark":"dark"===this.panelTheme,"co-ref-field__panel--light":"light"===this.panelTheme},style:this.panelWidth?{width:this.panelWidth}:void 0},t("co-option-list",{id:e.LIST_ID,ref:e=>this.optionListEl=e,items:"string"==typeof this.options?this.options:JSON.stringify(this.options),value:this.value,selectedItems:"string"==typeof this.selectedDisplay?this.selectedDisplay:JSON.stringify(this.selectedDisplay),multiple:this.multiple,selectedFirst:this.multiple,reorderable:this.multiple,pinnable:this.pinnable,listReorderable:this.listReorderable,selectedAffordance:"deselect",searchable:this.searchable,searchPlaceholder:this.searchPlaceholder,searchDebounce:this.searchDebounce,loading:this.loading,total:this.total,emptyMessage:this.emptyMessage,avatarShape:this.avatarShape,onCoSearch:e=>this.coSearch.emit(e.detail),onCoChange:e=>this.handleListChange(e.detail),onCoReorder:e=>this.handleReorder(e.detail),onCoPinToggle:e=>this.coPinToggle.emit(e.detail),onCoListReorder:e=>this.coListReorder.emit(e.detail),onCoLoadMore:()=>this.coLoadMore.emit()},t("slot",{name:"panel-footer",slot:"footer"}),this.showFooter&&t("div",{class:"co-ref-field__footer",slot:"footer"},this.footerSecondaryLabel&&t("button",{class:"co-ref-field__footer-btn co-ref-field__footer-btn--secondary",type:"button",onClick:this.handleFooterSecondary},t("co-icon",{name:"plus",size:16}),t("span",null,this.footerSecondaryLabel)),t("button",{class:"co-ref-field__footer-btn co-ref-field__footer-btn--primary",type:"button",onClick:this.handleFooterPrimary},t("co-icon",{name:"check",size:16}),t("span",null,this.footerPrimaryLabel)))))}render(){return t("div",{key:"8904995ce46d0552556775029316fa42c0d1261e",class:"co-ref-field"},(this.label||this.secondaryLabel)&&t("div",{key:"a3b1d77f18f04b0233d5cf9c5b18c484b60d06e4",class:"co-ref-field__labels"},this.label&&t("label",{key:"837c1f52807a6b258874d4984fdd3aafd48737ed",class:"co-ref-field__label"},this.labelIcon&&t("co-icon",{key:"c9e74495eac50df1f9f074f3a25b3be7bcf36d1c",class:"co-ref-field__label-icon",name:this.labelIcon,size:16}),this.label,t(s,{key:"49a4366d6fc20c7ddbad31d020a1d45ea4134554",required:this.required})),this.secondaryLabel&&t("span",{key:"4f9dd9e68d79642cfafd16a71e51747599668f9e",class:"co-ref-field__secondary-label"},this.secondaryLabel)),t("co-popover",{key:"91ad529d27a62ccbcb8acac7f23cee7ac2ca33ce",open:this.isOpen,placement:"bottom-start",matchWidth:!this.panelWidth,offset:4,onCoOpen:this.handlePopoverOpen,onCoClose:this.handlePopoverClose},t("div",{key:"809b6f7e0f64ffd7c6151c1fae340114f5887e72",slot:"trigger"},this.renderTrigger()),this.isOpen&&this.renderPanel()),this.helperText&&t("div",{key:"4089f6e3cd993ce620742d619282d12542e87057",class:"co-ref-field__helper co-ref-field__helper--"+this.status},"default"!==this.status&&t("co-icon",{key:"3d9e658ba0cc04034778911930837f1268afeedd",name:"error"===this.status?"warning-circle":"success"===this.status?"check-circle":"info",size:14}),t("span",{key:"8c26be0575794b6f8b410f1fd0b71efd715d5324"},this.helperText)))}get el(){return this}static get watchers(){return{isOpen:[{onOpenChange:0}]}}static get style(){return":host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1;position:relative}.co-ref-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-ref-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-ref-field__label{display:inline-flex;align-items:center;color:var(--co-ref-field-label-color, var(--co-semantic-text-secondary));font-family:var(--co-ref-field-label-font-family, var(--co-font-family-primary));font-size:var(--co-ref-field-label-font-size, var(--co-font-size-14));font-weight:var(--co-ref-field-label-font-weight, 400);line-height:1;white-space:nowrap;cursor:default;text-transform:var(--co-ref-field-label-text-transform, none);letter-spacing:var(--co-ref-field-label-letter-spacing, var(--co-font-letter-spacing-body))}.co-ref-field__secondary-label{color:var(--co-semantic-text-muted);font-family:var(--co-font-family-mono);font-size:var(--co-font-size-12);font-weight:400;line-height:1;white-space:nowrap;text-align:right}.co-ref-field__trigger{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-ref-field-trigger-bg, var(--co-semantic-surface-page));border:1px solid var(--co-ref-field-trigger-border-color, var(--co-semantic-border-field));border-radius:var(--co-border-radius-xs);min-height:40px;box-sizing:border-box;cursor:pointer;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field--flat{background:transparent;border-color:transparent}.co-ref-field--s{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--sm{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--lg{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-ref-field--open{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field__trigger:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field--disabled{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-ref-field--error{border-color:var(--co-semantic-status-error)}.co-ref-field--success{border-color:var(--co-semantic-status-success)}.co-ref-field--warning{border-color:var(--co-color-status-review)}.co-ref-field--s .co-ref-field__selected{--co-avatar-size:20px}.co-ref-field--sm .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--md .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--lg .co-ref-field__selected{--co-avatar-size:28px}.co-ref-field__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__label-icon{flex-shrink:0;margin-right:var(--co-spacing-xs);color:var(--co-semantic-text-secondary)}.co-ref-field__value{flex:1;min-width:0;display:flex;align-items:center}.co-ref-field__placeholder{color:var(--co-semantic-text-muted);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__caret{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__trigger-badge{flex-shrink:0;display:grid;place-items:center;width:18px;height:18px;border-radius:var(--co-border-radius-xxs);background:var(--co-ref-field-trigger-badge-bg, rgba(0, 0, 0, 0.22));color:var(--co-semantic-text-default)}.co-ref-field__clear{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__clear:hover{color:var(--co-semantic-text-default)}.co-ref-field__edit{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__edit:hover{color:var(--co-semantic-text-default)}.co-ref-field__selected{display:flex;align-items:center;gap:var(--co-spacing-sm);min-width:0}.co-ref-field__color-dot{width:10px;height:10px;min-width:10px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__avatar{flex-shrink:0}.co-ref-field__selected-label{color:var(--co-semantic-text-default);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__chips-row{flex:1;min-width:0;display:flex;align-items:center;gap:var(--co-spacing-xs)}.co-ref-field__chips{flex:1;min-width:0;display:flex;flex-wrap:nowrap;overflow:hidden;gap:var(--co-spacing-xs);align-items:center}.co-ref-field__chip{display:inline-flex;align-items:center;gap:var(--co-spacing-sm);padding:0 var(--co-spacing-sm2);background:var(--co-color-gray-100);border-radius:var(--co-border-radius-full);line-height:1;max-width:min(160px, 100%);flex-shrink:0}.co-ref-field__chip--avatar{padding-left:var(--co-spacing-xxs)}.co-ref-field__chip--s{min-height:20px;--co-avatar-size:20px;font-size:var(--co-font-size-12)}.co-ref-field__chip--sm{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-12)}.co-ref-field__chip--md{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-14)}.co-ref-field__chip--lg{min-height:28px;--co-avatar-size:28px;font-size:var(--co-font-size-14)}.co-ref-field__chip--clipped{visibility:hidden}.co-ref-field__chip-dot{width:8px;height:8px;min-width:8px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__chip--fill{color:var(--co-color-base-blanco);border-radius:var(--co-spacing-sm)}.co-ref-field__chip--fill-light{color:var(--co-color-base-negro)}.co-ref-field__chip--fill .co-ref-field__chip-label,.co-ref-field__chip--fill .co-ref-field__chip-remove{color:inherit}.co-ref-field__chip--fill .co-ref-field__chip-remove{opacity:0.72}.co-ref-field__chip--fill .co-ref-field__chip-remove:hover{color:inherit;opacity:1}.co-ref-field__chip-label{color:var(--co-semantic-text-default);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.co-ref-field__chip-remove{display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-color-gray-500);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out);flex-shrink:0}.co-ref-field__chip-remove:hover{color:var(--co-semantic-text-default)}.co-ref-field__chip-overflow{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:var(--co-spacing-xs) var(--co-spacing-sm);background:var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-full);font-size:var(--co-font-size-12);font-weight:600;color:var(--co-semantic-text-secondary);line-height:1}.co-ref-field__panel{display:flex;flex-direction:column;border-radius:var(--co-border-radius-sm, 12px);overflow:hidden}.co-ref-field__panel--dark{--co-semantic-surface-page:#0A0A0A;--co-semantic-surface-primary:#0A0A0A;--co-semantic-surface-hover:rgba(255, 255, 255, 0.08);--co-semantic-surface-muted:rgba(255, 255, 255, 0.12);--co-semantic-text-default:#ffffff;--co-semantic-text-secondary:rgba(255, 255, 255, 0.8);--co-semantic-text-muted:rgba(255, 255, 255, 0.5);--co-semantic-border-subtle:rgba(255, 255, 255, 0.12);--co-semantic-border-default:rgba(255, 255, 255, 0.16);background:#0A0A0A;color:#ffffff}.co-ref-field__panel--light{--co-semantic-surface-page:#ffffff;--co-semantic-surface-primary:#ffffff;--co-semantic-surface-hover:var(--co-color-gray-100, #f5f5f5);--co-semantic-surface-muted:var(--co-color-gray-200, #e5e5e5);--co-semantic-text-default:var(--co-color-gray-700, #1F1C1B);--co-semantic-text-secondary:rgba(0, 0, 0, 0.6);--co-semantic-text-muted:rgba(0, 0, 0, 0.45);--co-semantic-border-subtle:var(--co-color-gray-200, #e5e5e5);--co-semantic-border-default:var(--co-color-gray-300, #d4d4d4);background:#ffffff;color:var(--co-color-gray-700, #1F1C1B)}.co-ref-field__footer{display:flex;gap:var(--co-spacing-sm2);border-top:1px solid var(--co-semantic-border-subtle);padding:var(--co-spacing-sm2)}.co-ref-field__footer-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md);border-radius:var(--co-border-radius-xs);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12, 12px);font-weight:500;line-height:1;letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;cursor:pointer;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box;min-height:32px}.co-ref-field__footer-btn:hover{opacity:0.85}.co-ref-field__footer-btn--secondary{background:transparent;color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-default)}.co-ref-field__footer-btn--primary{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none}.co-ref-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs);font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-muted)}.co-ref-field__helper--error{color:var(--co-semantic-status-error)}.co-ref-field__helper--success{color:var(--co-semantic-status-success)}.co-ref-field__helper--warning{color:var(--co-color-status-review)}:host([layout='horizontal']) .co-ref-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-ref-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-ref-field__label{white-space:normal}:host([layout='horizontal']) .co-ref-field>:not(.co-ref-field__labels){grid-column:2;min-width:0}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}"}},[257,"co-ref-field",{label:[1],required:[4],secondaryLabel:[1,"secondary-label"],labelIcon:[513,"label-icon"],placeholder:[1],disabled:[4],clearable:[4],editable:[4],editLabel:[1,"edit-label"],multiple:[4],status:[1],helperText:[1,"helper-text"],iconLeft:[1,"icon-left"],layout:[513],size:[513],variant:[513],value:[1025],options:[1],selectedDisplay:[1,"selected-display"],loading:[4],total:[2],searchable:[4],searchPlaceholder:[1,"search-placeholder"],searchDebounce:[2,"search-debounce"],emptyMessage:[1,"empty-message"],showFooter:[4,"show-footer"],footerPrimaryLabel:[1,"footer-primary-label"],footerSecondaryLabel:[1,"footer-secondary-label"],maxChips:[2,"max-chips"],panelTheme:[1,"panel-theme"],colorMode:[1,"color-mode"],triggerBadgeIcon:[1,"trigger-badge-icon"],triggerBadgeLabel:[1,"trigger-badge-label"],panelWidth:[1,"panel-width"],avatarShape:[1,"avatar-shape"],pinnable:[4],listReorderable:[4,"list-reorderable"],isOpen:[32],overflowCount:[32]},void 0,{isOpen:[{onOpenChange:0}]}]);function m(){"undefined"!=typeof customElements&&["co-ref-field","co-avatar","co-icon","co-loader","co-option-list","co-popover","co-tooltip"].forEach((e=>{switch(e){case"co-ref-field":customElements.get(r(e))||customElements.define(r(e),g);break;case"co-avatar":customElements.get(r(e))||l();break;case"co-icon":customElements.get(r(e))||n();break;case"co-loader":customElements.get(r(e))||f();break;case"co-option-list":customElements.get(r(e))||d();break;case"co-popover":customElements.get(r(e))||h();break;case"co-tooltip":customElements.get(r(e))||p()}}))}g.LIST_ID="co-ref-field-list",m();const v=g,u=m;export{v as CoRefField,u as defineCustomElement}

package/dist/esm/co-file-field.entry.js

@@ -129,7 +129,7 @@ function previewSrc(item) {
     return hasImageExtension(item) ? item.url || item.thumbnail : item.thumbnail || item.url;
 }
 
-const coFileFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-file-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs)}.co-file-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;line-height:1;white-space:nowrap;cursor:default}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}.co-file-field__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-md);padding:var(--co-spacing-4xl) var(--co-spacing-2xl);background:color-mix(in srgb, var(--co-semantic-surface-hover) 55%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));border:1px dashed var(--co-semantic-border-field);border-radius:var(--co-border-radius-sm);cursor:pointer;text-align:center;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__dropzone:hover{border-color:var(--co-semantic-border-focus)}.co-file-field__dropzone--drag{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__upload-btn{display:inline-flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-md) var(--co-spacing-xl);margin-bottom:var(--co-spacing-xs);background:var(--co-semantic-surface-secondary);color:var(--co-semantic-text-default);border:none;border-radius:var(--co-border-radius-full);box-shadow:var(--co-shadow-lg);font-family:inherit;font-size:var(--co-font-size-16);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;cursor:pointer;transition:box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__upload-btn:hover{box-shadow:var(--co-shadow-xl, var(--co-shadow-lg));transform:translateY(-1px)}.co-file-field__upload-btn co-icon{display:inline-flex;flex-shrink:0}.co-file-field__dropzone-text{color:var(--co-semantic-text-default);font-size:var(--co-font-size-18);line-height:1.25}.co-file-field__dropzone-hint{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);line-height:1.25}.co-file-field__actions{display:contents}.co-file-field__input{display:none}.co-file-field__uploaded{display:flex;flex-direction:column;gap:var(--co-spacing-lg);margin-top:var(--co-spacing-sm2)}.co-file-field__uploaded-title{color:var(--co-semantic-text-default);font-size:var(--co-font-size-22);font-weight:500;letter-spacing:-0.03em;line-height:1.25}.co-file-field__previews{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 180px));gap:var(--co-spacing-md)}.co-file-field__preview{padding:0;border:none;border-radius:var(--co-border-radius-sm);overflow:hidden;aspect-ratio:3 / 2;background:var(--co-semantic-surface-hover);cursor:pointer}.co-file-field__preview img{display:block;width:100%;height:100%;object-fit:cover;transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__preview:hover img{transform:scale(1.02)}.co-file-field__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__row{display:flex;align-items:center;gap:var(--co-spacing-lg);padding:var(--co-spacing-xl);background:var(--co-semantic-surface-hover);border:1px solid transparent;border-radius:var(--co-border-radius-sm)}.co-file-field__row--error{border-color:var(--co-semantic-status-error)}.co-file-field__row--dragging{opacity:0.5}.co-file-field__row--drop-target{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__drag-handle{flex-shrink:0;display:flex;align-items:center;color:var(--co-semantic-text-secondary);cursor:grab}.co-file-field__drag-handle:active{cursor:grabbing}.co-file-field__row-icon{flex-shrink:0;color:var(--co-semantic-text-secondary);display:flex;align-items:center}.co-file-field__row--error .co-file-field__row-icon{color:var(--co-semantic-status-error)}.co-file-field__row-icon--spin{animation:co-file-spin 0.8s linear infinite}@keyframes co-file-spin{to{transform:rotate(360deg)}}.co-file-field__row-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--co-spacing-xs)}.co-file-field__row-name{color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-file-field__row-error{color:var(--co-semantic-status-error);font-size:var(--co-font-size-12)}.co-file-field__row-size{flex-shrink:0;color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1;white-space:nowrap}.co-file-field__progress{position:relative;height:4px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-hover);overflow:hidden}.co-file-field__progress-bar{position:absolute;inset:0;width:40%;border-radius:var(--co-border-radius-full);background:var(--co-semantic-status-info);transition:width var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__progress-bar:not([style]){animation:co-file-indeterminate 1.2s ease-in-out infinite}@keyframes co-file-indeterminate{0%{left:-40%}100%{left:100%}}.co-file-field__action{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-secondary);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__action:hover{color:var(--co-semantic-text-default)}.co-file-field__action--copied,.co-file-field__action--copied:hover{color:var(--co-color-primary-verde)}.co-file-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-file-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-file-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);line-height:1}.co-file-field--disabled{opacity:0.6;pointer-events:none}.co-file-field--invalid .co-file-field__dropzone,.co-file-field--error .co-file-field__dropzone{border-color:var(--co-semantic-status-error)}.co-file-field__helper--error .co-file-field__helper-icon,.co-file-field__helper--error .co-file-field__helper-text{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-file-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-file-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-file-field__label{white-space:normal}:host([layout='horizontal']) .co-file-field>:not(.co-file-field__labels){grid-column:2;min-width:0}@supports not (background: color-mix(in srgb, red, transparent)){.co-file-field__dropzone{background:var(--co-semantic-surface-hover)}}`;
+const coFileFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-file-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs)}.co-file-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;line-height:1;white-space:nowrap;cursor:default}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}.co-file-field__dropzone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--co-spacing-md);padding:var(--co-spacing-4xl) var(--co-spacing-2xl);background:color-mix(in srgb, var(--co-semantic-surface-hover) 55%, transparent);-webkit-backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));backdrop-filter:blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate));border:1px dashed var(--co-semantic-border-field);border-radius:var(--co-border-radius-sm);cursor:pointer;text-align:center;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__dropzone:hover{border-color:var(--co-semantic-border-focus)}.co-file-field__dropzone--drag{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__upload-btn{display:inline-flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-md) var(--co-spacing-xl);margin-bottom:var(--co-spacing-xs);background:var(--co-semantic-surface-secondary);color:var(--co-semantic-text-default);border:none;border-radius:var(--co-border-radius-full);box-shadow:var(--co-shadow-lg);font-family:inherit;font-size:var(--co-font-size-16);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);line-height:1;cursor:pointer;transition:box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out), transform var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__upload-btn:hover{box-shadow:var(--co-shadow-xl, var(--co-shadow-lg));transform:translateY(-1px)}.co-file-field__upload-btn co-icon{display:inline-flex;flex-shrink:0}.co-file-field__dropzone-text{color:var(--co-semantic-text-default);font-size:var(--co-font-size-18);line-height:1.25}.co-file-field__dropzone-hint{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);line-height:1.25}.co-file-field__actions{display:contents}.co-file-field__input{display:none}.co-file-field__uploaded{display:flex;flex-direction:column;gap:var(--co-spacing-lg);margin-top:var(--co-spacing-sm2)}.co-file-field__uploaded-title{color:var(--co-semantic-text-default);font-size:var(--co-font-size-22);font-weight:500;letter-spacing:-0.03em;line-height:1.25}.co-file-field__previews{display:grid;grid-template-columns:repeat(auto-fill, minmax(150px, 180px));gap:var(--co-spacing-md)}.co-file-field__preview{padding:0;border:none;border-radius:var(--co-border-radius-sm);overflow:hidden;aspect-ratio:3 / 2;background:var(--co-semantic-surface-hover);cursor:pointer}.co-file-field__preview img{display:block;width:100%;height:100%;object-fit:cover;transition:transform var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__preview:hover img{transform:scale(1.02)}.co-file-field__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-file-field__row{display:flex;align-items:center;gap:var(--co-spacing-lg);padding:var(--co-spacing-xl);background:var(--co-semantic-surface-hover);border:1px solid transparent;border-radius:var(--co-border-radius-sm)}.co-file-field__row--error{border-color:var(--co-semantic-status-error)}.co-file-field__row--dragging{opacity:0.5}.co-file-field__row--drop-target{border-color:var(--co-semantic-border-focus);background:var(--co-semantic-surface-hover)}.co-file-field__drag-handle{flex-shrink:0;display:flex;align-items:center;color:var(--co-semantic-text-secondary);cursor:grab}.co-file-field__drag-handle:active{cursor:grabbing}.co-file-field__row-icon{flex-shrink:0;color:var(--co-semantic-text-secondary);display:flex;align-items:center}.co-file-field__row--error .co-file-field__row-icon{color:var(--co-semantic-status-error)}.co-file-field__row-icon--spin{animation:co-file-spin 0.8s linear infinite}@keyframes co-file-spin{to{transform:rotate(360deg)}}.co-file-field__row-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--co-spacing-xs)}.co-file-field__row-name{color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-file-field__row-error{color:var(--co-semantic-status-error);font-size:var(--co-font-size-12)}.co-file-field__row-size{flex-shrink:0;color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);line-height:1;white-space:nowrap}.co-file-field__progress{position:relative;height:4px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-hover);overflow:hidden}.co-file-field__progress-bar{position:absolute;inset:0;width:40%;border-radius:var(--co-border-radius-full);background:var(--co-semantic-status-info);transition:width var(--co-motion-duration-base) var(--co-motion-ease-out)}.co-file-field__progress-bar:not([style]){animation:co-file-indeterminate 1.2s ease-in-out infinite}@keyframes co-file-indeterminate{0%{left:-40%}100%{left:100%}}.co-file-field__action{flex-shrink:0;display:flex;align-items:center;justify-content:center;padding:0;border:none;background:transparent;cursor:pointer;text-decoration:none;color:var(--co-semantic-text-secondary);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-file-field__action:hover{color:var(--co-semantic-text-default)}.co-file-field__action--copied,.co-file-field__action--copied:hover{color:var(--co-color-primary-verde)}.co-file-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-file-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-file-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);line-height:1}.co-file-field--disabled{opacity:0.6;pointer-events:none}.co-file-field--invalid .co-file-field__dropzone,.co-file-field--error .co-file-field__dropzone{border-color:var(--co-semantic-status-error)}.co-file-field__helper--error .co-file-field__helper-icon,.co-file-field__helper--error .co-file-field__helper-text{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-file-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-file-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-file-field__label{white-space:normal}:host([layout='horizontal']) .co-file-field>:not(.co-file-field__labels){grid-column:2;min-width:0}@supports not (background: color-mix(in srgb, red, transparent)){.co-file-field__dropzone{background:var(--co-semantic-surface-hover)}}`;
 
 const CoFileField = class {
     constructor(hostRef) {

package/dist/esm/co-ref-field.entry.js

@@ -188,10 +188,22 @@ const CoRefField = class {
                 this.coEditSelected.emit(selected._id);
         };
         this.handleRemoveChip = (id, e) => {
+            var _a;
             e.stopPropagation();
+            // `?? {_id, label:id}`: el chip quitado SIEMPRE está en la lista que los
+            // pinta, pero `find` es `T | undefined` para el compilador — y un item
+            // con el id crudo es mejor payload que romper el tipo del evento.
+            const removed = (_a = this.effectiveDisplayItems.find((o) => o._id === id)) !== null && _a !== void 0 ? _a : { _id: id, label: id };
             const newValue = this.parsedValue.filter((v) => v !== id);
             this.value = JSON.stringify(newValue);
             this.coRemove.emit(id);
+            // …y TAMBIÉN por el contrato normal de cambio. `coRemove` sólo lleva el id
+            // quitado, así que un host que escuche el evento estándar (lo natural: es
+            // el mismo cambio de selección que un deselect del panel, que sí emite
+            // coChange) no se enteraba: el chip desaparecía de la pantalla y el modelo
+            // del host quedaba intacto. Emitir ambos mantiene la compatibilidad de
+            // `coRemove` y quita la trampa.
+            this.coChange.emit({ value: newValue, item: removed });
         };
         this.handleFooterPrimary = () => {
             this.coFooterPrimary.emit();
@@ -421,7 +433,7 @@ const CoRefField = class {
     }
     // ── Main render ────────────────────────────────────────────
     render() {
-        return (h("div", { key: '6bfad2357faa70a7fe4d71aa61b8eaab589c26f2', class: "co-ref-field" }, (this.label || this.secondaryLabel) && (h("div", { key: '0de5d626d21c9cc3d96b7c39da180369bfd2b228', class: "co-ref-field__labels" }, this.label && (h("label", { key: 'ae25a6e7630ce52208ae0d13c0228fa0cac9496d', class: "co-ref-field__label" }, this.labelIcon && (h("co-icon", { key: 'bce6b7a835f291d658eab0ca3589d39bf5ab7d5c', class: "co-ref-field__label-icon", name: this.labelIcon, size: 16 })), this.label, h(RequiredMark, { key: '84f6a8d95f46674717e1b7e5699790b317a69a67', required: this.required }))), this.secondaryLabel && (h("span", { key: 'f9bbcdcb833a0347b2b2ee050e1ba58f95bb3d40', class: "co-ref-field__secondary-label" }, this.secondaryLabel)))), h("co-popover", { key: '18ac882e39908cd9fdda86d70ed750faca8bc8d1', open: this.isOpen, placement: "bottom-start", matchWidth: !this.panelWidth, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: 'e542d937f4738a7199f38057986931a21fc8462f', slot: "trigger" }, this.renderTrigger()), this.isOpen && this.renderPanel()), this.helperText && (h("div", { key: 'f75928e549c2c1f6f5f0589e105c00b71e85f661', class: `co-ref-field__helper co-ref-field__helper--${this.status}` }, this.status !== 'default' && (h("co-icon", { key: '1f329a60a6b03fdfc77361c8c2287cc55369764f', name: this.status === 'error' ? 'warning-circle' : this.status === 'success' ? 'check-circle' : 'info', size: 14 })), h("span", { key: '5fa6dbe648f63789c496081c9197eac7ac89c9b3' }, this.helperText)))));
+        return (h("div", { key: '8904995ce46d0552556775029316fa42c0d1261e', class: "co-ref-field" }, (this.label || this.secondaryLabel) && (h("div", { key: 'a3b1d77f18f04b0233d5cf9c5b18c484b60d06e4', class: "co-ref-field__labels" }, this.label && (h("label", { key: '837c1f52807a6b258874d4984fdd3aafd48737ed', class: "co-ref-field__label" }, this.labelIcon && (h("co-icon", { key: 'c9e74495eac50df1f9f074f3a25b3be7bcf36d1c', class: "co-ref-field__label-icon", name: this.labelIcon, size: 16 })), this.label, h(RequiredMark, { key: '49a4366d6fc20c7ddbad31d020a1d45ea4134554', required: this.required }))), this.secondaryLabel && (h("span", { key: '4f9dd9e68d79642cfafd16a71e51747599668f9e', class: "co-ref-field__secondary-label" }, this.secondaryLabel)))), h("co-popover", { key: '91ad529d27a62ccbcb8acac7f23cee7ac2ca33ce', open: this.isOpen, placement: "bottom-start", matchWidth: !this.panelWidth, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '809b6f7e0f64ffd7c6151c1fae340114f5887e72', slot: "trigger" }, this.renderTrigger()), this.isOpen && this.renderPanel()), this.helperText && (h("div", { key: '4089f6e3cd993ce620742d619282d12542e87057', class: `co-ref-field__helper co-ref-field__helper--${this.status}` }, this.status !== 'default' && (h("co-icon", { key: '3d9e658ba0cc04034778911930837f1268afeedd', name: this.status === 'error' ? 'warning-circle' : this.status === 'success' ? 'check-circle' : 'info', size: 14 })), h("span", { key: '8c26be0575794b6f8b410f1fd0b71efd715d5324' }, this.helperText)))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@prolibu-suite/cobalt-core",
-  "version": "0.9.4",
+  "version": "0.9.5",
   "description": "Cobalt Design System — Framework-agnostic Web Components built with Stencil",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -50,9 +50,9 @@
     "@phosphor-icons/core": "^2.1.1",
     "dompurify": "^3.2.6",
     "overlayscrollbars": "^2.16.0",
-    "@prolibu-suite/cobalt-calendar-utils": "0.1.0",
     "@prolibu-suite/cobalt-date-utils": "0.1.1",
     "@prolibu-suite/cobalt-rich-text": "0.1.2",
+    "@prolibu-suite/cobalt-calendar-utils": "0.1.0",
     "@prolibu-suite/cobalt-tokens": "0.4.1"
   },
   "devDependencies": {

package/dist/cobalt/p-f00be11f.entry.js

@@ -1 +0,0 @@
-import{r as e,c as i,h as t,a as o}from"./p-CrtiywTB.js";import{R as r}from"./p-T4la7ly_.js";import{F as s}from"./p-mAGnZXRn.js";import{i as a}from"./p-BG4WRR22.js";const c=class{constructor(t){e(this,t),this.coChange=i(this,"coChange",7),this.coClear=i(this,"coClear",7),this.coSearch=i(this,"coSearch",7),this.coLoadMore=i(this,"coLoadMore",7),this.coOpen=i(this,"coOpen",3),this.coClose=i(this,"coClose",3),this.coRemove=i(this,"coRemove",7),this.coFooterPrimary=i(this,"coFooterPrimary",7),this.coFooterSecondary=i(this,"coFooterSecondary",7),this.coPinToggle=i(this,"coPinToggle",7),this.coListReorder=i(this,"coListReorder",7),this.coEditSelected=i(this,"coEditSelected",7),this.required=!1,this.placeholder="Select…",this.disabled=!1,this.clearable=!0,this.editable=!1,this.editLabel="Edit",this.multiple=!1,this.status="default",this.layout="vertical",this.size="md",this.variant="default",this.value="",this.options="[]",this.selectedDisplay="[]",this.loading=!1,this.total=0,this.searchable=!0,this.searchPlaceholder="Search…",this.searchDebounce=350,this.emptyMessage="No results found",this.showFooter=!1,this.footerPrimaryLabel="Ok",this.footerSecondaryLabel="New",this.maxChips=0,this.panelTheme="auto",this.colorMode="dot",this.triggerBadgeIcon="",this.triggerBadgeLabel="",this.avatarShape="circle",this.pinnable=!1,this.listReorderable=!1,this.isOpen=!1,this.overflowCount=0,this.lastChipsKey="\0",this.pendingFocus=!1,this.handlePopoverOpen=()=>{this.isOpen=!0},this.handlePopoverClose=()=>{this.isOpen=!1},this.handleTriggerClick=e=>{this.disabled&&e.stopPropagation()},this.handleTriggerKeyDown=e=>{this.disabled||e.target===this.triggerEl&&("Enter"===e.key||" "===e.key?(e.preventDefault(),this.isOpen=!this.isOpen):"ArrowDown"!==e.key||this.isOpen||(e.preventDefault(),this.isOpen=!0))},this.handleListChange=e=>{if(!this.multiple&&null===e.value)return this.value="",this.coClear.emit(),void(this.isOpen=!1);this.handleOptionClick(e.item)},this.handleOptionClick=e=>{if(this.multiple){const i=this.parsedValue;let t;t=i.indexOf(e._id)>=0?i.filter((i=>i!==e._id)):[...i,e._id],this.value=JSON.stringify(t),this.coChange.emit({value:t,item:e})}else this.value=e._id,this.coChange.emit({value:e._id,item:e}),this.isOpen=!1},this.handleReorder=e=>{this.value=JSON.stringify(e.value),this.coChange.emit({value:e.value,item:e.item})},this.handleClear=e=>{e.stopPropagation(),this.value=this.multiple?"[]":"",this.coClear.emit()},this.handleEditClick=e=>{e.stopPropagation();const i=this.effectiveDisplayItems[0];i&&this.coEditSelected.emit(i._id)},this.handleRemoveChip=(e,i)=>{i.stopPropagation();const t=this.parsedValue.filter((i=>i!==e));this.value=JSON.stringify(t),this.coRemove.emit(e)},this.handleFooterPrimary=()=>{this.coFooterPrimary.emit(),this.isOpen=!1},this.handleFooterSecondary=()=>{this.coFooterSecondary.emit()}}get normalizedSize(){return"default"===this.size?"md":this.size}get parsedOptions(){try{const e="string"==typeof this.options?JSON.parse(this.options):this.options;return Array.isArray(e)?e:[]}catch(e){return[]}}get parsedSelectedDisplay(){try{const e="string"==typeof this.selectedDisplay?JSON.parse(this.selectedDisplay):this.selectedDisplay;return Array.isArray(e)?e:[]}catch(e){return[]}}get effectiveDisplayItems(){const e=this.parsedValue;if(0===e.length)return[];const i=new Map;for(const e of this.parsedSelectedDisplay)i.set(e._id,e);for(const e of this.parsedOptions)i.has(e._id)||i.set(e._id,{_id:e._id,label:e.label,description:e.description,color:e.color,avatar:e.avatar,image:e.image});return e.map((e=>i.get(e))).filter(Boolean)}get parsedValue(){if(!this.value)return[];try{const e=JSON.parse(this.value);return Array.isArray(e)?e:[this.value]}catch(e){return this.value?[this.value]:[]}}connectedCallback(){this.resizeObserver=new ResizeObserver((()=>this.calcOverflow()))}componentDidRender(){var e,i,t,o;this.chipsEl!==this.observedChipsEl&&(null===(e=this.resizeObserver)||void 0===e||e.disconnect(),this.chipsEl&&(null===(i=this.resizeObserver)||void 0===i||i.observe(this.chipsEl)),this.observedChipsEl=this.chipsEl);const r=null===(t=this.chipsEl)||void 0===t?void 0:t.querySelectorAll(".co-ref-field__chip"),s=r?Array.from(r,(e=>e.textContent)).join("
"):"";s!==this.lastChipsKey&&(this.lastChipsKey=s,this.calcOverflow()),this.pendingFocus&&(null===(o=this.optionListEl)||void 0===o?void 0:o.isConnected)&&(this.pendingFocus=!1,this.optionListEl.focusSearch())}disconnectedCallback(){var e;null===(e=this.resizeObserver)||void 0===e||e.disconnect()}calcOverflow(){if(!this.multiple||this.maxChips>0||!this.chipsEl)return void(0!==this.overflowCount&&(this.overflowCount=0));const e=Array.from(this.chipsEl.querySelectorAll(".co-ref-field__chip"));if(0===e.length)return void(0!==this.overflowCount&&(this.overflowCount=0));const i=this.chipsEl.getBoundingClientRect().right;let t=0;for(let o=e.length-1;o>=0&&e[o].getBoundingClientRect().right>i+1;o--)t++;t!==this.overflowCount&&(this.overflowCount=t)}onOpenChange(e){e?(this.coOpen.emit(),this.pendingFocus=!0):(this.coClose.emit(),this.restoreTriggerFocus())}restoreTriggerFocus(){var e;const i=document.activeElement;(i===this.el||this.el.contains(i))&&(null===(e=this.triggerEl)||void 0===e||e.focus())}renderTrigger(){const e=this.effectiveDisplayItems,i=e.length>0;return t("div",{class:{"co-ref-field__trigger":!0,"co-ref-field--open":this.isOpen,"co-ref-field--disabled":this.disabled,[`co-ref-field--${this.normalizedSize}`]:!0,[`co-ref-field--${this.status}`]:"default"!==this.status,"co-ref-field--flat":"flat"===this.variant},role:"combobox","aria-expanded":this.isOpen?"true":"false","aria-haspopup":"listbox","aria-label":this.label||void 0,"aria-disabled":this.disabled?"true":void 0,"aria-controls":this.isOpen?c.LIST_ID:void 0,tabIndex:this.disabled?-1:0,ref:e=>this.triggerEl=e,onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown},this.iconLeft&&t("span",{class:"co-ref-field__icon"},t("co-icon",{name:this.iconLeft,size:16})),t("div",{class:"co-ref-field__value"},!i&&t("span",{class:"co-ref-field__placeholder",part:"trigger-placeholder"},this.placeholder),i&&!this.multiple&&this.renderSingleValue(e[0]),i&&this.multiple&&this.renderMultipleValue(e)),i&&this.triggerBadgeIcon&&t("span",{class:"co-ref-field__trigger-badge",part:"trigger-badge",role:"img",title:this.triggerBadgeLabel||void 0,"aria-label":this.triggerBadgeLabel||void 0},t("co-icon",{name:this.triggerBadgeIcon,size:11,weight:"fill"})),i&&!this.multiple&&this.editable&&!this.disabled&&t("button",{class:"co-ref-field__edit",part:"trigger-edit",tabIndex:-1,onClick:this.handleEditClick,type:"button",title:this.editLabel||void 0,"aria-label":this.editLabel||void 0},t("co-icon",{name:"pencil-simple",size:14})),i&&this.clearable&&!this.disabled&&t("button",{class:"co-ref-field__clear",part:"trigger-clear",tabIndex:-1,onClick:this.handleClear,type:"button"},t("co-icon",{name:"x",size:14})),t("span",{class:"co-ref-field__caret",part:"trigger-chevron"},t("co-icon",{name:"caret-up-down",size:16})))}renderItemAvatar(e){return e.image||e.avatar?t("co-avatar",{class:"co-ref-field__avatar",type:e.image?"image":"text",src:e.image,text:e.avatar,color:e.color,size:"xxs",shape:this.avatarShape}):e.color?t("span",{class:"co-ref-field__color-dot",style:{backgroundColor:e.color}}):null}renderSingleValue(e){return t("div",{class:"co-ref-field__selected"},this.renderItemAvatar(e),t("span",{class:"co-ref-field__selected-label",part:"trigger-text"},e.label))}renderMultipleValue(e){const i=this.maxChips>0,o=Math.min(this.overflowCount,Math.max(0,e.length-1)),r=i?e.slice(0,this.maxChips):e,c=i?e.length-this.maxChips:o,l=e.length-(i?0:o);return t("div",{class:"co-ref-field__chips-row"},t("div",{class:"co-ref-field__chips",ref:e=>this.chipsEl=e},r.map(((e,o)=>{const r="fill"===this.colorMode&&!!e.color&&!(e.image||e.avatar);return t(s,{key:e._id,baseClass:"co-ref-field__chip",label:e.label,modifiers:{"co-ref-field__chip--avatar":!(!e.image&&!e.avatar),"co-ref-field__chip--fill":r,"co-ref-field__chip--fill-light":r&&a(e.color),"co-ref-field__chip--clipped":!i&&o>=l,[`co-ref-field__chip--${this.normalizedSize}`]:!0},style:r?{backgroundColor:e.color}:void 0,onRemove:i=>this.handleRemoveChip(e._id,i)},e.image||e.avatar?this.renderItemAvatar(e):e.color&&!r?t("span",{class:"co-ref-field__chip-dot",style:{backgroundColor:e.color}}):null)}))),c>0&&t("span",{class:"co-ref-field__chip-overflow"},"+",c))}renderPanel(){return t("div",{class:{"co-ref-field__panel":!0,"co-ref-field__panel--dark":"dark"===this.panelTheme,"co-ref-field__panel--light":"light"===this.panelTheme},style:this.panelWidth?{width:this.panelWidth}:void 0},t("co-option-list",{id:c.LIST_ID,ref:e=>this.optionListEl=e,items:"string"==typeof this.options?this.options:JSON.stringify(this.options),value:this.value,selectedItems:"string"==typeof this.selectedDisplay?this.selectedDisplay:JSON.stringify(this.selectedDisplay),multiple:this.multiple,selectedFirst:this.multiple,reorderable:this.multiple,pinnable:this.pinnable,listReorderable:this.listReorderable,selectedAffordance:"deselect",searchable:this.searchable,searchPlaceholder:this.searchPlaceholder,searchDebounce:this.searchDebounce,loading:this.loading,total:this.total,emptyMessage:this.emptyMessage,avatarShape:this.avatarShape,onCoSearch:e=>this.coSearch.emit(e.detail),onCoChange:e=>this.handleListChange(e.detail),onCoReorder:e=>this.handleReorder(e.detail),onCoPinToggle:e=>this.coPinToggle.emit(e.detail),onCoListReorder:e=>this.coListReorder.emit(e.detail),onCoLoadMore:()=>this.coLoadMore.emit()},t("slot",{name:"panel-footer",slot:"footer"}),this.showFooter&&t("div",{class:"co-ref-field__footer",slot:"footer"},this.footerSecondaryLabel&&t("button",{class:"co-ref-field__footer-btn co-ref-field__footer-btn--secondary",type:"button",onClick:this.handleFooterSecondary},t("co-icon",{name:"plus",size:16}),t("span",null,this.footerSecondaryLabel)),t("button",{class:"co-ref-field__footer-btn co-ref-field__footer-btn--primary",type:"button",onClick:this.handleFooterPrimary},t("co-icon",{name:"check",size:16}),t("span",null,this.footerPrimaryLabel)))))}render(){return t("div",{key:"6bfad2357faa70a7fe4d71aa61b8eaab589c26f2",class:"co-ref-field"},(this.label||this.secondaryLabel)&&t("div",{key:"0de5d626d21c9cc3d96b7c39da180369bfd2b228",class:"co-ref-field__labels"},this.label&&t("label",{key:"ae25a6e7630ce52208ae0d13c0228fa0cac9496d",class:"co-ref-field__label"},this.labelIcon&&t("co-icon",{key:"bce6b7a835f291d658eab0ca3589d39bf5ab7d5c",class:"co-ref-field__label-icon",name:this.labelIcon,size:16}),this.label,t(r,{key:"84f6a8d95f46674717e1b7e5699790b317a69a67",required:this.required})),this.secondaryLabel&&t("span",{key:"f9bbcdcb833a0347b2b2ee050e1ba58f95bb3d40",class:"co-ref-field__secondary-label"},this.secondaryLabel)),t("co-popover",{key:"18ac882e39908cd9fdda86d70ed750faca8bc8d1",open:this.isOpen,placement:"bottom-start",matchWidth:!this.panelWidth,offset:4,onCoOpen:this.handlePopoverOpen,onCoClose:this.handlePopoverClose},t("div",{key:"e542d937f4738a7199f38057986931a21fc8462f",slot:"trigger"},this.renderTrigger()),this.isOpen&&this.renderPanel()),this.helperText&&t("div",{key:"f75928e549c2c1f6f5f0589e105c00b71e85f661",class:`co-ref-field__helper co-ref-field__helper--${this.status}`},"default"!==this.status&&t("co-icon",{key:"1f329a60a6b03fdfc77361c8c2287cc55369764f",name:"error"===this.status?"warning-circle":"success"===this.status?"check-circle":"info",size:14}),t("span",{key:"5fa6dbe648f63789c496081c9197eac7ac89c9b3"},this.helperText)))}get el(){return o(this)}static get watchers(){return{isOpen:[{onOpenChange:0}]}}};c.LIST_ID="co-ref-field-list",c.style=":host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1;position:relative}.co-ref-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-ref-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-ref-field__label{display:inline-flex;align-items:center;color:var(--co-ref-field-label-color, var(--co-semantic-text-secondary));font-family:var(--co-ref-field-label-font-family, var(--co-font-family-primary));font-size:var(--co-ref-field-label-font-size, var(--co-font-size-14));font-weight:var(--co-ref-field-label-font-weight, 400);line-height:1;white-space:nowrap;cursor:default;text-transform:var(--co-ref-field-label-text-transform, none);letter-spacing:var(--co-ref-field-label-letter-spacing, var(--co-font-letter-spacing-body))}.co-ref-field__secondary-label{color:var(--co-semantic-text-muted);font-family:var(--co-font-family-mono);font-size:var(--co-font-size-12);font-weight:400;line-height:1;white-space:nowrap;text-align:right}.co-ref-field__trigger{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-ref-field-trigger-bg, var(--co-semantic-surface-page));border:1px solid var(--co-ref-field-trigger-border-color, var(--co-semantic-border-field));border-radius:var(--co-border-radius-xs);min-height:40px;box-sizing:border-box;cursor:pointer;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field--flat{background:transparent;border-color:transparent}.co-ref-field--s{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--sm{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--lg{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-ref-field--open{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field__trigger:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field--disabled{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-ref-field--error{border-color:var(--co-semantic-status-error)}.co-ref-field--success{border-color:var(--co-semantic-status-success)}.co-ref-field--warning{border-color:var(--co-color-status-review)}.co-ref-field--s .co-ref-field__selected{--co-avatar-size:20px}.co-ref-field--sm .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--md .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--lg .co-ref-field__selected{--co-avatar-size:28px}.co-ref-field__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__label-icon{flex-shrink:0;margin-right:var(--co-spacing-xs);color:var(--co-semantic-text-secondary)}.co-ref-field__value{flex:1;min-width:0;display:flex;align-items:center}.co-ref-field__placeholder{color:var(--co-semantic-text-muted);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__caret{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__trigger-badge{flex-shrink:0;display:grid;place-items:center;width:18px;height:18px;border-radius:var(--co-border-radius-xxs);background:var(--co-ref-field-trigger-badge-bg, rgba(0, 0, 0, 0.22));color:var(--co-semantic-text-default)}.co-ref-field__clear{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__clear:hover{color:var(--co-semantic-text-default)}.co-ref-field__edit{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__edit:hover{color:var(--co-semantic-text-default)}.co-ref-field__selected{display:flex;align-items:center;gap:var(--co-spacing-sm);min-width:0}.co-ref-field__color-dot{width:10px;height:10px;min-width:10px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__avatar{flex-shrink:0}.co-ref-field__selected-label{color:var(--co-semantic-text-default);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__chips-row{flex:1;min-width:0;display:flex;align-items:center;gap:var(--co-spacing-xs)}.co-ref-field__chips{flex:1;min-width:0;display:flex;flex-wrap:nowrap;overflow:hidden;gap:var(--co-spacing-xs);align-items:center}.co-ref-field__chip{display:inline-flex;align-items:center;gap:var(--co-spacing-sm);padding:0 var(--co-spacing-sm2);background:var(--co-color-gray-100);border-radius:var(--co-border-radius-full);line-height:1;max-width:min(160px, 100%);flex-shrink:0}.co-ref-field__chip--avatar{padding-left:var(--co-spacing-xxs)}.co-ref-field__chip--s{min-height:20px;--co-avatar-size:20px;font-size:var(--co-font-size-12)}.co-ref-field__chip--sm{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-12)}.co-ref-field__chip--md{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-14)}.co-ref-field__chip--lg{min-height:28px;--co-avatar-size:28px;font-size:var(--co-font-size-14)}.co-ref-field__chip--clipped{visibility:hidden}.co-ref-field__chip-dot{width:8px;height:8px;min-width:8px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__chip--fill{color:var(--co-color-base-blanco);border-radius:var(--co-spacing-sm)}.co-ref-field__chip--fill-light{color:var(--co-color-base-negro)}.co-ref-field__chip--fill .co-ref-field__chip-label,.co-ref-field__chip--fill .co-ref-field__chip-remove{color:inherit}.co-ref-field__chip--fill .co-ref-field__chip-remove{opacity:0.72}.co-ref-field__chip--fill .co-ref-field__chip-remove:hover{color:inherit;opacity:1}.co-ref-field__chip-label{color:var(--co-semantic-text-default);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.co-ref-field__chip-remove{display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-color-gray-500);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out);flex-shrink:0}.co-ref-field__chip-remove:hover{color:var(--co-semantic-text-default)}.co-ref-field__chip-overflow{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:var(--co-spacing-xs) var(--co-spacing-sm);background:var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-full);font-size:var(--co-font-size-12);font-weight:600;color:var(--co-semantic-text-secondary);line-height:1}.co-ref-field__panel{display:flex;flex-direction:column;border-radius:var(--co-border-radius-sm, 12px);overflow:hidden}.co-ref-field__panel--dark{--co-semantic-surface-page:#0A0A0A;--co-semantic-surface-primary:#0A0A0A;--co-semantic-surface-hover:rgba(255, 255, 255, 0.08);--co-semantic-surface-muted:rgba(255, 255, 255, 0.12);--co-semantic-text-default:#ffffff;--co-semantic-text-secondary:rgba(255, 255, 255, 0.8);--co-semantic-text-muted:rgba(255, 255, 255, 0.5);--co-semantic-border-subtle:rgba(255, 255, 255, 0.12);--co-semantic-border-default:rgba(255, 255, 255, 0.16);background:#0A0A0A;color:#ffffff}.co-ref-field__panel--light{--co-semantic-surface-page:#ffffff;--co-semantic-surface-primary:#ffffff;--co-semantic-surface-hover:var(--co-color-gray-100, #f5f5f5);--co-semantic-surface-muted:var(--co-color-gray-200, #e5e5e5);--co-semantic-text-default:var(--co-color-gray-700, #1F1C1B);--co-semantic-text-secondary:rgba(0, 0, 0, 0.6);--co-semantic-text-muted:rgba(0, 0, 0, 0.45);--co-semantic-border-subtle:var(--co-color-gray-200, #e5e5e5);--co-semantic-border-default:var(--co-color-gray-300, #d4d4d4);background:#ffffff;color:var(--co-color-gray-700, #1F1C1B)}.co-ref-field__footer{display:flex;gap:var(--co-spacing-sm2);border-top:1px solid var(--co-semantic-border-subtle);padding:var(--co-spacing-sm2)}.co-ref-field__footer-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md);border-radius:var(--co-border-radius-xs);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12, 12px);font-weight:500;line-height:1;letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;cursor:pointer;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box;min-height:32px}.co-ref-field__footer-btn:hover{opacity:0.85}.co-ref-field__footer-btn--secondary{background:transparent;color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-default)}.co-ref-field__footer-btn--primary{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none}.co-ref-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs);font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-muted)}.co-ref-field__helper--error{color:var(--co-semantic-status-error)}.co-ref-field__helper--success{color:var(--co-semantic-status-success)}.co-ref-field__helper--warning{color:var(--co-color-status-review)}:host([layout='horizontal']) .co-ref-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-ref-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-ref-field__label{white-space:normal}:host([layout='horizontal']) .co-ref-field>:not(.co-ref-field__labels){grid-column:2;min-width:0}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}";export{c as co_ref_field}