@prolibu-suite/cobalt-core 0.6.0 → 0.8.0

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

@@ -191,6 +191,52 @@
   position: relative;
 }
 
+/* Scrollbar del body: receta auto-hide canónica del app (thin, track
+   transparente, thumb invisible en reposo → aparece al hover del body, más
+   oscuro al interactuar) — misma conducta que el resto de scrolls de la suite.
+
+   ⚠️ Por qué props ESTÁNDAR explícitas y no solo ::-webkit: `scrollbar-color`
+   es HEREDADA — el global del app (`* { scrollbar-color: … }`, light DOM)
+   matchea el host <co-drawer> y hereda A TRAVÉS del shadow hasta este body.
+   Con una prop estándar activa, Chromium IGNORA todas las reglas ::-webkit,
+   así que la conducta real la deciden los valores estándar: se declaran acá
+   COMPLETOS (reposo + hover) para que el componente sea autocontenido y no
+   dependa de qué herede del host. Las reglas ::-webkit quedan para Safari
+   (no soporta las estándar). */
+.co-drawer__body {
+  scrollbar-width: thin;
+  scrollbar-color: transparent transparent;
+}
+
+.co-drawer__body:hover {
+  scrollbar-color: var(--co-color-opacity-negro-16) transparent;
+}
+
+.co-drawer__body::-webkit-scrollbar {
+  width: 6px;
+}
+
+.co-drawer__body::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.co-drawer__body::-webkit-scrollbar-thumb {
+  background: transparent;
+  border-radius: 9999px;
+}
+
+.co-drawer__body:hover::-webkit-scrollbar-thumb {
+  background: var(--co-color-opacity-negro-16);
+}
+
+.co-drawer__body:hover::-webkit-scrollbar-thumb:hover {
+  background: var(--co-color-opacity-negro-25);
+}
+
+.co-drawer__body:hover::-webkit-scrollbar-thumb:active {
+  background: var(--co-color-opacity-negro-50);
+}
+
 /* ─── Footer ──────────────────────────────────────────────── */
 .co-drawer__footer {
   display: flex;

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

@@ -93,7 +93,7 @@ export class CoDrawer {
                 'co-drawer--modeless': this.modeless,
                 [`co-drawer--${this.position}`]: true,
                 [`co-drawer--${this.size}`]: true,
-            }, popover: this.modeless ? 'manual' : undefined, ref: this.modeless ? this.promoteModeless : undefined, part: "drawer", role: "dialog", "aria-modal": this.modeless ? 'false' : 'true', "aria-labelledby": "co-drawer-heading", onClick: this.stopPropagation, onTransitionEnd: this.handleTransitionEnd }, h("div", { class: "co-drawer__card" }, h("header", { class: "co-drawer__header", part: "header" }, h("div", { class: "co-drawer__header-content" }, h("slot", { name: "header" }, h("div", { class: "co-drawer__heading-row" }, this.icon && h("co-icon", { name: this.icon, size: 20, class: "co-drawer__icon" }), h("h2", { class: "co-drawer__heading", id: "co-drawer-heading" }, this.heading)), this.description && h("p", { class: "co-drawer__description" }, this.description))), this.closable && (h("button", { class: "co-drawer__close", type: "button", "aria-label": "Close", onClick: this.handleCloseClick }, h("co-icon", { name: "x", size: 20 })))), h("div", { class: "co-drawer__tabs", part: "tabs" }, h("slot", { name: "tabs" })), h("div", { class: "co-drawer__body", part: "body" }, h("slot", null), h("co-loader", { overlay: true, visible: this.loading, part: "loader" })), h("footer", { class: "co-drawer__footer", part: "footer" }, h("slot", { name: "footer" })))));
+            }, popover: this.modeless ? 'manual' : undefined, ref: this.modeless ? this.promoteModeless : undefined, part: "drawer", role: "dialog", "aria-modal": this.modeless ? 'false' : 'true', "aria-labelledby": "co-drawer-heading", onClick: this.stopPropagation, onTransitionEnd: this.handleTransitionEnd }, h("div", { class: "co-drawer__card", part: "card" }, h("header", { class: "co-drawer__header", part: "header" }, h("div", { class: "co-drawer__header-content" }, h("slot", { name: "header" }, h("div", { class: "co-drawer__heading-row" }, this.icon && h("co-icon", { name: this.icon, size: 20, class: "co-drawer__icon" }), h("h2", { class: "co-drawer__heading", id: "co-drawer-heading" }, this.heading)), this.description && h("p", { class: "co-drawer__description" }, this.description))), this.closable && (h("button", { class: "co-drawer__close", type: "button", "aria-label": "Close", onClick: this.handleCloseClick }, h("co-icon", { name: "x", size: 20 })))), h("div", { class: "co-drawer__tabs", part: "tabs" }, h("slot", { name: "tabs" })), h("div", { class: "co-drawer__body", part: "body" }, h("slot", null), h("co-loader", { overlay: true, visible: this.loading, part: "loader" })), h("footer", { class: "co-drawer__footer", part: "footer" }, h("slot", { name: "footer" })))));
         if (this.modeless)
             return aside;
         return (h("co-overlay", { open: this.open, onCoClose: this.handleOverlayClose }, aside));

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

