@prolibu-suite/cobalt-core 0.10.4 → 0.11.1

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

@@ -14,26 +14,43 @@ const DRAG_THRESHOLD_PX = 5;
  * `dates` = 7 day-keys (week) or 1 (day). Presentation + interaction only; the
  * host owns data (CONTROLLED). All instant math is delegated to the engine — the
  * only timezone boundary is the `timeZone` prop (wall-clock render).
+ *
+ * Es la vista Semana/Día que compone `co-event-calendar`; se usa directo solo
+ * para una grilla horaria propia. Sus eventos NO burbujean ni cruzan el shadow
+ * DOM: se escuchan sobre el propio elemento. Wrapper Vue: `CoCalendarTimegrid`
+ * de `@prolibu-suite/cobalt-vue`.
  */
 export class CoCalendarTimegrid {
     constructor() {
+        /** Eventos ya normalizados por el motor (`@prolibu-suite/cobalt-calendar-utils`); propiedad JS. */
         this.events = [];
         /** Visible day keys "YYYY-MM-DD" (7 = week, 1 = day). */
         this.dates = [];
+        /** Locale BCP-47 de las cabeceras de día y las etiquetas de hora. */
         this.locale = 'es-CO';
+        /** Permite mover y redimensionar eventos arrastrando (salvo los que traen `editable: false`); emite `coEventDrop`. */
         this.editable = true;
+        /** Permite seleccionar un rango en un área vacía para crear; emite `coRangeSelect`. */
         this.selectable = true;
+        /** Minutos por fila de la grilla (default 15); también el paso del teclado. */
         this.slotMinutes = 15;
+        /** Minutos a los que se ajustan arrastres y selecciones (default 15). */
         this.snapMinutes = 15;
+        /** Duración en minutos del rango creado con un click simple (default 60). */
         this.defaultDurationMinutes = 60;
+        /** Hora `HH:mm` a la que scrollea la grilla al montar (default 07:00). */
         this.scrollTime = '07:00';
+        /** Línea de «ahora» en la columna del día actual. */
         this.nowIndicator = true;
         /** Cargando: en vez de los eventos pinta bloques skeleton en las columnas.
          *  La grilla (eje de horas, líneas, cabecera de días, franja de todo-el-día)
          *  se mantiene: lo único que todavía no se sabe son los eventos. */
         this.loading = false;
+        /** Franja superior de eventos de todo el día. */
         this.allDaySlot = true;
+        /** Primera hora visible `HH:mm` (default 00:00). */
         this.minTime = '00:00';
+        /** Última hora visible `HH:mm` (default 24:00). */
         this.maxTime = '24:00';
         /** Minute of "now" for the indicator; refreshed on a 60s timer. */
         this.nowMinutes = 0;
@@ -704,11 +721,11 @@ export class CoCalendarTimegrid {
             '--co-cal-hour-h': `calc(${60 / this.slotM} * var(--co-cal-slot-h))`,
             '--co-cal-hour-offset': `calc(${((60 - (this.minM % 60)) % 60) / this.slotM} * var(--co-cal-slot-h))`,
         };
-        return (h("div", { key: '6714fb717616dff758156f0fcf6d50370bcc52e0', class: "tg", tabIndex: 0, onKeyDown: this.handleKeyDown, ref: (el) => (this.rootEl = el) }, h("div", { key: '86aa3ebcc5c8c3e66fc200b25819b8806a8883fa', class: "tg__head" }, h("div", { key: '63353e0fb0765f90ecaf6942bad3323497638a17', class: "tg__head-spacer" }), h("div", { key: '842770c40be192de75e8e3d8635d2f78976ee492', class: "tg__head-days", style: { gridTemplateColumns: colsTemplate } }, dates.map((d) => {
+        return (h("div", { key: '55c583abdd12ac65d8188a8f9d4f0448e4fcf5b7', class: "tg", tabIndex: 0, onKeyDown: this.handleKeyDown, ref: (el) => (this.rootEl = el) }, h("div", { key: '33fa43418fdff096918441e6a2fdbf1d647980ec', class: "tg__head" }, h("div", { key: '2c4134daefc3cb99aa4965787c11318be9f27d40', class: "tg__head-spacer" }), h("div", { key: '0b6c10bbfb8b91723d62f05f1387d8c0513d7b09', class: "tg__head-days", style: { gridTemplateColumns: colsTemplate } }, dates.map((d) => {
             const ymd = parseISO(d);
             const dow = utcDayOfWeek(d);
             return (h("div", { class: { 'tg__head-day': true, 'tg__head-day--today': compareYMD(d, today) === 0 } }, h("span", { class: "tg__head-dow" }, short[dow]), h("span", { class: "tg__head-num" }, ymd.day)));
-        }))), this.allDaySlot && (h("div", { key: 'f78e9159e84ecc4a0259c296e1120830b2a2513b', class: "tg__allday" }, h("div", { key: '255ad5c8e6a8c93377c2898acb8ecc06e0a0eb6d', class: "tg__allday-axis" }, gmtLabel(this.timeZone, dates[0])), h("div", { key: '5023271e34910ac5dead15f4b4a4bd4c588b6594', class: "tg__allday-lane", style: { height: `${Math.max(1, allDay.laneCount) * ALLDAY_LANE_H + 4}px` } }, allDay.segments.map((seg) => this.renderAllDayBar(seg, dates.length, byId))))), h("div", { key: '5d37824151562d8a53906ecb059d96afdee93d3e', class: "tg__scroll", ref: (el) => (this.scrollEl = el) }, h("div", { key: 'ebeac3733271bd3ebcaca2343a9f5f01285a7f05', class: "tg__body" }, h("div", { key: '9eed6c09dfe67a9613c0641dbc305ba594312166', class: "tg__axis", style: { height: bodyHeight } }, this.hourList().map((m) => (h("span", { class: "tg__axis-hour", style: { top: `${minutesToFraction(m, this.minM, this.maxM) * 100}%` } }, hourLabel(m, this.locale))))), h("div", { key: 'bc8f8c0e5bf00c8fc92bb6c823fa9ba6c321ad2c', class: "tg__cols", style: Object.assign({ gridTemplateColumns: colsTemplate, height: bodyHeight }, hourVars) }, dates.map((d, i) => {
+        }))), this.allDaySlot && (h("div", { key: 'ac00b1d478138334f6b265e7e7861dc910ea778e', class: "tg__allday" }, h("div", { key: '52ea789daff3b284863e90fe2356b3f1f5ed8e75', class: "tg__allday-axis" }, gmtLabel(this.timeZone, dates[0])), h("div", { key: '24e0a67773437bad42a3fb183cf55f53f2e04d0f', class: "tg__allday-lane", style: { height: `${Math.max(1, allDay.laneCount) * ALLDAY_LANE_H + 4}px` } }, allDay.segments.map((seg) => this.renderAllDayBar(seg, dates.length, byId))))), h("div", { key: '19ee69ba01bcd63d015acebba5001390324b1c93', class: "tg__scroll", ref: (el) => (this.scrollEl = el) }, h("div", { key: '644e0cae08a22795bfdaa802227c176e733dd418', class: "tg__body" }, h("div", { key: '56a20d546083e0a0695c01a0910c80fdcaf56589', class: "tg__axis", style: { height: bodyHeight } }, this.hourList().map((m) => (h("span", { class: "tg__axis-hour", style: { top: `${minutesToFraction(m, this.minM, this.maxM) * 100}%` } }, hourLabel(m, this.locale))))), h("div", { key: '391004de33499561a0fdc75e3eabf401fb4e5561', class: "tg__cols", style: Object.assign({ gridTemplateColumns: colsTemplate, height: bodyHeight }, hourVars) }, dates.map((d, i) => {
             var _a;
             const isToday = compareYMD(d, today) === 0;
             return (h("div", { class: { tg__col: true, 'tg__col--today': isToday }, "data-col-date": d, onPointerDown: (e) => this.startSelection(e, d, e.currentTarget), onPointerMove: (e) => this.extendSelection(e, e.currentTarget) }, this.loading
@@ -752,7 +769,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Eventos ya normalizados por el motor (`@prolibu-suite/cobalt-calendar-utils`); propiedad JS."
                 },
                 "getter": false,
                 "setter": false,
@@ -788,7 +805,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Locale BCP-47 de las cabeceras de d\u00EDa y las etiquetas de hora."
                 },
                 "getter": false,
                 "setter": false,
@@ -808,7 +825,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Zona IANA en la que se pinta el reloj (\u00FAnica frontera de zona horaria del componente)."
                 },
                 "getter": false,
                 "setter": false,
@@ -827,7 +844,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Permite mover y redimensionar eventos arrastrando (salvo los que traen `editable: false`); emite `coEventDrop`."
                 },
                 "getter": false,
                 "setter": false,
@@ -847,7 +864,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Permite seleccionar un rango en un \u00E1rea vac\u00EDa para crear; emite `coRangeSelect`."
                 },
                 "getter": false,
                 "setter": false,
@@ -867,7 +884,7 @@ export class CoCalendarTimegrid {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Primer d\u00EDa interactuable `YYYY-MM-DD`: antes no se puede seleccionar ni soltar."
                 },
                 "getter": false,
                 "setter": false,
@@ -886,7 +903,7 @@ export class CoCalendarTimegrid {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "\u00DAltimo d\u00EDa interactuable `YYYY-MM-DD`."
                 },
                 "getter": false,
                 "setter": false,
@@ -905,7 +922,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Minutos por fila de la grilla (default 15); tambi\u00E9n el paso del teclado."
                 },
                 "getter": false,
                 "setter": false,
@@ -925,7 +942,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Minutos a los que se ajustan arrastres y selecciones (default 15)."
                 },
                 "getter": false,
                 "setter": false,
@@ -945,7 +962,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Duraci\u00F3n en minutos del rango creado con un click simple (default 60)."
                 },
                 "getter": false,
                 "setter": false,
@@ -965,7 +982,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Hora `HH:mm` a la que scrollea la grilla al montar (default 07:00)."
                 },
                 "getter": false,
                 "setter": false,
@@ -985,7 +1002,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "L\u00EDnea de \u00ABahora\u00BB en la columna del d\u00EDa actual."
                 },
                 "getter": false,
                 "setter": false,
@@ -1025,7 +1042,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Franja superior de eventos de todo el d\u00EDa."
                 },
                 "getter": false,
                 "setter": false,
@@ -1045,7 +1062,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Primera hora visible `HH:mm` (default 00:00)."
                 },
                 "getter": false,
                 "setter": false,
@@ -1065,7 +1082,7 @@ export class CoCalendarTimegrid {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "\u00DAltima hora visible `HH:mm` (default 24:00)."
                 },
                 "getter": false,
                 "setter": false,
@@ -1111,7 +1128,7 @@ export class CoCalendarTimegrid {
                 "composed": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Click en un evento: `{ id, rect }` (rect del chip, para anclar un popover). No burbujea."
                 },
                 "complexType": {
                     "original": "{ id: string; rect?: DOMRect }",
@@ -1131,7 +1148,7 @@ export class CoCalendarTimegrid {
                 "composed": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Se movi\u00F3 o redimension\u00F3 un evento: `{ id, start, end, oldStart, oldEnd, allDay }` (instantes ISO UTC).\nControlado: el host decide si aplica el cambio actualizando `events`. No burbujea."
                 },
                 "complexType": {
                     "original": "{\n    id: string; start: string; end: string; oldStart: string; oldEnd: string; allDay: boolean;\n  }",

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

@@ -1,5 +1,14 @@
 import { h } from "@stencil/core";
 /**
+ * Contenedor tipo tarjeta con header, cuerpo y footer, en variantes elevada,
+ * con borde o plana; opcionalmente clickeable. Wrapper Vue: `CoCard` de
+ * `@prolibu-suite/cobalt-vue`.
+ *
+ * @part card - La tarjeta.
+ * @part header - Área del slot `header`.
+ * @part body - Cuerpo (slot por defecto).
+ * @part footer - Área del slot `footer`.
+ *
  * @slot header  - Card header area (image, title, actions)
  * @slot         - Default slot for card body/content
  * @slot footer  - Card footer area (meta, actions)
@@ -29,13 +38,13 @@ export class CoCard {
         return nodes.length > 0;
     }
     render() {
-        return (h("div", { key: '52e3eb679a025b1b53854b38063b6fa951cf9f70', class: {
+        return (h("div", { key: '662e725ff539d1696eeaa99a42f8160df8ba13ae', 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: '753b2277a6629673e8583774e126b2472709221d', class: { 'co-card__header': true, 'co-card__header--empty': !this.hasHeader }, part: "header" }, h("slot", { key: 'f73192e7fa291c8a2d831a0f9db7ebe8a7ef8907', name: "header", onSlotchange: this.handleHeaderSlotChange })), h("div", { key: '2916b424d3cb1feacf438678132d10217df51ad9', class: "co-card__body", part: "body" }, h("slot", { key: 'f957907056567d135c3de5d412251911c7cf8db0' })), h("div", { key: 'f1f183b7d3eacbd11787e0cc3d0ef438f8272480', class: { 'co-card__footer': true, 'co-card__footer--empty': !this.hasFooter }, part: "footer" }, h("slot", { key: '2171a95906d5b862c7b39a756cafee17d86f7dbc', name: "footer", onSlotchange: this.handleFooterSlotChange }))));
+            }, part: "card", role: this.clickable ? 'button' : undefined, tabIndex: this.clickable ? 0 : undefined }, h("div", { key: '63b8d7696663831f6151d66ea17855ce85421045', class: { 'co-card__header': true, 'co-card__header--empty': !this.hasHeader }, part: "header" }, h("slot", { key: 'b4318780fa0d1fb8c9475056d59b9dd3bf055594', name: "header", onSlotchange: this.handleHeaderSlotChange })), h("div", { key: '20d5231348b8031688380b08a8222f4bd3f68575', class: "co-card__body", part: "body" }, h("slot", { key: '2946cc5d8d80cbc23f98e710b97cb77d542a019e' })), h("div", { key: '90dd12b60204cbd2e1ddb6752c8e6a413db7f860', class: { 'co-card__footer': true, 'co-card__footer--empty': !this.hasFooter }, part: "footer" }, h("slot", { key: 'de9d77a21962ed35d2862059d13910b1067d1573', 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

@@ -2,6 +2,16 @@
    co-carousel
    ═══════════════════════════════════════════════════ */
 
+/**
+ * Tienen su default en `:host`; se sobrescriben desde afuera sobre el elemento.
+ * @prop --co-carousel-arrow-size: Diámetro de las flechas (default 36px).
+ * @prop --co-carousel-arrow-bg: Fondo de las flechas.
+ * @prop --co-carousel-arrow-color: Color del ícono de las flechas.
+ * @prop --co-carousel-dot-size: Tamaño de los indicadores (default 6px).
+ * @prop --co-carousel-dot-color: Color de los indicadores inactivos.
+ * @prop --co-carousel-dot-active-color: Color del indicador activo.
+ * @prop --co-carousel-transition: Duración y curva del desplazamiento entre slides (default 320ms).
+ */
 :host {
   display: block;
   font-family: var(--co-font-family-primary);

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

@@ -6,8 +6,17 @@ import { getCarouselStrings } from "../../utils/carouselI18n";
  * inertness on each item and translates a flex track to the active index.
  *
  * No v-model in the Vue wrappers — consume with `:value` + `@coSlideChange`.
+ * Wrapper Vue: `CoCarousel` de `@prolibu-suite/cobalt-vue`.
  *
  * @slot - co-carousel-item elements
+ *
+ * @part container - Caja del carrusel (relación de aspecto).
+ * @part viewport - Ventana visible que recorta los slides.
+ * @part track - Tira de slides que se desplaza al activo.
+ * @part arrow-prev - Flecha «anterior».
+ * @part arrow-next - Flecha «siguiente».
+ * @part dots - Grupo de indicadores.
+ * @part dot - Cada indicador (botón que lleva a su slide).
  */
 export class CoCarousel {
     constructor() {
@@ -197,12 +206,15 @@ export class CoCarousel {
         this.restartAutoplay();
     }
     // ── Public methods ──────────────────────────────
+    /** Avanza al slide siguiente (con `loop`, del último vuelve al primero). */
     async next() {
         this.advance(1);
     }
+    /** Retrocede al slide anterior (con `loop`, del primero va al último). */
     async prev() {
         this.advance(-1);
     }
+    /** Va al slide `index` (base 0; se recorta al rango válido). Emite `coSlideChange`. */
     async goTo(index) {
         this.setActive(this.clampIndex(index));
     }
@@ -303,11 +315,11 @@ export class CoCarousel {
         };
         if (this.dragging)
             trackStyle.transition = 'none';
-        return (h(Host, { key: '2e2d00e6956b5de4af5950ad6725a77023420f11' }, h("div", { key: '40878a4740b4ad9bf70cf9816d7edc89b8bafeda', class: { 'co-carousel': true, [aspectClass]: true }, part: "container", role: "region", "aria-roledescription": "carousel", "aria-label": s.carouselLabel, tabindex: 0, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocusin: this.handleFocusIn, onFocusout: this.handleFocusOut }, h("div", { key: '5c0ec11025ae5c6eb3a88b10595c243a9b910671', class: "co-carousel__viewport", part: "viewport", ref: el => (this.viewportEl = el), onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel, onClickCapture: this.handleClickCapture }, h("div", { key: '746d85f914bc24ca86ad88005fe95a214de7cd31', class: "co-carousel__track", part: "track", style: trackStyle, "aria-live": this.rotating ? 'off' : 'polite' }, h("slot", { key: 'b33c34a9cb6e03af50176094a89b1c79d363f13d', onSlotchange: this.handleSlotChange }))), this.arrows && multi && (h("button", { key: '4f30b56e84da8f7e15b6cea71a0238f5cd19f39e', class: { 'co-carousel__arrow': true, 'co-carousel__arrow--prev': true, 'co-carousel__arrow--disabled': !canPrev }, part: "arrow-prev", type: "button", "aria-label": s.prevSlide, disabled: !canPrev, onClick: () => this.advance(-1) }, h("co-icon", { key: '09eaa1a665762f7e2b372eb264860e182e411d17', name: "caret-left", size: 18, weight: "bold" }))), this.arrows && multi && (h("button", { key: '7026bfe945ee42ef7b0f9194ecf6a04f0ef1ab1c', class: { 'co-carousel__arrow': true, 'co-carousel__arrow--next': true, 'co-carousel__arrow--disabled': !canNext }, part: "arrow-next", type: "button", "aria-label": s.nextSlide, disabled: !canNext, onClick: () => this.advance(1) }, h("co-icon", { key: '564f5bc3bef0b0ce23e8be91bed8e37540209a7b', name: "caret-right", size: 18, weight: "bold" }))), this.dots && multi && (
+        return (h(Host, { key: '893a30dd314f5d04c78c1824317b80db6d4326d4' }, h("div", { key: '799a7edfbd023adf57ea1e3dfb90fdd8e864954c', class: { 'co-carousel': true, [aspectClass]: true }, part: "container", role: "region", "aria-roledescription": "carousel", "aria-label": s.carouselLabel, tabindex: 0, onKeyDown: this.handleKeyDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, onFocusin: this.handleFocusIn, onFocusout: this.handleFocusOut }, h("div", { key: 'd6227b5963125ff1e2f9433d63d6ffb632e2f50a', class: "co-carousel__viewport", part: "viewport", ref: el => (this.viewportEl = el), onPointerDown: this.handlePointerDown, onPointerMove: this.handlePointerMove, onPointerUp: this.handlePointerUp, onPointerCancel: this.handlePointerCancel, onClickCapture: this.handleClickCapture }, h("div", { key: '74b2910ef5d37bd94f054984eb80f090c6a4f878', class: "co-carousel__track", part: "track", style: trackStyle, "aria-live": this.rotating ? 'off' : 'polite' }, h("slot", { key: 'b590ed5dd8ee443cf5875f929280cf860284cf3d', onSlotchange: this.handleSlotChange }))), this.arrows && multi && (h("button", { key: '92d9002c893bd3d200bc290cadb0cdf87fb2a493', class: { 'co-carousel__arrow': true, 'co-carousel__arrow--prev': true, 'co-carousel__arrow--disabled': !canPrev }, part: "arrow-prev", type: "button", "aria-label": s.prevSlide, disabled: !canPrev, onClick: () => this.advance(-1) }, h("co-icon", { key: '8608c83fb246ec45c2f34eb221d1f25dac51c680', name: "caret-left", size: 18, weight: "bold" }))), this.arrows && multi && (h("button", { key: 'd1279fa7a3ebef36f2d590e5834a2b0484c2f6b3', class: { 'co-carousel__arrow': true, 'co-carousel__arrow--next': true, 'co-carousel__arrow--disabled': !canNext }, part: "arrow-next", type: "button", "aria-label": s.nextSlide, disabled: !canNext, onClick: () => this.advance(1) }, h("co-icon", { key: 'cfa98cc4aad1e658e63b7411638522687f6c3650', name: "caret-right", size: 18, weight: "bold" }))), this.dots && multi && (
         // APG grouped-carousel picker pattern: plain always-tabbable
         // buttons in a labelled group (tablist/tab would demand
         // aria-controls + roving tabindex we don't implement).
-        h("div", { key: 'b19aed5296fa2f3547e85e6c439589703809bae3', class: "co-carousel__dots", part: "dots", role: "group", "aria-label": s.pickSlide }, Array.from({ length: this.itemCount }, (_, i) => (h("button", { class: { 'co-carousel__dot': true, 'co-carousel__dot--active': i === this.value }, part: "dot", type: "button", "aria-current": i === this.value ? 'true' : undefined, "aria-label": s.goToSlide.replace('{i}', String(i + 1)), onClick: () => this.setActive(i) }))))))));
+        h("div", { key: '98fbe34ec71504ff2089f380cce0354b52753d08', class: "co-carousel__dots", part: "dots", role: "group", "aria-label": s.pickSlide }, Array.from({ length: this.itemCount }, (_, i) => (h("button", { class: { 'co-carousel__dot': true, 'co-carousel__dot--active': i === this.value }, part: "dot", type: "button", "aria-current": i === this.value ? 'true' : undefined, "aria-label": s.goToSlide.replace('{i}', String(i + 1)), onClick: () => this.setActive(i) }))))))));
     }
     static get is() { return "co-carousel"; }
     static get encapsulation() { return "shadow"; }
@@ -566,7 +578,7 @@ export class CoCarousel {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "",
+                    "text": "Avanza al slide siguiente (con `loop`, del \u00FAltimo vuelve al primero).",
                     "tags": []
                 }
             },
@@ -583,7 +595,7 @@ export class CoCarousel {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "",
+                    "text": "Retrocede al slide anterior (con `loop`, del primero va al \u00FAltimo).",
                     "tags": []
                 }
             },
@@ -604,7 +616,7 @@ export class CoCarousel {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "",
+                    "text": "Va al slide `index` (base 0; se recorta al rango v\u00E1lido). Emite `coSlideChange`.",
                     "tags": []
                 }
             }

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

@@ -8,7 +8,7 @@ import { Host, h } from "@stencil/core";
  */
 export class CoCarouselItem {
     render() {
-        return (h(Host, { key: 'ae04768a65db80be93705a0ff9d0852ae2e6d0cc', role: "group", "aria-roledescription": "slide" }, h("slot", { key: '7a9f94454ca5e2574b4161ed06d863728c88a814' })));
+        return (h(Host, { key: 'c35ea6afb9a70c602094a6b29d0fd8e80d945602', role: "group", "aria-roledescription": "slide" }, h("slot", { key: 'd2a344a92e6c5bb374ccb54eebc8eb3619566093' })));
     }
     static get is() { return "co-carousel-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -78,7 +78,14 @@
    tinte de la fila). Frost real solo en appearance="overlay", más abajo. */
 .co-checkbox:not(.co-checkbox--checked) {
   background: color-mix(in srgb, var(--co-semantic-surface-secondary) 35%, transparent);
-  border: 1px solid color-mix(in srgb, var(--co-semantic-border-default) 75%, transparent);
+  /* m-16: el borde va al token PLENO (negro-16 = 0,16), que es lo que pide el
+     diseño. El `color-mix(… 75%, transparent)` que había acá lo dejaba en 0,12
+     y, de paso, era el motivo por el que el puente de tema
+     `--co-semantic-border-field: var(--co-semantic-border-default)` nunca le
+     llegaba a la casilla: no leía `border-field` y encima diluía el otro.
+     Es el mismo borde que `labelSize="xs"` ya dibujaba pleno. El relleno
+     translúcido (35%) no se toca: el hallazgo es solo del borde. */
+  border: 1px solid var(--co-semantic-border-default);
 }
 
 /* ─── CHECKED ───────────────────────────────────────────────── */
@@ -250,3 +257,38 @@
   border-color: var(--co-semantic-border-focus);
   box-shadow: 0 0 0 2px var(--co-semantic-border-focus);
 }
+
+/* ─── LABEL SIZE "xs" (Task C6) ─────────────────────────────── */
+/* Aditivo: solo aplica con la clase --label-xs en la fila; el default
+   (sin la clase) queda byte-idéntico a lo de arriba. */
+.co-checkbox-row--label-xs {
+  gap: var(--co-spacing-sm); /* 6px, en vez del sm2 (8px) del default */
+}
+
+.co-checkbox-row--label-xs .co-checkbox__label {
+  color: var(--co-semantic-text-default);
+  font-size: var(--co-font-size-12);
+}
+
+/* Fix round 1: sin este bloque, disabled + label-xs perdía el dimming del
+   label. La regla de arriba (.co-checkbox-row--label-xs .co-checkbox__label,
+   especificidad 0,2,0) empata en especificidad con la de disabled
+   (.co-checkbox-row--disabled .co-checkbox__label, línea ~32-34, también
+   0,2,0) y, al declararse después en el archivo, ganaba siempre — incluso
+   con disabled activo. Este selector compuesto sube a 0,3,0 (dos clases en
+   la fila + el label) y gana pase lo que pase el orden de declaración. */
+.co-checkbox-row--disabled.co-checkbox-row--label-xs .co-checkbox__label {
+  color: var(--co-semantic-text-disabled);
+}
+
+/* Caja SIN MARCAR: fondo transparente + borde pleno (no color-mix), en vez
+   de la traslucidez 35%/75% del default. El estado marcado/indeterminado no
+   se toca — sigue siendo la regla de arriba (fondo sólido, sin borde). El
+   `:not(--indeterminate)` es necesario (fix I-3): la clase --checked solo va
+   con checked && !indeterminate (ver .tsx), así que un `:not(--checked)`
+   pelado también matcheaba el indeterminado → caja transparente con el
+   guion blanco encima, invisible. Misma forma que el chip overlay de arriba. */
+.co-checkbox-row--label-xs .co-checkbox:not(.co-checkbox--checked):not(.co-checkbox--indeterminate) {
+  background: transparent;
+  border: 1px solid var(--co-semantic-border-default);
+}

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

@@ -1,4 +1,12 @@
 import { h } from "@stencil/core";
+/**
+ * Casilla de verificación con etiqueta, estado indeterminado y variante de chip
+ * de selección (`appearance="overlay"`). Wrapper Vue: `CoCheckbox` de
+ * `@prolibu-suite/cobalt-vue`.
+ *
+ * @part box - La casilla.
+ * @part label - La etiqueta.
+ */
 export class CoCheckbox {
     constructor() {
         /** Whether the checkbox is checked */
@@ -7,6 +15,13 @@ export class CoCheckbox {
         this.indeterminate = false;
         /** Size: small=16px, medium=20px, large=24px (overlay appearance: small=20px, medium/large=22px) */
         this.size = 'small';
+        /**
+         * Talla del label: 'default' (14px, sin cambios) o 'xs' (12px/400/text-default,
+         * gap 6). Con 'xs' la caja SIN MARCAR pasa a fondo transparente + borde
+         * `--co-semantic-border-default` pleno (hoy surface-secondary 35% + borde 75%);
+         * el estado marcado no cambia. Aditivo — el default sigue siendo idéntico.
+         */
+        this.labelSize = 'default';
         /** Disabled state */
         this.disabled = false;
         /** Value for checkbox group usage */
@@ -43,17 +58,18 @@ export class CoCheckbox {
         // Only override the fill when a custom color is provided AND the box is "on".
         // Leaving this undefined keeps the default appearance byte-identical to before.
         const boxStyle = this.checkedColor && isOn ? { background: this.checkedColor } : undefined;
-        return (h("div", { key: 'cfcbd567066331d7751064f857407a8f9d56d386', class: {
+        return (h("div", { key: '9e2c38b7ae4421165cf8ebea81516a91478b99a1', class: {
                 'co-checkbox-row': true,
                 'co-checkbox-row--disabled': this.disabled,
-            }, onClick: this.handleClick }, h("span", { key: '21c39833a43324e47718cc83ba74253f00e67e82', role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : String(this.checked), "aria-label": this.label || this.ariaLabelText || '', "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, class: {
+                'co-checkbox-row--label-xs': this.labelSize === 'xs',
+            }, onClick: this.handleClick }, h("span", { key: '6d7d00ff7624068dda50673b75844f7ac338c6e9', role: "checkbox", "aria-checked": this.indeterminate ? 'mixed' : String(this.checked), "aria-label": this.label || this.ariaLabelText || '', "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : 0, onKeyDown: this.handleKeyDown, class: {
                 'co-checkbox': true,
                 [`co-checkbox--${this.size}`]: true,
                 'co-checkbox--overlay': isOverlay,
                 'co-checkbox--checked': this.checked && !this.indeterminate,
                 'co-checkbox--indeterminate': this.indeterminate,
                 'co-checkbox--disabled': this.disabled,
-            }, style: boxStyle, part: "box" }, h("svg", { key: '6e49dd81e78da092340b1cbdb5c45ee6e345fb3c', class: "co-checkbox__glyph", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: 'dbcadf848fb8cb64acea875fb03186258210c43f', class: "co-checkbox__check", d: "M3.5 8.5l3 3 6-6.5", pathLength: "1", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: '0b58a11353c3d8b8249e5852933f290cd63f0705', class: "co-checkbox__dash", d: "M3 8h10", pathLength: "1", "stroke-linecap": "round" }))), this.label && (h("span", { key: 'e1a4beabf2b472aeff1fe5ecd5bcb458e949ee11', class: "co-checkbox__label", part: "label" }, this.label))));
+            }, style: boxStyle, part: "box" }, h("svg", { key: '2c6377c45aa39658fe85d399d812fb7f32d0a51b', class: "co-checkbox__glyph", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true" }, h("path", { key: '0f754ffa9b90acc943bcb9ec354a27596b4b3532', class: "co-checkbox__check", d: "M3.5 8.5l3 3 6-6.5", pathLength: "1", "stroke-linecap": "round", "stroke-linejoin": "round" }), h("path", { key: 'beca1dff6db4a2eae3c7c2c25dcd10061fae5f31', class: "co-checkbox__dash", d: "M3 8h10", pathLength: "1", "stroke-linecap": "round" }))), this.label && (h("span", { key: '28f0916e57c3377040ebeb2a901ba1dec491f580', class: "co-checkbox__label", part: "label" }, this.label))));
     }
     static get is() { return "co-checkbox"; }
     static get encapsulation() { return "shadow"; }
@@ -129,6 +145,26 @@ export class CoCheckbox {
                 "attribute": "size",
                 "defaultValue": "'small'"
             },
+            "labelSize": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'default' | 'xs'",
+                    "resolved": "\"default\" | \"xs\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Talla del label: 'default' (14px, sin cambios) o 'xs' (12px/400/text-default,\ngap 6). Con 'xs' la caja SIN MARCAR pasa a fondo transparente + borde\n`--co-semantic-border-default` pleno (hoy surface-secondary 35% + borde 75%);\nel estado marcado no cambia. Aditivo \u2014 el default sigue siendo id\u00E9ntico."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "label-size",
+                "defaultValue": "'default'"
+            },
             "disabled": {
                 "type": "boolean",
                 "mutable": false,

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

@@ -1,4 +1,9 @@
 import { h } from "@stencil/core";
+/**
+ * Grupo de casillas con etiqueta, ayuda y estado de validación: `options`
+ * define las casillas y `value` las marcadas (array). Emite `coChange` con el
+ * array completo. Wrapper Vue: `CoCheckboxGroup` de `@prolibu-suite/cobalt-vue`.
+ */
 export class CoCheckboxGroup {
     constructor() {
         /** Label layout: vertical (label above) or horizontal (label beside) */
@@ -70,11 +75,11 @@ export class CoCheckboxGroup {
         const hasLabels = this.label || this.secondaryLabel;
         const opts = this.parsedOptions;
         const selected = this.selectedValues;
-        return (h("div", { key: 'd3f34e7ee59ebcc1494ee6aabef1e4c476044dbd', class: {
+        return (h("div", { key: '9b4ee043c35d0be7da49ca2881671830d900dcb7', class: {
                 'co-checkbox-group': true,
                 'co-checkbox-group--disabled': this.disabled,
                 [`co-checkbox-group--${this.status}`]: this.status !== 'default',
-            }, role: "group", "aria-label": this.label || '' }, hasLabels && (h("div", { key: 'a47de05988ae37497154fc80e8cbf5f6f62bb1d4', class: "co-checkbox-group__labels" }, this.label && h("span", { key: 'fc39ff62eeea3136584a0667e71d816958a1ed57', class: "co-checkbox-group__label" }, this.label), this.secondaryLabel && (h("span", { key: '205c1cbdbfcba6d882c7f4c27bfd633e55acea0f', class: "co-checkbox-group__secondary-label" }, this.secondaryLabel)))), h("div", { key: '33d6b03de2f2ba30afe1d1865a43ade7b8344f96', class: {
+            }, role: "group", "aria-label": this.label || '' }, hasLabels && (h("div", { key: 'fca5265d4bd96a5792840319443f48f4871f9e10', class: "co-checkbox-group__labels" }, this.label && h("span", { key: 'b53daed7cea22897e978dc83eee817d0b67e73d2', class: "co-checkbox-group__label" }, this.label), this.secondaryLabel && (h("span", { key: '88eb49c68465e27f53f91cdf73d9748effca7d8b', class: "co-checkbox-group__secondary-label" }, this.secondaryLabel)))), h("div", { key: 'dae5337bf83e5dbc46e0afc6fd6eed5bb4aee6db', class: {
                 'co-checkbox-group__options': true,
                 [`co-checkbox-group__options--${this.direction}`]: true,
             } }, opts.map(opt => {
@@ -89,7 +94,7 @@ export class CoCheckboxGroup {
                     'co-checkbox-group__box--checked': isChecked,
                     'co-checkbox-group__box--disabled': isDisabled,
                 }, role: "checkbox", "aria-checked": String(isChecked), "aria-label": opt.label }), h("span", { class: "co-checkbox-group__option-label" }, opt.label)));
-        })), this.helperText && (h("div", { key: '7ac076bf100f66eb851d7e76e0b052d42fef69f8', class: `co-checkbox-group__helper co-checkbox-group__helper--${this.status}` }, this.statusIcon && (h("co-icon", { key: '7a13362e9a77a13ebb1e127ee57c10e7f64110fb', name: this.statusIcon, size: 14, weight: "fill", class: "co-checkbox-group__helper-icon" })), h("span", { key: '44e9f68fd19c5a50affde1eb743c3fc8e5eef8e4', class: "co-checkbox-group__helper-text" }, this.helperText)))));
+        })), this.helperText && (h("div", { key: 'af541135d225b51ad80e39edd3d6947f2567dd75', class: `co-checkbox-group__helper co-checkbox-group__helper--${this.status}` }, this.statusIcon && (h("co-icon", { key: '52297bb73168c15af67b65eedaf6349a7c5dd6f3', name: this.statusIcon, size: 14, weight: "fill", class: "co-checkbox-group__helper-icon" })), h("span", { key: '3ebd17867c2d36b0483d7620476bc5502c36fd73', class: "co-checkbox-group__helper-text" }, this.helperText)))));
     }
     static get is() { return "co-checkbox-group"; }
     static get encapsulation() { return "shadow"; }
@@ -231,7 +236,7 @@ export class CoCheckboxGroup {
                     "references": {
                         "CheckboxOption": {
                             "location": "local",
-                            "path": "/Users/agox/worktrees/cobalt-release-0.10.3/packages/core/src/components/co-checkbox-group/co-checkbox-group.tsx",
+                            "path": "/Users/agox/worktrees/cobalt-docs-2026-09-24/packages/core/src/components/co-checkbox-group/co-checkbox-group.tsx",
                             "id": "src/components/co-checkbox-group/co-checkbox-group.tsx::CheckboxOption"
                         }
                     }

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

@@ -1,5 +1,14 @@
 /* co-chip — all variants: filled/outlined, colors, removable, clickable, selected, disabled */
 
+/**
+ * @prop --co-chip-bg: Fondo de la variante `filled`.
+ * @prop --co-chip-color: Color de texto de la variante `filled`.
+ * @prop --co-chip-border: Color del borde de la variante `filled` (default transparente).
+ * @prop --co-chip-max-width: Ancho máximo del chip; el texto se trunca con elipsis (default sin tope).
+ * @prop --co-chip-value-color: Color del sufijo `valueLabel` (default gray-500).
+ * @prop --co-chip-trailing-color: Color del ícono final `trailingIcon` (default: el del texto).
+ */
+
 :host {
   display: inline-flex;
   max-width: var(--co-chip-max-width, none);

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

@@ -1,8 +1,21 @@
 import { h } from "@stencil/core";
 /**
+ * Etiqueta compacta para estados, tags, filtros o selecciones: con color
+ * semántico, íconos, punto de color, sufijo de valor («Ordenar: Reciente»),
+ * botón de quitar y modo clickeable/seleccionable. Wrapper Vue: `CoChip` de
+ * `@prolibu-suite/cobalt-vue`.
+ *
  * @slot icon-left  - Icon before label (1nd Icon mode)
  * @slot icon-right - Icon after label (2nd Icon mode)
  * @slot            - Label text
+ *
+ * @part chip - Contenedor del chip.
+ * @part dot - Punto de color inicial (`dot`).
+ * @part icon-left - Ícono o slot de la izquierda.
+ * @part icon-right - Ícono o slot de la derecha.
+ * @part value - Sufijo de valor (`valueLabel`).
+ * @part trailing - Ícono final (`trailingIcon`).
+ * @part remove - Botón × (`removable`).
  */
 export class CoChip {
     constructor() {
@@ -70,7 +83,7 @@ export class CoChip {
         else
             effectiveIconMode = 'none';
         const Tag = this.clickable ? 'button' : 'div';
-        return (h(Tag, { key: '385173584372bbad8872565f1fc95e8ae8e14563', class: {
+        return (h(Tag, { key: 'a0fef13e5a67b2d8c1ac96576d1f75f5187c70cb', class: {
                 'co-chip': true,
                 [`co-chip--${this.shape}`]: true,
                 [`co-chip--${this.size}`]: true,
@@ -80,7 +93,7 @@ export class CoChip {
                 'co-chip--clickable': this.clickable,
                 'co-chip--disabled': this.disabled,
                 'co-chip--selected': this.selected,
-            }, part: "chip", type: this.clickable ? 'button' : undefined, disabled: this.clickable ? this.disabled : undefined, onClick: this.handleClick }, this.dot && (h("span", { key: 'a680c376ac13140b2c073e01fc901f2cfa54bde8', class: "co-chip__dot", part: "dot", style: this.dotColor ? { color: this.dotColor } : undefined }, h("co-icon", { key: '73e58b8b90234eb883b6a1e49b5e37b267f03d1b', name: "circle", size: iconSize, weight: "fill" }))), this.iconLeft && !hasLeftSlot && (h("span", { key: 'b944fbf0a0161846411d8fc2fe034c48c77d42ea', class: "co-chip__icon-left", part: "icon-left" }, h("co-icon", { key: 'b24a5a3c64d0eda1b9d87c66ac93c0d4703973bc', name: this.iconLeft, size: iconSize, weight: this.iconWeight }))), hasLeftSlot && (h("span", { key: '9f1e7fa47bd86e1d7e4812ec0fe5f61490ab0878', class: "co-chip__icon-left", part: "icon-left" }, h("slot", { key: 'e52df105783ff84c932bc289f6e88304ccc4240a', name: "icon-left" }))), h("span", { key: '269f54eca09a4ff301d9ec4e673bf9c8d19ccd87', class: "co-chip__label" }, h("slot", { key: '31fba7c9c05b830562800cc46c48e667e7dc046c' }, this.label), this.valueLabel != null && this.valueLabel !== '' && (h("span", { key: 'a455314236c688f2bff9185135787899da52ea5f', class: "co-chip__value", part: "value" }, `: ${this.valueLabel}`))), this.iconRight && !hasRightSlot && !this.removable && (h("span", { key: '13e5862e03e2fcf7129230a4d68ce7e2b1b4f11e', class: "co-chip__icon-right", part: "icon-right" }, h("co-icon", { key: '66fc09efbdeea37f1dbce3b5ad4443a760618b66', name: this.iconRight, size: iconSize, weight: this.iconWeight }))), hasRightSlot && (h("span", { key: '7acfa1a23e294cb92b17d5174ec0a78161877624', class: "co-chip__icon-right", part: "icon-right" }, h("slot", { key: '9e8ded0f256a72ab81c587a82d2bb570930288f9', name: "icon-right" }))), this.removable && (h("span", { key: 'e30345ce825c823fbf7da1aaaec4141351e18a02', class: "co-chip__remove", part: "remove", role: "button", tabIndex: this.disabled ? -1 : 0, onClick: this.handleRemove, "aria-label": "Remove" }, h("co-icon", { key: '3d9777c29b706cda71ee64b313961c97e215b900', name: "x-circle", size: removeIconSize, weight: "fill" }))), this.trailingIcon && (h("span", { key: 'd99af23fbbb7a8557b8cefd15a4cebdc7437ff43', class: "co-chip__trailing", part: "trailing" }, h("co-icon", { key: 'aa99f2c0f6ec96f95656c607ca5846c282447e35', name: this.trailingIcon, size: trailingIconSize, weight: this.iconWeight })))));
+            }, part: "chip", type: this.clickable ? 'button' : undefined, disabled: this.clickable ? this.disabled : undefined, onClick: this.handleClick }, this.dot && (h("span", { key: 'cac1c98fa890bae489af9b3efb4fb3ec0a06d1ca', class: "co-chip__dot", part: "dot", style: this.dotColor ? { color: this.dotColor } : undefined }, h("co-icon", { key: '545dba15817d7375447a0adb1d472b2accf7b878', name: "circle", size: iconSize, weight: "fill" }))), this.iconLeft && !hasLeftSlot && (h("span", { key: 'a54ecde8516125b1670716ebd8555d3ac6ca24be', class: "co-chip__icon-left", part: "icon-left" }, h("co-icon", { key: '0e3174abeb9761a8a2abca7bbd9ebec0bd3e9dea', name: this.iconLeft, size: iconSize, weight: this.iconWeight }))), hasLeftSlot && (h("span", { key: 'cf7a72c01e63140bc22bde8d87841cbb79bb4f4a', class: "co-chip__icon-left", part: "icon-left" }, h("slot", { key: 'f2398a1b9bb41f1f2dc039303ec0a6b8c8ccfada', name: "icon-left" }))), h("span", { key: 'de70419bb5a522cd5425096f6da19752736d14b8', class: "co-chip__label" }, h("slot", { key: '6bf611ee5235e60514eb2b3f37040183f7e0032c' }, this.label), this.valueLabel != null && this.valueLabel !== '' && (h("span", { key: 'bc36276493cd3ff26ce131c85094125b27791028', class: "co-chip__value", part: "value" }, `: ${this.valueLabel}`))), this.iconRight && !hasRightSlot && !this.removable && (h("span", { key: '8d20d206a23ed7109c5cc40b2beb278fd0e89614', class: "co-chip__icon-right", part: "icon-right" }, h("co-icon", { key: '28cdb555b65fefcf3e3471aea46fe4ec0d2aad18', name: this.iconRight, size: iconSize, weight: this.iconWeight }))), hasRightSlot && (h("span", { key: '009206c164ae5d378481e8512fe8e63c921bb57e', class: "co-chip__icon-right", part: "icon-right" }, h("slot", { key: '8397bf2f3add45386d34b61964fe6ea5ecb05f70', name: "icon-right" }))), this.removable && (h("span", { key: 'bb95705bdb89959b8bc64a5d692d54dcc2387e0b', class: "co-chip__remove", part: "remove", role: "button", tabIndex: this.disabled ? -1 : 0, onClick: this.handleRemove, "aria-label": "Remove" }, h("co-icon", { key: 'a616ebe4d69c08be3bb908e7da1dcdd15a4c257a', name: "x-circle", size: removeIconSize, weight: "fill" }))), this.trailingIcon && (h("span", { key: '3302ddb23482eaeff3a4ba2de38282f423768b2c', class: "co-chip__trailing", part: "trailing" }, h("co-icon", { key: '34a716149f174722d7b7a5549821a80ee7cdad63', name: this.trailingIcon, size: trailingIconSize, weight: this.iconWeight })))));
     }
     static get is() { return "co-chip"; }
     static get encapsulation() { return "shadow"; }