@prolibu-suite/cobalt-core 0.6.0 → 0.7.0

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

@@ -0,0 +1 @@
+import{r as e,c as o,h as i,a as s}from"./p-BCEz3S-z.js";import{R as t}from"./p-C-d15gih.js";const a=class{constructor(i){e(this,i),this.coInput=o(this,"coInput",7),this.coChange=o(this,"coChange",7),this.coValidity=o(this,"coValidity",7),this.coFocus=o(this,"coFocus",7),this.coBlur=o(this,"coBlur",7),this.value="",this.placeholder="{ }",this.required=!1,this.disabled=!1,this.readonly=!1,this.rows=8,this.status="default",this.invalidMessage="Invalid JSON",this.layout="vertical",this.size="md",this.draft="",this.internalInvalid=!1,this.hasFocus=!1,this.handleInput=e=>{this.draft=e.target.value,this.validate(!0),this.coInput.emit(this.draft)},this.handleFocus=()=>{this.hasFocus=!0,this.coFocus.emit()},this.handleBlur=()=>{this.hasFocus=!1,this.value=this.draft,this.coChange.emit(this.draft),this.coBlur.emit()}}componentWillLoad(){var e;this.draft=null!==(e=this.value)&&void 0!==e?e:"",this.validate(!1)}onValueChange(){var e;this.hasFocus||(this.draft=null!==(e=this.value)&&void 0!==e?e:"",this.validate(!1))}get isInvalid(){return"error"===this.status||this.internalInvalid}validate(e){const o=this.draft.trim(),i=""===o||this.tryParse(o);return!i!==this.internalInvalid&&(this.internalInvalid=!i,e&&this.coValidity.emit({valid:i,message:i?void 0:this.invalidMessage})),i}tryParse(e){try{return JSON.parse(e),!0}catch(e){return!1}}render(){const e=this.internalInvalid?this.invalidMessage:this.helperText,o="default"!==this.status?`co-json-field--${this.status}`:"";return i("div",{key:"ce1a39e0f1489b46e9610b060ca652e8896746b9",class:{"co-json-field":!0,"co-json-field--disabled":this.disabled,"co-json-field--focused":this.hasFocus,"co-json-field--invalid":this.isInvalid,[`co-json-field--${this.size}`]:!0,[o]:!!o},part:"wrapper"},this.label&&i("div",{key:"e5ec0e7d2f454f1d671ed3929c2b5eb7dc4b8cf9",class:"co-json-field__labels"},i("label",{key:"d9961499b8d91c385d9278cbd856e04a44b28940",class:"co-json-field__label",part:"label"},this.label,i(t,{key:"8ba3b3249e0fa1cb3a1b2946ac6a1b7561d30ef1",required:this.required}))),i("div",{key:"e6f28cf374cc9ad2714505854572504a59c7258c",class:"co-json-field__field",part:"field"},i("textarea",{key:"d380a4c0758152c5e39da71d61f5f81e28c22563",class:"co-json-field__native",rows:this.rows,spellcheck:!1,autocomplete:"off",value:this.draft,placeholder:this.placeholder,disabled:this.disabled,readOnly:this.readonly,required:this.required,"aria-invalid":this.isInvalid?"true":"false","aria-label":this.label?void 0:"JSON",onInput:this.handleInput,onFocus:this.handleFocus,onBlur:this.handleBlur,part:"input"})),this.name&&i("input",{key:"97f76e4ffd9e8b3242515ca2d2d13b786cd390db",type:"hidden",name:this.name,value:this.draft}),e&&i("div",{key:"310540578b3a2152a1c3f34b0d2f1a00677b5e76",class:{"co-json-field__helper":!0,"co-json-field__helper--error":this.isInvalid},part:"helper"},this.isInvalid&&i("co-icon",{key:"e604c4e4489ace1f2c189fb532f091f26962b5ff",name:"warning-circle",size:14,class:"co-json-field__helper-icon"}),i("span",{key:"eb0567a78a33fd41917c090f6aaccecac49f2519",class:"co-json-field__helper-text"},e)))}get el(){return s(this)}static get watchers(){return{value:[{onValueChange:0}]}}};a.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}.co-json-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-json-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-json-field__label{color:var(--co-semantic-text-secondary);font-size:var(--co-font-size-14);font-weight:400;letter-spacing:var(--co-font-letter-spacing-body);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-json-field__field{display:flex;background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-field);border-radius:var(--co-border-radius-xs);transition:border-color 0.15s ease, box-shadow 0.15s ease;box-sizing:border-box;overflow:hidden}.co-json-field__native{width:100%;resize:vertical;border:none;outline:none;background:transparent;font-family:var(--co-font-family-mono, monospace);font-size:var(--co-font-size-13, 13px);font-weight:400;line-height:1.5;color:var(--co-semantic-text-default);padding:var(--co-spacing-sm2) var(--co-spacing-md);margin:0;box-sizing:border-box;tab-size:2}.co-json-field__native::placeholder{color:var(--co-semantic-text-muted)}.co-json-field--s .co-json-field__native{padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12, 12px)}.co-json-field--sm .co-json-field__native{padding:var(--co-spacing-xs) var(--co-spacing-sm)}.co-json-field--lg .co-json-field__native{padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-14)}.co-json-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-json-field__helper-icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-json-field__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1;letter-spacing:var(--co-font-letter-spacing-body)}.co-json-field--focused .co-json-field__field{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-json-field--disabled{opacity:0.6;pointer-events:none}.co-json-field--disabled .co-json-field__field{background:var(--co-semantic-surface-disabled);border-color:transparent}.co-json-field--invalid .co-json-field__field,.co-json-field--error .co-json-field__field{border-color:var(--co-semantic-status-error)}.co-json-field--invalid.co-json-field--focused .co-json-field__field,.co-json-field--error.co-json-field--focused .co-json-field__field{border-color:var(--co-semantic-status-error);box-shadow:0 0 0 2px rgba(170, 46, 27, 0.12)}.co-json-field__helper--error .co-json-field__helper-icon,.co-json-field__helper--error .co-json-field__helper-text{color:var(--co-semantic-status-error)}:host([layout='horizontal']) .co-json-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-json-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-json-field__label{white-space:normal}:host([layout='horizontal']) .co-json-field>:not(.co-json-field__labels){grid-column:2;min-width:0}";export{a as co_json_field}

package/dist/cobalt/{p-af4cb263.entry.js → p-ff581807.entry.js}

@@ -1 +1 @@
-import{r,h as e}from"./p-tT-aZV0-.js";const c=class{constructor(e){r(this,e),this.value=0,this.status="default",this.size=40,this.strokeWidth=2,this.showLabel=!0}render(){const r=Math.max(0,Math.min(100,this.value)),c=r/100*360,s=Math.min(this.strokeWidth,this.size/2);return e("div",{key:"c97a2f586f1e4518d2a35be1d43f13ede60a25bc",class:{"co-progress-circle":!0,[`co-progress-circle--${this.status}`]:!0},role:"progressbar","aria-valuenow":r,"aria-valuemin":0,"aria-valuemax":100,part:"circle",style:{width:`${this.size}px`,height:`${this.size}px`,"--co-pc-angle":`${c}deg`,"--co-pc-stroke":`${s}px`}},e("div",{key:"7418e16887ea4705d8e7d7228bc8c172058d5f5f",class:"co-progress-circle__track"}),this.showLabel&&e("span",{key:"0af289d28bbf4f7e6c9be76c3c7e686960cd1ff0",class:"co-progress-circle__label"},r,"%"))}};c.style=":host{display:inline-flex}.co-progress-circle{--_color:var(--co-semantic-status-info, #2563eb);--_track:var(--co-color-opacity-negro-8, rgba(0, 0, 0, 0.08));position:relative;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:conic-gradient(     var(--_color) var(--co-pc-angle, 0deg),     var(--_track) var(--co-pc-angle, 0deg)   );transition:background 0.3s ease}.co-progress-circle__track{position:absolute;inset:var(--co-pc-stroke, 4px);border-radius:50%;background:var(--co-semantic-surface-page, #fff)}.co-progress-circle__label{position:relative;z-index:1;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-11, 11px);font-weight:600;color:var(--_color);line-height:1;pointer-events:none}.co-progress-circle--success{--_color:var(--co-semantic-status-success, #0a7724)}.co-progress-circle--warning{--_color:var(--co-semantic-status-warning, #f59e0b)}.co-progress-circle--error{--_color:var(--co-semantic-status-error, #aa2e1b)}";export{c as co_progress_circle}
+import{r,h as e}from"./p-BCEz3S-z.js";const c=class{constructor(e){r(this,e),this.value=0,this.status="default",this.size=40,this.strokeWidth=2,this.showLabel=!0}render(){const r=Math.max(0,Math.min(100,this.value)),c=r/100*360,a=Math.min(this.strokeWidth,this.size/2);return e("div",{key:"879a0c95c7d4aa279eed21447b093bc1461afa4c",class:{"co-progress-circle":!0,[`co-progress-circle--${this.status}`]:!0},role:"progressbar","aria-valuenow":r,"aria-valuemin":0,"aria-valuemax":100,part:"circle",style:{width:`${this.size}px`,height:`${this.size}px`,"--co-pc-angle":`${c}deg`,"--co-pc-stroke":`${a}px`}},e("div",{key:"7f2ece80cede1b6eda659706fe4a2b8cbfc6f47a",class:"co-progress-circle__track"}),this.showLabel&&e("span",{key:"83cbbe79663dae93962da7d1d9ae1f27a6e46fa4",class:"co-progress-circle__label"},r,"%"))}};c.style=":host{display:inline-flex}.co-progress-circle{--_color:var(--co-semantic-status-info, #2563eb);--_track:var(--co-color-opacity-negro-8, rgba(0, 0, 0, 0.08));position:relative;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:conic-gradient(     var(--_color) var(--co-pc-angle, 0deg),     var(--_track) var(--co-pc-angle, 0deg)   );transition:background 0.3s ease}.co-progress-circle__track{position:absolute;inset:var(--co-pc-stroke, 4px);border-radius:50%;background:var(--co-semantic-surface-page, #fff)}.co-progress-circle__label{position:relative;z-index:1;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-11, 11px);font-weight:600;color:var(--_color);line-height:1;pointer-events:none}.co-progress-circle--success{--_color:var(--co-semantic-status-success, #0a7724)}.co-progress-circle--warning{--_color:var(--co-semantic-status-warning, #f59e0b)}.co-progress-circle--error{--_color:var(--co-semantic-status-error, #aa2e1b)}";export{c as co_progress_circle}

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

@@ -0,0 +1 @@
+import{r as e,c as o,h as r,a as t}from"./p-BCEz3S-z.js";import{R as s}from"./p-C-d15gih.js";import{O as a}from"./p-ox7HzCZn.js";import{r as i,h as l}from"./p-CQY6Ul7q.js";const c=class{constructor(r){e(this,r),this.coChange=o(this,"coChange",7),this.coClear=o(this,"coClear",7),this.required=!1,this.placeholder="Select…",this.disabled=!1,this.clearable=!1,this.layout="vertical",this.status="default",this.options="[]",this.value="",this.multiple=!1,this.size="md",this.variant="default",this.searchable=!1,this.searchPlaceholder="Search…",this.emptyText="No results",this.isOpen=!1,this.scrollTop=0,this.searchText="",this.sortSnapshot=new Set,this.lastParsedOptions=[],this.lastRankSearch="",this.lastRanked=[],this.handleSearchInput=e=>{this.searchText=e.target.value,this.scrollTop=0},this.handleTriggerClick=e=>{this.disabled&&e.stopPropagation()},this.handlePopoverOpen=()=>{this.sortSnapshot=new Set(this.selectedValues),this.isOpen=!0},this.handlePopoverClose=()=>{this.isOpen=!1},this.handleClear=e=>{e.stopPropagation(),this.value=this.multiple?"[]":"",this.coClear.emit(),this.coChange.emit(this.multiple?[]:"")},this.handleOptionClick=e=>{if(this.multiple){const o=[...this.selectedValues],r=o.indexOf(e);r>=0?o.splice(r,1):o.push(e),this.value=JSON.stringify(o),this.coChange.emit(o)}else this.value=e,this.isOpen=!1,this.coChange.emit(e)}}get parsedOptions(){const e=this.options;if(e===this.lastOptionsRaw)return this.lastParsedOptions;let o=e;if("string"==typeof o)try{o=JSON.parse(o)}catch(e){o=[]}const r=Array.isArray(o)?o.map((e=>"string"==typeof e?{label:e,value:e}:e)):[];return this.lastOptionsRaw=e,this.lastParsedOptions=r,r}get filteredOptions(){const e=this.parsedOptions;let o;return this.searchable&&this.searchText.trim()?e===this.lastRankInput&&this.searchText===this.lastRankSearch?o=this.lastRanked:(o=i(e,this.searchText,(e=>e.label)),this.lastRankInput=e,this.lastRankSearch=this.searchText,this.lastRanked=o):o=e,this.multiple&&0!==this.sortSnapshot.size?[...o.filter((e=>this.sortSnapshot.has(e.value))),...o.filter((e=>!this.sortSnapshot.has(e.value)))]:o}get selectedValues(){if(this.multiple){if("string"==typeof this.value)try{return JSON.parse(this.value)}catch(e){return this.value?[this.value]:[]}return this.value}return"string"==typeof this.value&&this.value?[this.value]:[]}get hasValue(){return this.selectedValues.length>0}get selectedOption(){if(this.multiple)return;const e=this.selectedValues[0];return e?this.parsedOptions.find((o=>o.value===e)):void 0}get displayText(){const e=this.selectedValues;if(0===e.length)return"";if(!this.multiple){const o=this.parsedOptions.find((o=>o.value===e[0]));return o?o.label:e[0]}return e.map((e=>{const o=this.parsedOptions.find((o=>o.value===e));return o?o.label:e})).join(", ")}get statusIcon(){return{error:"warning-circle",success:"check-circle",warning:"warning",info:"info"}[this.status]||null}onOpenChange(e){e?(this.scrollTop=0,this.searchable&&requestAnimationFrame((()=>{var e;return null===(e=this.searchInputEl)||void 0===e?void 0:e.focus()}))):this.searchText=""}syncOverlayScrollbars(){const e=this.isOpen&&!!this.optionsContainerEl;e&&!this.osInstance?this.osInstance=a(this.optionsContainerEl,{scrollbars:{theme:"os-theme-co",autoHide:"leave",autoHideDelay:300}},{scroll:e=>{this.scrollTop=e.elements().viewport.scrollTop}}):!e&&this.osInstance&&(this.osInstance.destroy(),this.osInstance=void 0)}componentDidRender(){this.syncOverlayScrollbars()}disconnectedCallback(){var e;null===(e=this.osInstance)||void 0===e||e.destroy(),this.osInstance=void 0}renderLabel(e){const o=this.searchable&&this.searchText?l(e,this.searchText):null;return o?[o.pre,r("span",{class:"co-select__match"},o.match),o.post]:e}getVirtualSlice(e){const{ITEM_HEIGHT:o,VIEWPORT_ITEMS:r,OVERSCAN:t}=c,s=e.length,a=s*o,i=Math.max(0,Math.floor(this.scrollTop/o)-t);return{totalHeight:a,startIdx:i,endIdx:Math.min(s,i+r+2*t),offsetY:i*o}}render(){var e;const o=this.selectedValues,t=this.filteredOptions;return r("div",{key:"dda1b5f2f72939374a748224137586c8cc67cfcb",class:{"co-select":!0,"co-select--open":this.isOpen,"co-select--disabled":this.disabled,[`co-select--${this.size}`]:!0,[`co-select--${this.status}`]:"default"!==this.status,"co-select--flat":"flat"===this.variant}},(this.label||this.secondaryLabel)&&r("div",{key:"5947cfc99c31904238dd3c86c4da4e42e7d94ba3",class:"co-select__labels"},this.label&&r("label",{key:"fac1de54916c5b0701c10b3b618c41f8319c3a50",class:"co-select__label"},this.label,r(s,{key:"12f175c2dc67ef19c949fd517e38cd2c32b55084",required:this.required})),this.secondaryLabel&&r("span",{key:"a1a0fa82fc220952e4c8225e13fa8bbb2cbbe310",class:"co-select__secondary-label"},this.secondaryLabel)),r("co-popover",{key:"126cb2923ea3a5e3646697fd514050258c82bcaa",open:this.isOpen,placement:"bottom-start",matchWidth:!0,offset:4,onCoOpen:this.handlePopoverOpen,onCoClose:this.handlePopoverClose},r("div",{key:"0b3dd75a9d0bb427bc8e5c8f17fe5c297855a899",slot:"trigger",class:"co-select__trigger",onClick:this.handleTriggerClick},this.iconLeft&&r("co-icon",{key:"ad2fa6c5a6798314097d8e0715cddff8ce349586",name:this.iconLeft,size:16,class:"co-select__icon"}),(null===(e=this.selectedOption)||void 0===e?void 0:e.image)&&r("img",{key:"36e7407bf782a1adb15cd41432bc4f36d5605094",class:"co-select__flag",src:this.selectedOption.image,alt:""}),this.multiple&&this.hasValue?r("div",{class:"co-select__chips"},this.selectedValues.map((e=>{const o=this.parsedOptions.find((o=>o.value===e));return r("span",{class:"co-select__chip",key:e},r("span",{class:"co-select__chip-label"},o?o.label:e),r("button",{class:"co-select__chip-remove",type:"button",tabIndex:-1,"aria-label":"Remove",onClick:o=>{o.stopPropagation(),this.handleOptionClick(e)}},r("co-icon",{name:"x",size:12})))}))):r("span",{class:{"co-select__text":!0,"co-select__text--placeholder":!this.hasValue}},this.hasValue?this.displayText:this.placeholder),this.clearable&&this.hasValue&&!this.disabled&&r("button",{key:"3e97e8239b922280a21cd0fa53d37cbb15f313ba",class:"co-select__clear",type:"button",tabIndex:-1,onClick:this.handleClear,"aria-label":"Clear"},r("co-icon",{key:"da2171535417fed8e6a3422120c13f4f860354e3",name:"x-circle",size:16,weight:"fill"})),r("co-icon",{key:"e262edfb38a2bcd9771082c78af22ae3816a4472",name:this.isOpen?"caret-up":"caret-down",size:16,class:"co-select__caret"})),r("div",{key:"d557662d3722a7a60e7b499fea0c47a11bb86737",class:"co-select__dropdown"},this.isOpen&&this.searchable&&r("div",{key:"7248c5417c929016e43eba3754ef74cb68e21d76",class:"co-select__search"},r("co-icon",{key:"a88c9f7da98cb112d33a7bc6f970f503d7fbfcdc",name:"magnifying-glass",size:16,class:"co-select__search-icon"}),r("input",{key:"ed90bd495b6d92941af5f585d24ad9a4986757d9",class:"co-select__search-input",type:"text",placeholder:this.searchPlaceholder,value:this.searchText,onInput:this.handleSearchInput,ref:e=>this.searchInputEl=e})),this.isOpen&&this.searchable&&0===t.length&&r("div",{key:"0b9a0a98cb298dd25f2f869f7c6d01ced4c030a8",class:"co-select__empty"},this.emptyText),r("div",{key:"4c0aa1f9e0f0f3fcede94decb037217466c80ca5",class:"co-select__options",ref:e=>this.optionsContainerEl=e},this.isOpen&&(()=>{const{totalHeight:e,startIdx:s,endIdx:a,offsetY:i}=this.getVirtualSlice(t);return r("div",{class:"co-select__virtual-spacer",style:{height:`${e}px`,position:"relative"}},r("div",{style:{position:"absolute",top:`${i}px`,left:"0",right:"0"}},t.slice(s,a).map((e=>{const t=o.includes(e.value),s=!!e.disabled;return r("div",{class:{"co-select__option":!0,"co-select__option--selected":t,"co-select__option--disabled":s},onClick:()=>!s&&this.handleOptionClick(e.value)},e.image?r("img",{class:"co-select__option-flag",src:e.image,alt:"",loading:"lazy"}):e.icon?r("co-icon",{name:e.icon,size:20,class:"co-select__option-icon"}):null,r("span",{class:"co-select__option-label"},this.renderLabel(e.label)),t&&r("co-icon",{name:"check",size:16,class:"co-select__option-check"}))}))))})()))),this.helperText&&r("div",{key:"b7f14d7e02dd3fe15be6c0f82b13df14edc0db60",class:`co-select__helper co-select__helper--${this.status}`},this.statusIcon&&r("co-icon",{key:"384f8ecbf6b20da23a7ff6e0b8e1745058e624ef",name:this.statusIcon,size:14,weight:"fill",class:"co-select__helper-icon"}),r("span",{key:"26d47cad143f8d66819d497d4618893599665aff",class:"co-select__helper-text"},this.helperText)))}get el(){return t(this)}static get watchers(){return{isOpen:[{onOpenChange:0}]}}};c.ITEM_HEIGHT=34,c.VIEWPORT_ITEMS=8,c.OVERSCAN=3,c.style='.os-size-observer,.os-size-observer-listener{scroll-behavior:auto !important;direction:inherit;pointer-events:none;overflow:hidden;visibility:hidden;box-sizing:border-box}.os-size-observer,.os-size-observer-listener,.os-size-observer-listener-item,.os-size-observer-listener-item-final{writing-mode:horizontal-tb;position:absolute;left:0;top:0}.os-size-observer{z-index:-1;contain:strict;display:flex;flex-direction:row;flex-wrap:nowrap;padding:inherit;border:inherit;box-sizing:inherit;margin:-133px;top:0;right:0;bottom:0;left:0;transform:scale(0.1)}.os-size-observer::before{content:"";flex:none;box-sizing:inherit;padding:10px;width:10px;height:10px}.os-size-observer-appear{animation:os-size-observer-appear-animation 1ms forwards}.os-size-observer-listener{box-sizing:border-box;position:relative;flex:auto;padding:inherit;border:inherit;margin:-133px;transform:scale(calc(1 / 0.1))}.os-size-observer-listener.ltr{margin-right:-266px;margin-left:0}.os-size-observer-listener.rtl{margin-left:-266px;margin-right:0}.os-size-observer-listener:empty::before{content:"";width:100%;height:100%}.os-size-observer-listener:empty::before,.os-size-observer-listener>.os-size-observer-listener-item{display:block;position:relative;padding:inherit;border:inherit;box-sizing:content-box;flex:auto}.os-size-observer-listener-scroll{box-sizing:border-box;display:flex}.os-size-observer-listener-item{right:0;bottom:0;overflow:hidden;direction:ltr;flex:none}.os-size-observer-listener-item-final{transition:none}@keyframes os-size-observer-appear-animation{from{cursor:auto}to{cursor:none}}.os-trinsic-observer{flex:none;box-sizing:border-box;position:relative;max-width:0px;max-height:1px;padding:0;margin:0;border:none;overflow:hidden;z-index:-1;height:0;top:calc(100% + 1px);contain:strict}.os-trinsic-observer:not(:empty){height:calc(100% + 1px);top:-1px}.os-trinsic-observer:not(:empty)>.os-size-observer{width:1000%;height:1000%;min-height:1px;min-width:1px}html[data-overlayscrollbars-body]{overflow:hidden}html[data-overlayscrollbars-body],html[data-overlayscrollbars-body]>body{width:100%;height:100%;margin:0}html[data-overlayscrollbars-body]>body{overflow:visible;margin:0}[data-overlayscrollbars]{position:relative}[data-overlayscrollbars~=host],[data-overlayscrollbars-padding]{display:flex;align-items:stretch !important;flex-direction:row !important;flex-wrap:nowrap !important;scroll-behavior:auto !important}[data-overlayscrollbars-padding],[data-overlayscrollbars-viewport]:not([data-overlayscrollbars]){box-sizing:inherit;position:relative;flex:auto;height:auto;width:100%;min-width:0;padding:0;margin:0;border:none;z-index:0}[data-overlayscrollbars-viewport]:not([data-overlayscrollbars]){--os-vaw:0;--os-vah:0;outline:none}[data-overlayscrollbars-viewport]:not([data-overlayscrollbars]):focus{outline:none}[data-overlayscrollbars-viewport][data-overlayscrollbars-viewport~=arrange]::before{content:"";position:absolute;pointer-events:none;z-index:-1;min-width:1px;min-height:1px;width:var(--os-vaw);height:var(--os-vah)}[data-overlayscrollbars~=host],[data-overlayscrollbars-padding]{overflow:hidden !important}[data-overlayscrollbars~=host][data-overlayscrollbars~=noClipping],[data-overlayscrollbars-padding~=noClipping]{overflow:visible !important}[data-overlayscrollbars-viewport]{--os-viewport-overflow-x:hidden;--os-viewport-overflow-y:hidden;overflow-x:var(--os-viewport-overflow-x);overflow-y:var(--os-viewport-overflow-y)}[data-overlayscrollbars-viewport~=overflowXVisible]{--os-viewport-overflow-x:visible}[data-overlayscrollbars-viewport~=overflowXHidden]{--os-viewport-overflow-x:hidden}[data-overlayscrollbars-viewport~=overflowXScroll]{--os-viewport-overflow-x:scroll}[data-overlayscrollbars-viewport~=overflowYVisible]{--os-viewport-overflow-y:visible}[data-overlayscrollbars-viewport~=overflowYHidden]{--os-viewport-overflow-y:hidden}[data-overlayscrollbars-viewport~=overflowYScroll]{--os-viewport-overflow-y:scroll}[data-overlayscrollbars-viewport~=overflowImportant]{overflow-x:var(--os-viewport-overflow-x) !important;overflow-y:var(--os-viewport-overflow-y) !important}[data-overlayscrollbars-viewport~=noContent]:not(#osFakeId){font-size:0 !important;line-height:0 !important}[data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::before,[data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)::after,[data-overlayscrollbars-viewport~=noContent]:not(#osFakeId)>*:not(#osFakeId){display:none !important;position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border-width:0 !important}[data-overlayscrollbars-viewport~=measuring],[data-overlayscrollbars-viewport~=scrolling]{scroll-behavior:auto !important;scroll-snap-type:none !important}[data-overlayscrollbars-viewport~=measuring][data-overlayscrollbars-viewport~=overflowXVisible]{overflow-x:hidden !important}[data-overlayscrollbars-viewport~=measuring][data-overlayscrollbars-viewport~=overflowYVisible]{overflow-y:hidden !important}[data-overlayscrollbars-content]{box-sizing:inherit}[data-overlayscrollbars-contents]:not(#osFakeId):not([data-overlayscrollbars-padding]):not([data-overlayscrollbars-viewport]):not([data-overlayscrollbars-content]){display:contents}[data-overlayscrollbars-grid],[data-overlayscrollbars-grid] [data-overlayscrollbars-padding]{display:grid;grid-template:1fr/1fr}[data-overlayscrollbars-grid]>[data-overlayscrollbars-padding],[data-overlayscrollbars-grid]>[data-overlayscrollbars-viewport],[data-overlayscrollbars-grid]>[data-overlayscrollbars-padding]>[data-overlayscrollbars-viewport]{height:auto !important;width:auto !important}@property --os-scroll-percent{syntax:"<number>";inherits:true;initial-value:0}@property --os-viewport-percent{syntax:"<number>";inherits:true;initial-value:0}.os-scrollbar{--os-viewport-percent:0;--os-scroll-percent:0;--os-scroll-direction:0;--os-scroll-percent-directional:calc(     var(--os-scroll-percent) - (var(--os-scroll-percent) + (1 - var(--os-scroll-percent)) * -1) *       var(--os-scroll-direction)   )}.os-scrollbar{contain:size layout;contain:size layout style;transition:opacity 0.15s, visibility 0.15s, top 0.15s, right 0.15s, bottom 0.15s, left 0.15s;pointer-events:none;position:absolute;opacity:0;visibility:hidden}body>.os-scrollbar{position:fixed;z-index:99999}.os-scrollbar-transitionless{transition:none !important}.os-scrollbar-track{position:relative;padding:0 !important;border:none !important}.os-scrollbar-handle{position:absolute}.os-scrollbar-track,.os-scrollbar-handle{pointer-events:none;width:100%;height:100%}.os-scrollbar.os-scrollbar-track-interactive .os-scrollbar-track,.os-scrollbar.os-scrollbar-handle-interactive .os-scrollbar-handle{pointer-events:auto;touch-action:none}.os-scrollbar-horizontal{bottom:0;left:0}.os-scrollbar-vertical{top:0;right:0}.os-scrollbar-rtl.os-scrollbar-horizontal{right:0}.os-scrollbar-rtl.os-scrollbar-vertical{right:auto;left:0}.os-scrollbar-visible{opacity:1;visibility:visible}.os-scrollbar-auto-hide.os-scrollbar-auto-hide-hidden{opacity:0;visibility:hidden}.os-scrollbar-interaction.os-scrollbar-visible{opacity:1;visibility:visible}.os-scrollbar-unusable,.os-scrollbar-unusable *,.os-scrollbar-wheel,.os-scrollbar-wheel *{pointer-events:none !important}.os-scrollbar-unusable .os-scrollbar-handle{opacity:0 !important;transition:none !important}.os-scrollbar-horizontal .os-scrollbar-handle{bottom:0;left:calc(var(--os-scroll-percent-directional) * 100%);transform:translateX(calc(var(--os-scroll-percent-directional) * -100%));width:calc(var(--os-viewport-percent) * 100%)}.os-scrollbar-vertical .os-scrollbar-handle{right:0;top:calc(var(--os-scroll-percent-directional) * 100%);transform:translateY(calc(var(--os-scroll-percent-directional) * -100%));height:calc(var(--os-viewport-percent) * 100%)}@supports (container-type: size){.os-scrollbar-track{container-type:size}.os-scrollbar-horizontal .os-scrollbar-handle{left:auto;transform:translateX(calc(var(--os-scroll-percent-directional) * 100cqw + var(--os-scroll-percent-directional) * -100%))}.os-scrollbar-vertical .os-scrollbar-handle{top:auto;transform:translateY(calc(var(--os-scroll-percent-directional) * 100cqh + var(--os-scroll-percent-directional) * -100%))}.os-scrollbar-rtl.os-scrollbar-horizontal .os-scrollbar-handle{right:auto;left:0}}.os-scrollbar-rtl.os-scrollbar-vertical .os-scrollbar-handle{right:auto;left:0}.os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless,.os-scrollbar.os-scrollbar-horizontal.os-scrollbar-cornerless.os-scrollbar-rtl{left:0;right:0}.os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless,.os-scrollbar.os-scrollbar-vertical.os-scrollbar-cornerless.os-scrollbar-rtl{top:0;bottom:0}@media print{.os-scrollbar{display:none}}.os-scrollbar{--os-size:0;--os-padding-perpendicular:0;--os-padding-axis:0;--os-track-border-radius:0;--os-track-bg:none;--os-track-bg-hover:none;--os-track-bg-active:none;--os-track-border:none;--os-track-border-hover:none;--os-track-border-active:none;--os-handle-border-radius:0;--os-handle-bg:none;--os-handle-bg-hover:none;--os-handle-bg-active:none;--os-handle-border:none;--os-handle-border-hover:none;--os-handle-border-active:none;--os-handle-min-size:33px;--os-handle-max-size:none;--os-handle-perpendicular-size:100%;--os-handle-perpendicular-size-hover:100%;--os-handle-perpendicular-size-active:100%;--os-handle-interactive-area-offset:0}.os-scrollbar-track{border:var(--os-track-border);border-radius:var(--os-track-border-radius);background:var(--os-track-bg);transition:opacity 0.15s, background-color 0.15s, border-color 0.15s}.os-scrollbar-track:hover{border:var(--os-track-border-hover);background:var(--os-track-bg-hover)}.os-scrollbar-track:active{border:var(--os-track-border-active);background:var(--os-track-bg-active)}.os-scrollbar-handle{border:var(--os-handle-border);border-radius:var(--os-handle-border-radius);background:var(--os-handle-bg)}.os-scrollbar-handle:hover{border:var(--os-handle-border-hover);background:var(--os-handle-bg-hover)}.os-scrollbar-handle:active{border:var(--os-handle-border-active);background:var(--os-handle-bg-active)}.os-scrollbar-track:before,.os-scrollbar-handle:before{content:"";position:absolute;left:0;right:0;top:0;bottom:0;display:block}.os-scrollbar-horizontal{padding:var(--os-padding-perpendicular) var(--os-padding-axis);right:var(--os-size);height:var(--os-size)}.os-scrollbar-horizontal.os-scrollbar-rtl{left:var(--os-size);right:0}.os-scrollbar-horizontal .os-scrollbar-track:before{top:calc(var(--os-padding-perpendicular) * -1);bottom:calc(var(--os-padding-perpendicular) * -1)}.os-scrollbar-horizontal .os-scrollbar-handle{min-width:var(--os-handle-min-size);max-width:var(--os-handle-max-size);height:var(--os-handle-perpendicular-size);transition:opacity 0.15s, background-color 0.15s, border-color 0.15s, height 0.15s}.os-scrollbar-horizontal .os-scrollbar-handle:before{top:calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);bottom:calc(var(--os-padding-perpendicular) * -1)}.os-scrollbar-horizontal:hover .os-scrollbar-handle{height:var(--os-handle-perpendicular-size-hover)}.os-scrollbar-horizontal:active .os-scrollbar-handle{height:var(--os-handle-perpendicular-size-active)}.os-scrollbar-vertical{padding:var(--os-padding-axis) var(--os-padding-perpendicular);bottom:var(--os-size);width:var(--os-size)}.os-scrollbar-vertical .os-scrollbar-track:before{left:calc(var(--os-padding-perpendicular) * -1);right:calc(var(--os-padding-perpendicular) * -1)}.os-scrollbar-vertical .os-scrollbar-handle{min-height:var(--os-handle-min-size);max-height:var(--os-handle-max-size);width:var(--os-handle-perpendicular-size);transition:opacity 0.15s, background-color 0.15s, border-color 0.15s, width 0.15s}.os-scrollbar-vertical .os-scrollbar-handle:before{left:calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);right:calc(var(--os-padding-perpendicular) * -1)}.os-scrollbar-vertical.os-scrollbar-rtl .os-scrollbar-handle:before{right:calc((var(--os-padding-perpendicular) + var(--os-handle-interactive-area-offset)) * -1);left:calc(var(--os-padding-perpendicular) * -1)}.os-scrollbar-vertical:hover .os-scrollbar-handle{width:var(--os-handle-perpendicular-size-hover)}.os-scrollbar-vertical:active .os-scrollbar-handle{width:var(--os-handle-perpendicular-size-active)}[data-overlayscrollbars-viewport~=measuring]>.os-scrollbar,.os-theme-none.os-scrollbar{display:none !important}.os-theme-dark,.os-theme-light{box-sizing:border-box;--os-size:10px;--os-padding-perpendicular:2px;--os-padding-axis:2px;--os-track-border-radius:10px;--os-handle-interactive-area-offset:4px;--os-handle-border-radius:10px}.os-theme-dark{--os-handle-bg:rgba(0, 0, 0, 0.44);--os-handle-bg-hover:rgba(0, 0, 0, 0.55);--os-handle-bg-active:rgba(0, 0, 0, 0.66)}.os-theme-light{--os-handle-bg:rgba(255, 255, 255, 0.44);--os-handle-bg-hover:rgba(255, 255, 255, 0.55);--os-handle-bg-active:rgba(255, 255, 255, 0.66)}[data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport]),[data-overlayscrollbars-viewport~=scrollbarHidden],html[data-overlayscrollbars-viewport~=scrollbarHidden]>body{scrollbar-width:none !important}[data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport])::-webkit-scrollbar,[data-overlayscrollbars-initialize]:not([data-overlayscrollbars-viewport])::-webkit-scrollbar-corner,[data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar,[data-overlayscrollbars-viewport~=scrollbarHidden]::-webkit-scrollbar-corner,html[data-overlayscrollbars-viewport~=scrollbarHidden]>body::-webkit-scrollbar,html[data-overlayscrollbars-viewport~=scrollbarHidden]>body::-webkit-scrollbar-corner{-webkit-appearance:none !important;appearance:none !important;display:none !important;width:0 !important;height:0 !important}[data-overlayscrollbars-initialize]:not([data-overlayscrollbars]):not(html):not(body){overflow:auto}: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-select{display:flex;flex-direction:column;gap:var(--co-spacing-sm2);position:relative}.co-select__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-select__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-select__secondary-label{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1;white-space:nowrap;text-align:right}.co-select--disabled .co-select__label,.co-select--disabled .co-select__secondary-label{color:var(--co-semantic-text-disabled)}.co-select__trigger{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-field);border-radius:var(--co-border-radius-xs);min-height:40px;box-sizing:border-box;cursor:pointer;transition:border-color 0.15s ease, box-shadow 0.15s ease}.co-select--flat .co-select__trigger{background:transparent;border-color:transparent}.co-select__chips{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:var(--co-spacing-xs);padding:var(--co-spacing-xxs) 0}.co-select__chip{display:inline-flex;align-items:center;gap:var(--co-spacing-xs);padding:var(--co-spacing-xxs) var(--co-spacing-sm2);background:var(--co-color-gray-100);border-radius:var(--co-border-radius-full);font-size:var(--co-font-size-14);line-height:1;max-width:200px}.co-select__chip-label{color:var(--co-semantic-text-default);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-select__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 0.1s ease;flex-shrink:0}.co-select__chip-remove:hover{color:var(--co-semantic-text-default)}.co-select--s .co-select__trigger{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-select--sm .co-select__trigger{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-14)}.co-select--lg .co-select__trigger{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-select--open .co-select__trigger{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-select--disabled .co-select__trigger{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-select--error .co-select__trigger{border-color:var(--co-semantic-status-error)}.co-select--success .co-select__trigger{border-color:var(--co-semantic-status-success)}.co-select--warning .co-select__trigger{border-color:var(--co-color-status-review)}.co-select--info .co-select__trigger{border-color:var(--co-semantic-status-info)}.co-select__flag,.co-select__option-flag{flex-shrink:0;width:20px;height:15px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px var(--co-semantic-border-subtle)}.co-select__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-select__text{flex:1;min-width:0;color:var(--co-semantic-text-default);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-select__text--placeholder{color:var(--co-semantic-text-muted)}.co-select--disabled .co-select__text{color:var(--co-semantic-text-disabled)}.co-select__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 0.15s ease}.co-select__clear:hover{color:var(--co-semantic-text-default)}.co-select__caret{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-select__dropdown{padding:var(--co-spacing-sm2)}.co-select__search{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:var(--co-spacing-xs) var(--co-spacing-sm2);margin-bottom:var(--co-spacing-sm2);border:1px solid var(--co-semantic-border-subtle);border-radius:var(--co-border-radius-xs);height:32px;box-sizing:border-box;color:var(--co-semantic-text-muted)}.co-select__search-input{flex:1;min-width:0;border:none;outline:none;background:transparent;font-family:inherit;font-size:var(--co-font-size-14, 14px);line-height:1;color:var(--co-semantic-text-default);padding:0;margin:0}.co-select__search-input::placeholder{color:var(--co-semantic-text-muted)}.co-select__match{font-weight:700;color:var(--co-semantic-text-default)}.co-select__empty{padding:var(--co-spacing-md);text-align:center;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14, 14px)}.co-select__options{max-height:calc(34px * 8);overflow-y:auto}.os-scrollbar.os-theme-co{--os-size:10px;--os-padding-perpendicular:2px;--os-padding-axis:2px;--os-track-bg:transparent;--os-handle-border-radius:var(--co-border-radius-full);--os-handle-bg:var(--co-color-opacity-negro-16);--os-handle-bg-hover:var(--co-color-opacity-negro-25);--os-handle-bg-active:var(--co-color-opacity-negro-50);--os-handle-min-size:24px}.co-select__option{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);border-radius:var(--co-border-radius-xs);cursor:pointer;transition:background 0.1s ease;min-height:32px;box-sizing:border-box}.co-select__option:hover{background:var(--co-semantic-surface-hover)}.co-select__option--selected{background:var(--co-semantic-surface-muted)}.co-select__option--disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}.co-select__option-icon{flex-shrink:0;color:var(--co-semantic-text-muted)}.co-select__option-label{flex:1;color:var(--co-semantic-text-default);font-size:var(--co-font-size-14);font-weight:400;line-height:1}.co-select__option-check{flex-shrink:0;color:var(--co-semantic-text-default)}.co-select__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs)}.co-select__helper-icon{flex-shrink:0;display:flex;align-items:center}.co-select__helper-text{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:400;line-height:1}.co-select__helper--error .co-select__helper-icon,.co-select__helper--error .co-select__helper-text{color:var(--co-semantic-status-error)}.co-select__helper--success .co-select__helper-icon,.co-select__helper--success .co-select__helper-text{color:var(--co-semantic-status-success)}.co-select__helper--warning .co-select__helper-icon,.co-select__helper--warning .co-select__helper-text{color:var(--co-color-status-review)}.co-select__helper--info .co-select__helper-icon,.co-select__helper--info .co-select__helper-text{color:var(--co-semantic-status-info)}:host([layout=\'horizontal\']) .co-select{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-select__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout=\'horizontal\']) .co-select__label{white-space:normal}:host([layout=\'horizontal\']) .co-select>:not(.co-select__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_select}

package/dist/collection/collection-manifest.json

@@ -27,6 +27,8 @@
     "components/co-calendar/co-calendar.js",
     "components/co-calendar-month/co-calendar-month.js",
     "components/co-card/co-card.js",
+    "components/co-carousel/co-carousel.js",
+    "components/co-carousel-item/co-carousel-item.js",
     "components/co-checkbox/co-checkbox.js",
     "components/co-chip/co-chip.js",
     "components/co-color-picker/co-color-picker.js",

package/dist/collection/components/co-autocomplete/co-autocomplete.css

@@ -58,7 +58,7 @@
   /* Figma Text Field parity (same box as co-input): solid page surface +
      Negro 25% border — tinted glass didn't read as editable on white. */
   background: var(--co-semantic-surface-page);
-  border: 1px solid var(--co-color-opacity-negro-25, rgba(31, 28, 27, 0.25));
+  border: 1px solid var(--co-semantic-border-field);
   border-radius: var(--co-border-radius-xs);
   min-height: 40px;
   box-sizing: border-box;

package/dist/collection/components/co-avatar/co-avatar.css

@@ -74,3 +74,26 @@
 .co-avatar--light {
   color: rgba(0, 0, 0, 0.87);
 }
+
+/* When `name` is set, co-avatar.tsx wraps the disc in <co-tooltip> so every
+   consumer gets the tooltip for free — mirrors exactly how co-avatar-group
+   used to wrap co-avatar from the outside (`.co-avatar-group__slot`, still
+   used there for the "+N" overflow badge). Same fix, same reason: co-tooltip's
+   own :host defaults to `display: inline-block` with no explicit line-height,
+   and its internal trigger div is inline-block too — left alone that
+   reproduces the classic "inline-block descender gap" against co-avatar's
+   `:host { display: inline-flex }`, growing the box and throwing off
+   vertical centering wherever co-avatar sits.
+   - `display: inline-flex` blockifies co-tooltip's own shadow child instead of
+     leaving it as inline content in normal flow.
+   - `align-items: center` centers that child on the cross axis.
+   - `line-height: 0` is an *inherited* property that flows all the way down
+     through co-tooltip's shadow tree regardless of display, zeroing every
+     nested line-box's leading.
+   Net effect: co-tooltip renders as a fully transparent, non-sizing wrapper —
+   identical width/height/alignment to the no-tooltip case. */
+co-tooltip {
+  display: inline-flex;
+  align-items: center;
+  line-height: 0;
+}

package/dist/collection/components/co-avatar/co-avatar.js

@@ -42,7 +42,7 @@ export class CoAvatar {
             : this.type === 'image'
                 ? (_e = (_d = this.alt) !== null && _d !== void 0 ? _d : this.text) !== null && _e !== void 0 ? _e : this.icon
                 : this.icon;
-        return (h("div", { key: '41da32ebacadf5fd33c9f6a10ac0069ddaa81ce6', class: {
+        const disc = (h("div", { class: {
                 'co-avatar': true,
                 [`co-avatar--${this.size}`]: true,
                 [`co-avatar--${this.type}`]: true,
@@ -51,6 +51,10 @@ export class CoAvatar {
             }, style: Object.assign(Object.assign({ width: `var(--co-avatar-size, ${dim}px)`, height: `var(--co-avatar-size, ${dim}px)`, fontSize }, (this.color ? { background: this.color } : {})), (this.ringColor
                 ? { '--co-avatar-border-color': this.ringColor, '--co-avatar-border-width': '2px' }
                 : {})), part: "avatar", role: "img", "aria-label": ariaLabel }, showImage ? (h("img", { class: "co-avatar__img", src: this.src, alt: (_g = (_f = this.alt) !== null && _f !== void 0 ? _f : this.text) !== null && _g !== void 0 ? _g : '', onError: this.handleImgError })) : this.type === 'icon' ? (h("co-icon", { name: this.icon, weight: this.iconWeight, size: iconSize })) : (h("span", { class: "co-avatar__text" }, this.text))));
+        // No tooltip when `name` is unset/empty — renders exactly as before, no wrapper.
+        if (!this.name)
+            return disc;
+        return h("co-tooltip", { content: this.name }, disc);
     }
     static get is() { return "co-avatar"; }
     static get encapsulation() { return "shadow"; }
@@ -260,6 +264,25 @@ export class CoAvatar {
                 "setter": false,
                 "reflect": true,
                 "attribute": "ring-color"
+            },
+            "name": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Full name / tooltip content. When set (non-empty), the avatar renders\nwrapped in a `co-tooltip` showing this text on hover/focus \u2014 every\nconsumer gets the tooltip for free instead of having to wire it up\nexternally. When unset, renders exactly as before (no wrapper)."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "name"
             }
         };
     }

package/dist/collection/components/co-avatar-group/co-avatar-group.css

@@ -33,10 +33,12 @@
   box-shadow: 0 0 0 2px var(--co-semantic-surface-page), 0 0 0 4px var(--co-semantic-border-focus);
 }
 
-/* Per-avatar tooltip wrapper — a transparent flex item so the stack lays out
-   exactly as if the avatars were direct children. `line-height: 0` (inherited
+/* Overflow-badge tooltip wrapper (co-avatar itself now carries its own tooltip
+   via its `name` prop — see co-avatar.css — so this only wraps the "+N" badge,
+   which isn't a co-avatar). A transparent flex item so the stack lays out
+   exactly as if the badge were a direct child. `line-height: 0` (inherited
    into co-tooltip's inline-block trigger) removes the baseline strut that would
-   otherwise push each avatar off-center vertically. */
+   otherwise push it off-center vertically. */
 .co-avatar-group__slot {
   display: inline-flex;
   align-items: center;
@@ -59,8 +61,10 @@
   box-shadow: 0 0 0 var(--co-avatar-group-ring-width, 2px) var(--co-semantic-surface-page);
 }
 
-/* The avatars are slotted into co-tooltip's inline-block trigger; align them to
-   the middle of that line box so the photo/text discs sit on one row. */
+/* The overflow badge is slotted into co-tooltip's inline-block trigger; align it
+   to the middle of that line box so it sits on the same row as the avatars.
+   (Avatars are plain flex children now — vertical-align is a no-op for them,
+   harmless to keep for the shared rule.) */
 .co-avatar-group__avatar,
 .co-avatar-group__overflow {
   vertical-align: middle;

package/dist/collection/components/co-avatar-group/co-avatar-group.js

@@ -61,8 +61,8 @@ export class CoAvatarGroup {
                 'co-avatar-group--interactive': this.interactive,
             } }, interactiveAttrs), visible.map((it, i) => {
             var _a, _b, _c;
-            return (h("co-tooltip", { key: i, class: "co-avatar-group__slot", content: it.name || it.text || '', placement: "bottom" }, h("co-avatar", { class: "co-avatar-group__avatar", type: (_a = it.type) !== null && _a !== void 0 ? _a : (it.src ? 'image' : it.icon ? 'icon' : 'text'), size: this.size, shape: (_b = it.shape) !== null && _b !== void 0 ? _b : this.shape, text: it.text, src: it.src, icon: (_c = it.icon) !== null && _c !== void 0 ? _c : 'user', color: it.color, "ring-color": it.ringColor })));
-        }), extra > 0 && (h("co-tooltip", { key: 'c2888162dd23d0b1a2c853e6adbe7a8f5f61efe5', class: "co-avatar-group__slot", content: overflowLabel, placement: "bottom" }, h("div", { key: '5f0d9a321b52db23356b107564605b18b8c75692', class: "co-avatar-group__overflow", style: { width: `${dim}px`, height: `${dim}px`, fontSize }, role: "img", "aria-label": `+${extra}` }, "+", extra)))));
+            return (h("co-avatar", { key: i, class: "co-avatar-group__avatar", type: (_a = it.type) !== null && _a !== void 0 ? _a : (it.src ? 'image' : it.icon ? 'icon' : 'text'), size: this.size, shape: (_b = it.shape) !== null && _b !== void 0 ? _b : this.shape, text: it.text, src: it.src, icon: (_c = it.icon) !== null && _c !== void 0 ? _c : 'user', color: it.color, "ring-color": it.ringColor, name: it.name || it.text || '' }));
+        }), extra > 0 && (h("co-tooltip", { key: 'b6dffe856f5984d2e2731e84d9d4a46cfcfa0c7b', class: "co-avatar-group__slot", content: overflowLabel, placement: "bottom" }, h("div", { key: 'b7fe90ee1800ede2bdc3b8674d6ab0dcdfa4ac48', class: "co-avatar-group__overflow", style: { width: `${dim}px`, height: `${dim}px`, fontSize }, role: "img", "aria-label": `+${extra}` }, "+", extra)))));
     }
     static get is() { return "co-avatar-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-badge/co-badge.js

@@ -10,7 +10,7 @@ export class CoBadge {
         this.color = 'default';
     }
     render() {
-        return (h("span", { key: 'f805a0acdea25b90802785fa7cf5e7115d60e3c3', class: {
+        return (h("span", { key: '7c3421c8ace895670435fc85850877a5b38771de', class: {
                 'co-badge': true,
                 [`co-badge--${this.size}`]: true,
                 [`co-badge--${this.color}`]: true,

package/dist/collection/components/co-bottom-sheet/co-bottom-sheet.js

@@ -255,13 +255,13 @@ export class CoBottomSheet {
         (_a = this.bodyEl) === null || _a === void 0 ? void 0 : _a.removeEventListener('touchmove', this.touchBlocker);
     }
     render() {
-        return (h("div", { key: '6655150e6dfb829ae937433983d93e0a16b4f544', class: { 'co-bottom-sheet-root': true, 'co-bottom-sheet-root--open': this.open } }, h("div", { key: '3657a637ec0ac2705375805381be639bc3da4b82', class: "co-bottom-sheet__backdrop", part: "backdrop", onClick: this.handleBackdropClick, ref: (el) => (this.backdropEl = el) }), h("section", { key: 'f3cac714dbc2703506a51fd960c34b64b33731b1', class: { 'co-bottom-sheet': true, 'co-bottom-sheet--open': this.open }, part: "sheet", role: "dialog", "aria-modal": "true", "aria-labelledby": this.heading ? 'co-bottom-sheet-heading' : undefined, style: { '--co-bottom-sheet-max-height': this.maxHeight }, onTransitionEnd: this.handleTransitionEnd, ref: (el) => (this.sheetEl = el) }, h("div", { key: '063d6b43784022a2646614b0462c8c8dccce1320', class: "co-bottom-sheet__grip", onPointerDown: this.handleGripPointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel }, this.showHandle && (h("div", { key: '8e9611f02a9d59e9af91d77b476b7e8f93724aa4', class: "co-bottom-sheet__handle", part: "handle", "aria-hidden": "true" })), h("header", { key: 'f58de5177d9620ea61cffba530ef190936537194', class: {
+        return (h("div", { key: 'ccd802fd80f14dfa7b2e3998d1ae1936db0a03b1', class: { 'co-bottom-sheet-root': true, 'co-bottom-sheet-root--open': this.open } }, h("div", { key: '6838b998e719fc99ab35f87fa250986d1eeb60a1', class: "co-bottom-sheet__backdrop", part: "backdrop", onClick: this.handleBackdropClick, ref: (el) => (this.backdropEl = el) }), h("section", { key: 'd621eac2f34e19a6a2c0fc91e13b17ea832b5c83', class: { 'co-bottom-sheet': true, 'co-bottom-sheet--open': this.open }, part: "sheet", role: "dialog", "aria-modal": "true", "aria-labelledby": this.heading ? 'co-bottom-sheet-heading' : undefined, style: { '--co-bottom-sheet-max-height': this.maxHeight }, onTransitionEnd: this.handleTransitionEnd, ref: (el) => (this.sheetEl = el) }, h("div", { key: '2c304cb9f8ed0672327dcc6d638b2d849d6774c6', class: "co-bottom-sheet__grip", onPointerDown: this.handleGripPointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel }, this.showHandle && (h("div", { key: '0210a476819c8938bb8c075305a27744b87f0ef9', class: "co-bottom-sheet__handle", part: "handle", "aria-hidden": "true" })), h("header", { key: '6daf41852652d8edd478c22a24444d3b040e8799', class: {
                 'co-bottom-sheet__header': true,
                 'co-bottom-sheet__header--show': this.hasHeaderSlot || !!this.heading,
-            }, part: "header" }, h("slot", { key: '76fda370a9276e99d41782f08312e6e887dafd21', name: "header", onSlotchange: this.handleHeaderSlotChange }, this.heading && (h("h2", { key: 'dcc7ba68ba7b306805ca49881a4808947217392a', class: "co-bottom-sheet__heading", id: "co-bottom-sheet-heading" }, this.heading))))), h("div", { key: '55fd08122d422bbfe0cef9d7a64297e481349172', class: "co-bottom-sheet__body", part: "body", onPointerDown: this.handleBodyPointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel, ref: (el) => (this.bodyEl = el) }, h("slot", { key: '3c86d67c93d8c64458e431ab959704f4e43b382b' })), h("footer", { key: '14a97f22eee74e514111d87414e23cf1580e1456', class: {
+            }, part: "header" }, h("slot", { key: 'a94f197b04d719b5a7b1a542872f0dd2bed5dfea', name: "header", onSlotchange: this.handleHeaderSlotChange }, this.heading && (h("h2", { key: '800ffa106c145984ff78871a74f92156df05976c', class: "co-bottom-sheet__heading", id: "co-bottom-sheet-heading" }, this.heading))))), h("div", { key: '36642b98971f32641b72066689f0f773854e2fcc', class: "co-bottom-sheet__body", part: "body", onPointerDown: this.handleBodyPointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel, ref: (el) => (this.bodyEl = el) }, h("slot", { key: '8a4977dc85e78cd9d27ff6a2ce40841267592341' })), h("footer", { key: '70217d27c09544adc56e751163033e25d5d72e69', class: {
                 'co-bottom-sheet__footer': true,
                 'co-bottom-sheet__footer--show': this.hasFooter,
-            }, part: "footer" }, h("slot", { key: 'd2b6fbeca8233f3d6e33d6be7b05bd4a2fe5d59f', name: "footer", onSlotchange: this.handleFooterSlotChange })))));
+            }, part: "footer" }, h("slot", { key: '6aa16a159e2161c491015ae0c88c542506f632a2', name: "footer", onSlotchange: this.handleFooterSlotChange })))));
     }
     static get is() { return "co-bottom-sheet"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-breadcrumb/co-breadcrumb.js

@@ -42,7 +42,7 @@ export class CoBreadcrumb {
     }
     render() {
         const data = this.parseItems();
-        return (h(Host, { key: '3306e9e038677813f1c16183e4fb3a146d723643', part: "breadcrumb", role: "navigation", "aria-label": "Breadcrumb" }, data
+        return (h(Host, { key: 'a673dfd80990deed0263168a4dc9cac5029e4956', part: "breadcrumb", role: "navigation", "aria-label": "Breadcrumb" }, data
             ? data.map((it, i) => (h("co-breadcrumb-item", { key: i, label: it.label, value: it.value, icon: it.icon, separator: this.separator, current: i === data.length - 1 })))
             : h("slot", { onSlotchange: this.handleSlotChange })));
     }

package/dist/collection/components/co-breadcrumb-item/co-breadcrumb-item.js

@@ -29,10 +29,10 @@ export class CoBreadcrumbItem {
         };
     }
     render() {
-        return (h(Host, { key: '984f754b9123ff35cf5f0239ad4fc103498e47b4', part: "breadcrumb-item", class: {
+        return (h(Host, { key: 'e7eea637e057de29afed6c742df7c2576781391d', part: "breadcrumb-item", class: {
                 'co-breadcrumb-item': true,
                 'co-breadcrumb-item--current': this.current,
-            } }, h("span", { key: '4eb611d93cd5bd980eec023e0295f5c6b8fd7901', class: "co-breadcrumb-item__sep", "aria-hidden": "true" }, h("co-icon", { key: '858d8393d7025b0f2c128c9fa21420f37f2e5fca', name: this.separator, size: 13 })), h("span", { key: '8ca11884ee1fa419593925bc704e16026f376bfc', class: "co-breadcrumb-item__content", part: "content", role: "link", tabindex: "0", "aria-current": this.current ? 'page' : undefined, onClick: this.handleClick, onKeyDown: this.handleKeydown }, this.icon && (h("span", { key: '6fbbaaa99958fd14f67f0ca8441333e5410f546d', class: "co-breadcrumb-item__icon" }, h("co-icon", { key: 'a8b5c0170d2016e9a90a823341955a93d5ce8686', name: this.icon, size: 16 }))), h("span", { key: '77e9c2f8da437bc35bfb07e7d6caf3a959c96036', class: "co-breadcrumb-item__label" }, this.label, h("slot", { key: '10cb84e411006ff74528ae4ee9610e560929535f' })))));
+            } }, h("span", { key: '241fe723b758d9daabfd53f676998e0d2abceac8', class: "co-breadcrumb-item__sep", "aria-hidden": "true" }, h("co-icon", { key: 'a6e4c54dfecbb25f6e1b1377d3a9b10fb7abdd73', name: this.separator, size: 13 })), h("span", { key: 'a8c960f9e45681520f2e6ad9c80343701219211d', class: "co-breadcrumb-item__content", part: "content", role: "link", tabindex: "0", "aria-current": this.current ? 'page' : undefined, onClick: this.handleClick, onKeyDown: this.handleKeydown }, this.icon && (h("span", { key: '8f585b1d2c212c5820aad49deee512fcf11fb7f2', class: "co-breadcrumb-item__icon" }, h("co-icon", { key: '8c3b5eae1e0459fe9184973e1fb097f849ebd2eb', name: this.icon, size: 16 }))), h("span", { key: '30892098c3b834213fbab6fa49ce2a87a24a0096', class: "co-breadcrumb-item__label" }, this.label, h("slot", { key: 'fa8d5d15b3773fcc085eeb932b6dcc154aed5829' })))));
     }
     static get is() { return "co-breadcrumb-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-button/co-button.js

@@ -46,7 +46,7 @@ export class CoButton {
             customStyle.background = this.color;
         if (this.textColor)
             customStyle.color = this.textColor;
-        return (h("button", { key: '7ecb9c79b6d2f333ad50f71847953ef676692a81', class: {
+        return (h("button", { key: '97c11bee8f9bb11bb6585439c3c12698b0d95ecb', class: {
                 'co-button': true,
                 [`co-button--${this.variant}`]: true,
                 [`co-button--${this.shape}`]: true,
@@ -56,7 +56,7 @@ export class CoButton {
                 'co-button--disabled': this.disabled,
             }, style: Object.keys(customStyle).length ? customStyle : undefined, type: this.type, disabled: this.disabled, onClick: this.handleClick, part: "button" }, this.iconLeft
             ? h("co-icon", { name: this.iconLeft, weight: this.iconWeight, size: iconSize })
-            : null, h("slot", { key: 'b7a325f24ec63c71121dfb74e82467e4b36fdd06' }, this.label), this.iconRight
+            : null, h("slot", { key: '092f58acb6dfa810ce4f5bcdc19ab15dff69104a' }, this.label), this.iconRight
             ? h("co-icon", { name: this.iconRight, weight: this.iconWeight, size: iconSize })
             : null));
     }

package/dist/collection/components/co-button-group/co-button-group.js

@@ -10,12 +10,12 @@ export class CoButtonGroup {
         this.disabled = false;
     }
     render() {
-        return (h("div", { key: '4a058e55c2e0ede15115f25ff2bb91ea5b7f88ca', class: {
+        return (h("div", { key: '420d7fa2d9322ef3ec77e87343367f05a0de3d17', class: {
                 'co-button-group': true,
                 [`co-button-group--${this.direction}`]: true,
                 [`co-button-group--${this.variant}`]: true,
                 'co-button-group--disabled': this.disabled,
-            }, role: "group" }, h("slot", { key: '3d51651d39929c6989129c5dc9e8f5536598f1ac' })));
+            }, role: "group" }, h("slot", { key: 'ede5ab0f16e003619e2aa51945c748bbe7414523' })));
     }
     static get is() { return "co-button-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-calendar/co-calendar.js

@@ -363,7 +363,7 @@ export class CoCalendar {
     render() {
         var _a, _b;
         const t = getDateStrings(this.locale);
-        return (h("div", { key: '0ac8e641a51319d8c46c2c22dfa5d059d208060f', class: "co-calendar", part: "root" }, h("div", { key: 'b97ce34ea675a7936d80b47daafa1c2ee3db4325', class: "co-calendar__header", part: "header" }, h("button", { key: 'c02f19300f44dcc31fa233290449af38146fdc05', type: "button", class: "co-calendar__nav", onClick: this.handlePrev, "aria-label": (_a = this.prevMonthLabel) !== null && _a !== void 0 ? _a : t.prevMonth }, h("co-icon", { key: '73bbc58da5b724b48aba584233e591eb196b1cba', name: "caret-left", size: 16 })), h("button", { key: '19f1a44b9f74c529c81c76f677c9ec08143c1b2a', type: "button", class: "co-calendar__title", "aria-live": "polite", onClick: this.toggleView }, this.headerTitle(), h("co-icon", { key: 'f78863f1ac71fb17b49c3a8bd19d709c4f9326e4', name: "caret-down", size: 12, class: "co-calendar__title-caret" })), h("button", { key: '13ab9824881a7346422fe178ccdb02ea279e6070', type: "button", class: "co-calendar__nav", onClick: this.handleNext, "aria-label": (_b = this.nextMonthLabel) !== null && _b !== void 0 ? _b : t.nextMonth }, h("co-icon", { key: '66611f127b366f9f8132bfb3354badfd9e562b99', name: "caret-right", size: 16 }))), this.view === 'days' && this.renderDays(t), this.view === 'months' && this.renderMonths(), this.view === 'years' && this.renderYears()));
+        return (h("div", { key: 'fa986ed0bf6bfa7627832868ed26a2f614d7105c', class: "co-calendar", part: "root" }, h("div", { key: '0c86b865fee2c71fb42bacf7a87ab28f2c1a06d1', class: "co-calendar__header", part: "header" }, h("button", { key: 'de9c951364750e616f03cf83ce06a74ee7b4ba36', type: "button", class: "co-calendar__nav", onClick: this.handlePrev, "aria-label": (_a = this.prevMonthLabel) !== null && _a !== void 0 ? _a : t.prevMonth }, h("co-icon", { key: '44f0feeecf0ad89e39afb1c353bc40a8c1dabc96', name: "caret-left", size: 16 })), h("button", { key: '14350a7ca5aedf29d49ddfcecd6f0c098a3fbf5e', type: "button", class: "co-calendar__title", "aria-live": "polite", onClick: this.toggleView }, this.headerTitle(), h("co-icon", { key: 'af1f42e2efac0338e4d1af9c29c2b233fd0a4fbf', name: "caret-down", size: 12, class: "co-calendar__title-caret" })), h("button", { key: '0d34428c859f99d0689cf405a54effee4d9e91e7', type: "button", class: "co-calendar__nav", onClick: this.handleNext, "aria-label": (_b = this.nextMonthLabel) !== null && _b !== void 0 ? _b : t.nextMonth }, h("co-icon", { key: '52a7ccc6e7081221a9f81b25e8352e7e50ba864b', name: "caret-right", size: 16 }))), this.view === 'days' && this.renderDays(t), this.view === 'months' && this.renderMonths(), this.view === 'years' && this.renderYears()));
     }
     static get is() { return "co-calendar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-calendar-month/co-calendar-month.js

@@ -200,7 +200,7 @@ export class CoCalendarMonth {
         const short = getWeekdayLabels(this.locale, this.firstDayOfWeek, 'short');
         const long = getWeekdayLabels(this.locale, this.firstDayOfWeek, 'long');
         const today = todayYMD();
-        return (h("div", { key: '94afb2cd963e8292d09dda372b7f115e235c8cd3', class: "cal-month", part: "grid", role: "grid", onKeyDown: this.handleKeyDown }, h("div", { key: '381021f254ac5f36d3d59e108cbe64f7f4fb1b91', class: "cal-month__dow", role: "row" }, short.map((lbl, i) => (h("span", { class: "cal-month__dow-cell", role: "columnheader", "aria-label": long[i] }, lbl)))), matrix.map((week, wi) => {
+        return (h("div", { key: '51781013cbfce9f2e8d07de9a46766c3a9326cbe', class: "cal-month", part: "grid", role: "grid", onKeyDown: this.handleKeyDown }, h("div", { key: 'ee3545fbd982390cd233cb54b33060b7cb9b08e1', class: "cal-month__dow", role: "row" }, short.map((lbl, i) => (h("span", { class: "cal-month__dow-cell", role: "columnheader", "aria-label": long[i] }, lbl)))), matrix.map((week, wi) => {
             var _a;
             return (h("div", { class: "cal-month__week", role: "row" }, h("div", { class: "cal-month__days" }, week.map((date) => {
                 const ymd = parseISO(date);

package/dist/collection/components/co-card/co-card.js

@@ -29,13 +29,13 @@ export class CoCard {
         return nodes.length > 0;
     }
     render() {
-        return (h("div", { key: 'accbb972f6881a7e13b37a5523d10a3614730603', class: {
+        return (h("div", { key: 'e1ea28f75af30a37b0a0792b9302c982c2b45094', class: {
                 'co-card': true,
                 [`co-card--${this.variant}`]: true,
                 [`co-card--pad-${this.padding}`]: true,
                 'co-card--clickable': this.clickable,
                 'co-card--stretch': this.stretch,
-            }, part: "card", role: this.clickable ? 'button' : undefined, tabIndex: this.clickable ? 0 : undefined }, h("div", { key: '282946088ac5d725587fbc21678e09b430ac2492', class: { 'co-card__header': true, 'co-card__header--empty': !this.hasHeader }, part: "header" }, h("slot", { key: '7a23d56c1c2024fe163f6d4dc8d484cf8b718901', name: "header", onSlotchange: this.handleHeaderSlotChange })), h("div", { key: 'dcec3cc0ab89d8e9b5abbc4bded028a18f5108a9', class: "co-card__body", part: "body" }, h("slot", { key: '94b9b7db62590372a19b87372c2c288658848896' })), h("div", { key: '8aa4852f91fdaa4ad785b7d6f90f6c9d1dffef99', class: { 'co-card__footer': true, 'co-card__footer--empty': !this.hasFooter }, part: "footer" }, h("slot", { key: '3417ff7a18b113f42b172593e86fafc8268c613a', name: "footer", onSlotchange: this.handleFooterSlotChange }))));
+            }, part: "card", role: this.clickable ? 'button' : undefined, tabIndex: this.clickable ? 0 : undefined }, h("div", { key: 'e0019a733fcff7c2dfd83e828e7dd5e65febf833', class: { 'co-card__header': true, 'co-card__header--empty': !this.hasHeader }, part: "header" }, h("slot", { key: 'aff49ea9c68e0d7a9f01660204e7dee4adfce624', name: "header", onSlotchange: this.handleHeaderSlotChange })), h("div", { key: '4a72f6d3549a1495e39a18ce3ee940c49e336a84', class: "co-card__body", part: "body" }, h("slot", { key: '48b574aac71e28f58938c8a7586f00f120a372f5' })), h("div", { key: 'cc6bd0344905c13602383e0a6c89b725cbffe2fb', class: { 'co-card__footer': true, 'co-card__footer--empty': !this.hasFooter }, part: "footer" }, h("slot", { key: 'fb5bfec7c5b62715002cc002807889e81a2f5df4', name: "footer", onSlotchange: this.handleFooterSlotChange }))));
     }
     static get is() { return "co-card"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-carousel/co-carousel.css

@@ -0,0 +1,152 @@
+/* ═══════════════════════════════════════════════════
+   co-carousel
+   ═══════════════════════════════════════════════════ */
+
+:host {
+  display: block;
+  font-family: var(--co-font-family-primary);
+  --co-carousel-arrow-size: 36px;
+  /* surface-page, NOT surface-primary: primary es la superficie INVERSA
+     (negra en light) y con text-default daba ícono negro sobre círculo
+     negro en ambos temas. page + text-default flipan juntas. */
+  --co-carousel-arrow-bg: var(--co-semantic-surface-page);
+  --co-carousel-arrow-color: var(--co-semantic-text-default);
+  --co-carousel-dot-size: 6px;
+  --co-carousel-dot-color: var(--co-semantic-border-default);
+  --co-carousel-dot-active-color: var(--co-semantic-text-default);
+  --co-carousel-transition: 320ms cubic-bezier(0.25, 0.8, 0.4, 1);
+}
+
+/* ─── Container ─────────────────────────────────── */
+
+.co-carousel {
+  position: relative;
+  width: 100%;
+  outline: none;
+}
+
+.co-carousel:focus-visible {
+  outline: 2px solid var(--co-semantic-border-focus-ring);
+  outline-offset: 2px;
+  border-radius: var(--co-border-radius-sm);
+}
+
+/* ─── Aspect Ratios (union de co-video) ─────────── */
+
+.co-carousel--16-9 { aspect-ratio: 16 / 9; }
+.co-carousel--4-3  { aspect-ratio: 4 / 3; }
+.co-carousel--1-1  { aspect-ratio: 1 / 1; }
+.co-carousel--21-9 { aspect-ratio: 21 / 9; }
+.co-carousel--auto { aspect-ratio: unset; }
+
+.co-carousel--16-9 .co-carousel__viewport,
+.co-carousel--4-3 .co-carousel__viewport,
+.co-carousel--1-1 .co-carousel__viewport,
+.co-carousel--21-9 .co-carousel__viewport {
+  position: absolute;
+  inset: 0;
+}
+
+/* ─── Viewport & track ──────────────────────────── */
+
+.co-carousel__viewport {
+  overflow: hidden;
+  width: 100%;
+  height: 100%;
+  touch-action: pan-y;
+}
+
+.co-carousel__track {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  transition: transform var(--co-carousel-transition);
+  will-change: transform;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .co-carousel__track {
+    transition: none;
+  }
+}
+
+/* ─── Arrows ────────────────────────────────────── */
+
+.co-carousel__arrow {
+  position: absolute;
+  top: 50%;
+  transform: translateY(-50%);
+  width: var(--co-carousel-arrow-size);
+  height: var(--co-carousel-arrow-size);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid var(--co-semantic-border-subtle);
+  border-radius: 50%;
+  background: var(--co-carousel-arrow-bg);
+  color: var(--co-carousel-arrow-color);
+  cursor: pointer;
+  padding: 0;
+  opacity: 0.9;
+  transition: opacity 120ms ease, background 120ms ease;
+  z-index: 1;
+}
+
+.co-carousel__arrow:hover {
+  opacity: 1;
+  background: var(--co-semantic-surface-hover);
+}
+
+.co-carousel__arrow:focus-visible {
+  outline: 2px solid var(--co-semantic-border-focus-ring);
+  outline-offset: 1px;
+}
+
+.co-carousel__arrow--prev { left: var(--co-spacing-sm, 8px); }
+.co-carousel__arrow--next { right: var(--co-spacing-sm, 8px); }
+
+.co-carousel__arrow--disabled {
+  opacity: 0.35;
+  cursor: default;
+  pointer-events: none;
+}
+
+/* ─── Dots ──────────────────────────────────────── */
+
+.co-carousel__dots {
+  position: absolute;
+  left: 50%;
+  bottom: var(--co-spacing-sm, 8px);
+  transform: translateX(-50%);
+  display: flex;
+  gap: 6px;
+  padding: 6px 10px;
+  border-radius: var(--co-border-radius-xl);
+  /* Scrim sobre surface-page (misma razón que las flechas: primary es la
+     superficie inversa y dejaba el dot activo text-default sin contraste). */
+  background: color-mix(in srgb, var(--co-semantic-surface-page) 65%, transparent);
+  backdrop-filter: blur(4px);
+  z-index: 1;
+}
+
+.co-carousel__dot {
+  width: var(--co-carousel-dot-size);
+  height: var(--co-carousel-dot-size);
+  border-radius: 50%;
+  border: none;
+  padding: 0;
+  background: var(--co-carousel-dot-color);
+  cursor: pointer;
+  transition: background 120ms ease, width 200ms ease;
+}
+
+.co-carousel__dot--active {
+  background: var(--co-carousel-dot-active-color);
+  width: calc(var(--co-carousel-dot-size) * 2.6);
+  border-radius: var(--co-border-radius-xl);
+}
+
+.co-carousel__dot:focus-visible {
+  outline: 2px solid var(--co-semantic-border-focus-ring);
+  outline-offset: 1px;
+}