@@ -74,7 +74,7 @@ export class CoDriveCard {
     }
     render() {
         const isFile = this.variant === 'file';
-        return (h("div", { key: '8f843886a6953476f075dcec86567da6d6160d51', class: {
+        return (h("div", { key: 'de146bee6d498936524230709866a1b79ad3b34f', class: {
                 'co-drive-card': true,
                 [`co-drive-card--${this.variant}`]: true,
                 [`co-drive-card--${this.density}`]: true,

package/dist/collection/components/co-drop-zone/co-drop-zone.js

@@ -58,7 +58,7 @@ export class CoDropZone {
         this.coDragStateChange.emit(next);
     }
     render() {
-        return (h(Host, { key: '015443db8a6c29e05a99dfd947c9dbc258a244a2', class: { 'co-drop-zone': true, 'co-drop-zone--active': this.active }, part: "host", style: { '--co-drop-zone-accent': this.accent }, onDragEnter: this.handleDragEnter, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("slot", { key: '5d1756f75bf122e538842f146635ed7d6181b376' }), this.active && (h("div", { key: '1f52982512900c61cfbfa38f2fcf05db785c656e', class: "co-drop-zone__overlay", part: "overlay" }, h("div", { key: '32a754269cb02d8010403545ab351eaa870e42e7', class: "co-drop-zone__badge", part: "badge" }, h("co-icon", { key: 'fa72d2e3802970233742faf1ce48b16594fd1d25', name: this.icon, size: 34 })), h("span", { key: '92d2d4b8daa9d1cb3eb1d79c1fe0a59ac290c9aa', class: "co-drop-zone__label", part: "label" }, this.label)))));
+        return (h(Host, { key: 'cafe8242c821aa2258ab579cd5ecc82b77e2d7b3', class: { 'co-drop-zone': true, 'co-drop-zone--active': this.active }, part: "host", style: { '--co-drop-zone-accent': this.accent }, onDragEnter: this.handleDragEnter, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("slot", { key: 'ec3c95cda838eab85e6a825c437954a190c0d25c' }), this.active && (h("div", { key: '74150a61764fde4ae351a7105916cde81ad42c80', class: "co-drop-zone__overlay", part: "overlay" }, h("div", { key: 'a7622e82346dd8657e6fbfeb7476b7f948e5ad25', class: "co-drop-zone__badge", part: "badge" }, h("co-icon", { key: '73725c98333f7a9fef978b82c447f631c742996b', name: this.icon, size: 34 })), h("span", { key: 'cf5900ec506c13664149598f6a509c50b405f7af', class: "co-drop-zone__label", part: "label" }, this.label)))));
     }
     static get is() { return "co-drop-zone"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-empty-state/co-empty-state.js

@@ -13,11 +13,11 @@ export class CoEmptyState {
     render() {
         var _a;
         const iconWeight = (_a = this.iconWeight) !== null && _a !== void 0 ? _a : (this.variant === 'card' ? 'regular' : 'light');
-        return (h("div", { key: '4cf85c1fd72560c3fde039901adbac86a4fc147f', class: {
+        return (h("div", { key: '20c49e1fdadfe4813274a443b13686e9bf628449', class: {
                 'co-empty-state': true,
                 [`co-empty-state--${this.variant}`]: true,
                 [`co-empty-state--${this.size}`]: true,
-            }, part: "empty-state" }, this.icon && (h("div", { key: '4f8e8922631a5b88a9e158c2a6235515e8d09022', class: "co-empty-state__icon" }, h("co-icon", { key: '66fe90f142047bd3c03f901443e91b9a654e2bfa', name: this.icon, size: 40, weight: iconWeight }))), this.heading && (h("div", { key: 'fba5fe8abb82a90902e069d2f06730a3240b3cff', class: "co-empty-state__heading" }, this.heading)), this.description && (h("div", { key: '82bb5115feb16737e9a6658a508ba6faa1ab1e24', class: "co-empty-state__description" }, this.description)), h("div", { key: '048fb44e84e107232753f0d203f512dba556338b', class: "co-empty-state__actions" }, h("slot", { key: 'd7b1111baa84f9eeda18606f18b721865678bfd5' }))));
+            }, part: "empty-state" }, this.icon && (h("div", { key: 'd8a2167915f146c1de68475f8c0852c3dfc87a01', class: "co-empty-state__icon" }, h("co-icon", { key: '13d13be52c5754baf96fe7b699169e2f0a3761ab', name: this.icon, size: 40, weight: iconWeight }))), this.heading && (h("div", { key: 'ef0b94049516827ba30b63022c591b367f2d4081', class: "co-empty-state__heading" }, this.heading)), this.description && (h("div", { key: '25a21c6d97a387ac36eb8ff9abfc00806becab46', class: "co-empty-state__description" }, this.description)), h("div", { key: '6118e691a0d6ad780f06b23fae588cae43a6fa74', class: "co-empty-state__actions" }, h("slot", { key: 'dbd56768f75258c08bc9958ea4665c1d95500bfe' }))));
     }
     static get is() { return "co-empty-state"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/co-event-calendar/co-event-calendar.css

@@ -28,18 +28,25 @@
   gap: var(--co-spacing-md);
 }
 
-.cal__nav-group {
-  display: inline-flex;
+/* Grupo central: ‹ Título › (flechas flanqueando el título, centrado en el toolbar). */
+.cal__title-group {
+  flex: 1 1 auto;
+  min-width: 0;
+  display: flex;
   align-items: center;
+  justify-content: center;
   gap: var(--co-spacing-xs);
 }
 
 .cal__title {
-  flex: 1 1 auto;
   margin: 0;
-  text-align: center;
-  font-size: var(--co-font-size-16, 16px);
-  font-weight: 600;
+  min-width: 0;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  font-size: var(--co-font-size-20, 20px);
+  font-weight: 400;
+  letter-spacing: -0.01em;
   text-transform: capitalize;
   color: var(--co-semantic-text-default);
 }
@@ -55,7 +62,7 @@
   padding: 0 var(--co-spacing-md);
   background: none;
   border: 1px solid var(--co-semantic-border-default);
-  border-radius: var(--co-border-radius-xs);
+  border-radius: var(--co-border-radius-full);
   font-family: inherit;
   font-size: var(--co-font-size-14, 14px);
   color: var(--co-semantic-text-default);
@@ -129,10 +136,15 @@
   display: flex;
   flex-direction: column;
 }
+
 .cal__body co-calendar-month {
   flex: 1 1 auto;
   min-block-size: 0;
 }
+.cal__body co-calendar-timegrid {
+  flex: 1 1 auto;
+  min-block-size: 0;
+}
 
 .cal__placeholder {
   flex: 1 1 auto;