@prolibu-suite/cobalt-core 0.11.2 → 0.11.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +71 -31
- package/dist/cjs/co-chip_2.cjs.entry.js +1 -1
- package/dist/cjs/co-number-field.cjs.entry.js +12 -4
- package/dist/cjs/co-toggle-button.cjs.entry.js +1 -1
- package/dist/cobalt/cobalt.esm.js +1 -1
- package/dist/cobalt/p-7c20207b.entry.js +1 -0
- package/dist/cobalt/{p-efd3e0de.entry.js → p-9b114836.entry.js} +1 -1
- package/dist/cobalt/p-e5f0d560.entry.js +1 -0
- package/dist/collection/components/co-autocomplete/co-autocomplete.js +1 -1
- package/dist/collection/components/co-avatar-group/co-avatar-group.js +1 -1
- package/dist/collection/components/co-checkbox-group/co-checkbox-group.js +1 -1
- package/dist/collection/components/co-color-area/co-color-area.js +2 -2
- package/dist/collection/components/co-color-slider/co-color-slider.js +1 -1
- package/dist/collection/components/co-combobox/co-combobox.js +1 -1
- package/dist/collection/components/co-command-search/co-command-search.js +1 -1
- package/dist/collection/components/co-data-table/co-data-table.js +1 -1
- package/dist/collection/components/co-date-range-picker/co-date-range-picker.js +2 -2
- package/dist/collection/components/co-document-editor/co-document-editor.js +5 -5
- package/dist/collection/components/co-number-field/co-number-field.js +12 -4
- package/dist/collection/components/co-option-list/co-option-list.css +30 -4
- package/dist/collection/components/co-popover/co-popover.js +1 -1
- package/dist/collection/components/co-radio-group/co-radio-group.js +1 -1
- package/dist/collection/components/co-ref-field/co-ref-field.js +4 -4
- package/dist/collection/components/co-segmented-bar/co-segmented-bar.js +1 -1
- package/dist/collection/components/co-select/co-select.js +1 -1
- package/dist/collection/components/co-sidebar-nav/co-sidebar-nav.js +1 -1
- package/dist/collection/components/co-toast/co-toast.js +2 -2
- package/dist/collection/components/co-toggle-button/co-toggle-button.css +43 -13
- package/dist/collection/components/co-transfer-list/co-transfer-list.js +1 -1
- package/dist/collection/components/co-tree-item/co-tree-item.js +2 -2
- package/dist/components/co-autocomplete.js +1 -1
- package/dist/components/co-combobox.js +1 -1
- package/dist/components/co-command-search.js +1 -1
- package/dist/components/co-number-field.js +1 -1
- package/dist/components/co-option-list.js +1 -1
- package/dist/components/co-ref-field.js +1 -1
- package/dist/components/co-toggle-button.js +1 -1
- package/dist/components/{p-Cnfd6Zze.js → p-BqFBZ1PT.js} +1 -1
- package/dist/esm/co-chip_2.entry.js +1 -1
- package/dist/esm/co-number-field.entry.js +12 -4
- package/dist/esm/co-toggle-button.entry.js +1 -1
- package/package.json +2 -2
- package/dist/cobalt/p-9ee5bef3.entry.js +0 -1
- package/dist/cobalt/p-ae999b94.entry.js +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as o,c as t,h as e,a as r}from"./p-DJkaRtbb.js";const a=new Set(["l","m","s","xs"]),c=class{constructor(e){o(this,e),this.coToggle=t(this,"coToggle",7),this.selected=!1,this.value="",this.size="m",this.disabled=!1,this.variant="connected",this.handleClick=()=>{this.disabled||(this.selected=!this.selected,this.coToggle.emit({value:this.value,selected:this.selected}))}}componentWillLoad(){this.adoptGroupSize()}adoptGroupSize(){var o,t;if(this.el.hasAttribute("size")||null!=this.size&&"m"!==this.size)return;const e=this.el.closest("co-toggle-button-group");if(!e)return;const r=null!==(o=e.variant)&&void 0!==o?o:e.getAttribute("variant"),c=null!==(t=e.size)&&void 0!==t?t:e.getAttribute("size");((o,t)=>a.has(null!=t?t:"")&&("soft"===o||"track"===o&&"xs"===t))(r,c)&&(this.size=c)}render(){const o="track"===this.variant?"xs"===this.size?14:18:"l"===this.size?20:"xs"===this.size?14:16,t=this.selected&&this.selectedIconWeight?this.selectedIconWeight:void 0;return e("button",{key:"a0b0aa7d128e4ee66a91a223851b126684d8e997",part:"button",class:{"co-toggle-button":!0,"co-toggle-button--selected":this.selected,[`co-toggle-button--${this.size}`]:!0,"co-toggle-button--disabled":this.disabled,"co-toggle-button--icon-only":!(this.label||!this.iconLeft&&!this.iconRight)},type:"button",disabled:this.disabled,"aria-pressed":String(this.selected),onClick:this.handleClick},e("slot",{key:"d683a91a68fb3820a01b8bd91dc3b81b8d8994f0",name:"leading"}),this.iconLeft&&e("co-icon",{key:"6894633951caa68a614824af931a33dc46a552ab",name:this.iconLeft,size:o,weight:t}),this.label&&e("span",{key:"96d902f0f28a8ea8a810425cf775ff6a9437be4d",class:"co-toggle-button__label"},this.label),this.iconRight&&e("co-icon",{key:"4e5db3f34af24fffce2ec95e4a7767c82768db39",name:this.iconRight,size:o,weight:t}))}get el(){return r(this)}};c.style=":host{display:inline-flex;--co-toggle-button-radius:var(--co-border-radius-sm)}:host([size='l']){--co-toggle-button-radius:var(--co-border-radius-lg)}:host([size='m']){--co-toggle-button-radius:var(--co-border-radius-sm)}:host([size='s']){--co-toggle-button-radius:var(--co-border-radius-xs)}:host([size='xs']){--co-toggle-button-radius:var(--co-border-radius-xs)}.co-toggle-button{display:inline-flex;width:var(--co-toggle-button-width, auto);align-items:center;justify-content:center;gap:var(--co-spacing-sm2);border:1px solid var(--co-semantic-border-subtle);border-top-left-radius:var(--co-tbr-tl, var(--co-toggle-button-radius));border-top-right-radius:var(--co-tbr-tr, var(--co-toggle-button-radius));border-bottom-right-radius:var(--co-tbr-br, var(--co-toggle-button-radius));border-bottom-left-radius:var(--co-tbr-bl, var(--co-toggle-button-radius));background:color-mix(in srgb, var(--co-semantic-surface-secondary) 35%, transparent);-webkit-backdrop-filter:var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));backdrop-filter:var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));color:var(--co-toggle-button-color, var(--co-semantic-text-default));font-family:var(--co-font-family-primary);font-weight:500;cursor:pointer;transition:background var(--co-motion-duration-fast) var(--co-motion-ease-out), border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), color var(--co-motion-duration-fast) var(--co-motion-ease-out);white-space:nowrap;box-sizing:border-box;line-height:1}.co-toggle-button--l{height:48px;padding:0 var(--co-spacing-lg);font-size:var(--co-toggle-button-font-size, var(--co-font-size-16))}.co-toggle-button--m{height:40px;padding:0 var(--co-spacing-md);font-size:var(--co-toggle-button-font-size, var(--co-font-size-14))}.co-toggle-button--s{height:32px;padding:0 var(--co-spacing-sm2);font-size:var(--co-toggle-button-font-size, var(--co-font-size-14))}.co-toggle-button--xs{height:24px;padding:0 var(--co-spacing-sm);font-size:var(--co-toggle-button-font-size, var(--co-font-size-12))}.co-toggle-button--icon-only.co-toggle-button--l{width:48px;padding:0}.co-toggle-button--icon-only.co-toggle-button--m{width:40px;padding:0}.co-toggle-button--icon-only.co-toggle-button--s{width:32px;padding:0}.co-toggle-button--icon-only.co-toggle-button--xs{width:24px;padding:0}.co-toggle-button:hover:not(:disabled){background:var(--co-semantic-surface-hover)}.co-toggle-button--selected{background:var(--co-color-base-negro, #1f1c1b);color:var(--co-toggle-button-color-selected, var(--co-color-base-blanco, #fff));border-color:var(--co-color-base-negro, #1f1c1b)}.co-toggle-button--selected:hover:not(:disabled){background:var(--co-color-gray-800, #0a0a0a);border-color:var(--co-color-gray-800, #0a0a0a)}.co-toggle-button--disabled{opacity:0.4;cursor:not-allowed}.co-toggle-button:focus-visible{outline:2px solid var(--co-semantic-text-default);outline-offset:-3px}.co-toggle-button--selected:focus-visible{outline-color:currentColor}.co-toggle-button__label{line-height:1}@supports not (background: color-mix(in srgb, red, transparent)){.co-toggle-button{background:var(--co-semantic-surface-secondary)}}:host([variant='track']) .co-toggle-button{height:var(--co-toggle-pill-height, 30px);border-radius:var(--co-toggle-pill-radius, 8px);border-color:transparent;background:transparent;color:var(--co-toggle-button-color, var(--co-semantic-text-secondary));box-shadow:none;padding:0 12px;-webkit-backdrop-filter:none;backdrop-filter:none}:host([variant='track']) .co-toggle-button.co-toggle-button--icon-only{width:34px;padding:0}:host([variant='track']) .co-toggle-button:hover:not(:disabled){background:var(--co-semantic-surface-hover);color:var(--co-toggle-button-color-hover, var(--co-semantic-text-default))}:host([variant='track']) .co-toggle-button--selected{background:var(--co-semantic-surface-page);color:var(--co-toggle-button-color-selected, var(--co-semantic-text-default));border-color:var(--co-toggle-pill-border, var(--co-semantic-border-default));box-shadow:var(--co-toggle-pill-shadow, var(--co-shadow-sm, 0 1px 2px 0 rgba(26, 26, 26, 0.04)))}:host([variant='track']) .co-toggle-button--selected:hover:not(:disabled){background:var(--co-semantic-surface-page);color:var(--co-toggle-button-color-selected, var(--co-semantic-text-default));border-color:var(--co-toggle-pill-border, var(--co-semantic-border-default))}:host([variant='track'][size='xs']) .co-toggle-button{height:var(--co-toggle-pill-height, 20px);border-radius:var(--co-toggle-pill-radius, var(--co-border-radius-xxs))}:host([variant='track'][size='xs']) .co-toggle-button:not(.co-toggle-button--selected){color:var(--co-toggle-button-color, var(--co-semantic-text-default))}:host([variant='track'][size='xs']) .co-toggle-button:not(.co-toggle-button--selected):hover:not(:disabled){color:var(--co-toggle-button-color-hover, var(--co-semantic-text-default))}:host([variant='track'][size='xs']) .co-toggle-button.co-toggle-button--icon-only{width:20px}:host([variant='track'][size='xs']) .co-toggle-button--selected{box-shadow:var(--co-toggle-pill-shadow, none)}:host([variant='soft']) .co-toggle-button{height:24px;border-radius:var(--co-border-radius-xxs);border-color:transparent;background:var(--co-semantic-surface-control, #f6f6f6);color:var(--co-toggle-button-color, var(--co-semantic-text-default));font-size:var(--co-font-size-12);font-weight:var(--co-font-weight-regular);padding:0 calc(var(--co-spacing-sm2) - 1px);gap:var(--co-spacing-sm2);-webkit-backdrop-filter:none;backdrop-filter:none}:host([variant='soft']) .co-toggle-button:hover:not(:disabled){background:var(--co-semantic-surface-control, #f6f6f6)}:host([variant='soft']) .co-toggle-button--selected{background:var(--co-color-celeste-100);color:var(--co-toggle-button-color-selected, var(--co-color-primary-azul));border-color:transparent}:host([variant='soft']) .co-toggle-button--selected:hover:not(:disabled){background:var(--co-color-celeste-100)}";export{c as co_toggle_button}
|
|
@@ -431,7 +431,7 @@ export class CoAutocomplete {
|
|
|
431
431
|
"references": {
|
|
432
432
|
"AutocompleteOption": {
|
|
433
433
|
"location": "local",
|
|
434
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
434
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-autocomplete/co-autocomplete.tsx",
|
|
435
435
|
"id": "src/components/co-autocomplete/co-autocomplete.tsx::AutocompleteOption"
|
|
436
436
|
}
|
|
437
437
|
}
|
|
@@ -92,7 +92,7 @@ export class CoAvatarGroup {
|
|
|
92
92
|
"references": {
|
|
93
93
|
"CoAvatarGroupItem": {
|
|
94
94
|
"location": "local",
|
|
95
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
95
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-avatar-group/co-avatar-group.tsx",
|
|
96
96
|
"id": "src/components/co-avatar-group/co-avatar-group.tsx::CoAvatarGroupItem"
|
|
97
97
|
}
|
|
98
98
|
}
|
|
@@ -236,7 +236,7 @@ export class CoCheckboxGroup {
|
|
|
236
236
|
"references": {
|
|
237
237
|
"CheckboxOption": {
|
|
238
238
|
"location": "local",
|
|
239
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
239
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-checkbox-group/co-checkbox-group.tsx",
|
|
240
240
|
"id": "src/components/co-checkbox-group/co-checkbox-group.tsx::CheckboxOption"
|
|
241
241
|
}
|
|
242
242
|
}
|
|
@@ -310,7 +310,7 @@ export class CoColorArea {
|
|
|
310
310
|
"references": {
|
|
311
311
|
"ColorAreaDetail": {
|
|
312
312
|
"location": "local",
|
|
313
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
313
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-color-area/co-color-area.tsx",
|
|
314
314
|
"id": "src/components/co-color-area/co-color-area.tsx::ColorAreaDetail"
|
|
315
315
|
}
|
|
316
316
|
}
|
|
@@ -331,7 +331,7 @@ export class CoColorArea {
|
|
|
331
331
|
"references": {
|
|
332
332
|
"ColorAreaDetail": {
|
|
333
333
|
"location": "local",
|
|
334
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
334
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-color-area/co-color-area.tsx",
|
|
335
335
|
"id": "src/components/co-color-area/co-color-area.tsx::ColorAreaDetail"
|
|
336
336
|
}
|
|
337
337
|
}
|
|
@@ -215,7 +215,7 @@ export class CoColorSlider {
|
|
|
215
215
|
"references": {
|
|
216
216
|
"ColorSliderChannel": {
|
|
217
217
|
"location": "local",
|
|
218
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
218
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-color-slider/co-color-slider.tsx",
|
|
219
219
|
"id": "src/components/co-color-slider/co-color-slider.tsx::ColorSliderChannel"
|
|
220
220
|
}
|
|
221
221
|
}
|
|
@@ -545,7 +545,7 @@ export class CoCombobox {
|
|
|
545
545
|
"references": {
|
|
546
546
|
"ComboboxOption": {
|
|
547
547
|
"location": "local",
|
|
548
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
548
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-combobox/co-combobox.tsx",
|
|
549
549
|
"id": "src/components/co-combobox/co-combobox.tsx::ComboboxOption"
|
|
550
550
|
}
|
|
551
551
|
}
|
|
@@ -257,7 +257,7 @@ export class CoCommandSearch {
|
|
|
257
257
|
"references": {
|
|
258
258
|
"CommandItem": {
|
|
259
259
|
"location": "local",
|
|
260
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
260
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-command-search/co-command-search.tsx",
|
|
261
261
|
"id": "src/components/co-command-search/co-command-search.tsx::CommandItem"
|
|
262
262
|
}
|
|
263
263
|
}
|
|
@@ -509,7 +509,7 @@ export class CoDataTable {
|
|
|
509
509
|
"references": {
|
|
510
510
|
"CoDataTableColumn": {
|
|
511
511
|
"location": "local",
|
|
512
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
512
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-data-table/co-data-table.tsx",
|
|
513
513
|
"id": "src/components/co-data-table/co-data-table.tsx::CoDataTableColumn"
|
|
514
514
|
}
|
|
515
515
|
}
|
|
@@ -1055,7 +1055,7 @@ export class CoDateRangePicker {
|
|
|
1055
1055
|
"references": {
|
|
1056
1056
|
"DateRangeValue": {
|
|
1057
1057
|
"location": "local",
|
|
1058
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
1058
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-date-range-picker/co-date-range-picker.tsx",
|
|
1059
1059
|
"id": "src/components/co-date-range-picker/co-date-range-picker.tsx::DateRangeValue"
|
|
1060
1060
|
}
|
|
1061
1061
|
}
|
|
@@ -1076,7 +1076,7 @@ export class CoDateRangePicker {
|
|
|
1076
1076
|
"references": {
|
|
1077
1077
|
"DateRangeValue": {
|
|
1078
1078
|
"location": "local",
|
|
1079
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
1079
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-date-range-picker/co-date-range-picker.tsx",
|
|
1080
1080
|
"id": "src/components/co-date-range-picker/co-date-range-picker.tsx::DateRangeValue"
|
|
1081
1081
|
}
|
|
1082
1082
|
}
|
|
@@ -936,7 +936,7 @@ export class CoDocumentEditor {
|
|
|
936
936
|
"references": {
|
|
937
937
|
"DocumentPageSize": {
|
|
938
938
|
"location": "local",
|
|
939
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
939
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-document-editor/co-document-editor.tsx",
|
|
940
940
|
"id": "src/components/co-document-editor/co-document-editor.tsx::DocumentPageSize"
|
|
941
941
|
}
|
|
942
942
|
}
|
|
@@ -962,7 +962,7 @@ export class CoDocumentEditor {
|
|
|
962
962
|
"references": {
|
|
963
963
|
"DocumentMargins": {
|
|
964
964
|
"location": "local",
|
|
965
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
965
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-document-editor/co-document-editor.tsx",
|
|
966
966
|
"id": "src/components/co-document-editor/co-document-editor.tsx::DocumentMargins"
|
|
967
967
|
}
|
|
968
968
|
}
|
|
@@ -1027,7 +1027,7 @@ export class CoDocumentEditor {
|
|
|
1027
1027
|
"references": {
|
|
1028
1028
|
"DocumentFeatures": {
|
|
1029
1029
|
"location": "local",
|
|
1030
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
1030
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-document-editor/co-document-editor.tsx",
|
|
1031
1031
|
"id": "src/components/co-document-editor/co-document-editor.tsx::DocumentFeatures"
|
|
1032
1032
|
}
|
|
1033
1033
|
}
|
|
@@ -1220,7 +1220,7 @@ export class CoDocumentEditor {
|
|
|
1220
1220
|
"references": {
|
|
1221
1221
|
"DocumentHeaderDetail": {
|
|
1222
1222
|
"location": "local",
|
|
1223
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
1223
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-document-editor/co-document-editor.tsx",
|
|
1224
1224
|
"id": "src/components/co-document-editor/co-document-editor.tsx::DocumentHeaderDetail"
|
|
1225
1225
|
}
|
|
1226
1226
|
}
|
|
@@ -1256,7 +1256,7 @@ export class CoDocumentEditor {
|
|
|
1256
1256
|
"references": {
|
|
1257
1257
|
"DocumentActionDetail": {
|
|
1258
1258
|
"location": "local",
|
|
1259
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
1259
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-document-editor/co-document-editor.tsx",
|
|
1260
1260
|
"id": "src/components/co-document-editor/co-document-editor.tsx::DocumentActionDetail"
|
|
1261
1261
|
}
|
|
1262
1262
|
}
|
|
@@ -10,6 +10,11 @@ import { formatAmountText, parseNumericText, stripAmountText } from "../../utils
|
|
|
10
10
|
* blur—, solo impide que el campo muestre algo que no es un número.
|
|
11
11
|
*/
|
|
12
12
|
const NON_NUMERIC = /[^0-9.,-]/g;
|
|
13
|
+
/** «12,5» → «12.5»; con dos comas o con punto no se adivina (queda igual). */
|
|
14
|
+
function decimalCommaToDot(raw) {
|
|
15
|
+
const commas = raw.split(',').length - 1;
|
|
16
|
+
return commas === 1 && !raw.includes('.') ? raw.replace(',', '.') : raw;
|
|
17
|
+
}
|
|
13
18
|
/** Caracteres que CUENTAN para el caret en modo amount (la coma es decorado). */
|
|
14
19
|
const SIGNIFICANT = /[0-9.-]/;
|
|
15
20
|
const countSignificant = (text) => {
|
|
@@ -122,7 +127,10 @@ export class CoNumberField {
|
|
|
122
127
|
}
|
|
123
128
|
if (raw === '-')
|
|
124
129
|
return;
|
|
125
|
-
|
|
130
|
+
// Una coma sola y sin punto es el separador decimal (es/pt: «12,5»): parseFloat
|
|
131
|
+
// cortaría en ella y commitearía 12. Solo se normaliza lo que se parsea — el
|
|
132
|
+
// texto del campo queda como lo tipeó el usuario (y el caret en su lugar).
|
|
133
|
+
const num = parseFloat(decimalCommaToDot(raw));
|
|
126
134
|
if (!isNaN(num)) {
|
|
127
135
|
this.emitValue(this.fromDisplay(num));
|
|
128
136
|
}
|
|
@@ -337,18 +345,18 @@ export class CoNumberField {
|
|
|
337
345
|
return this.scaled && !this.isEmpty ? '%' : null;
|
|
338
346
|
}
|
|
339
347
|
render() {
|
|
340
|
-
return (h("div", { key: '
|
|
348
|
+
return (h("div", { key: '87d77047c35e2f0b3b9a978839e5b3c99541dc2e', class: {
|
|
341
349
|
'co-number-field': true,
|
|
342
350
|
'co-number-field--disabled': this.disabled,
|
|
343
351
|
'co-number-field--focused': this.focused,
|
|
344
352
|
[`co-number-field--${this.size}`]: true,
|
|
345
353
|
[`co-number-field--${this.status}`]: this.status !== 'default',
|
|
346
|
-
} }, (this.label || this.secondaryLabel) && (h("div", { key: '
|
|
354
|
+
} }, (this.label || this.secondaryLabel) && (h("div", { key: '22f0674035a68861fae6ce37aba4e51b10c03226', class: "co-number-field__labels" }, this.label && h("label", { key: '442ee74bed62bf7c800f231ad4992b791b85a30c', class: "co-number-field__label" }, this.label, h(RequiredMark, { key: 'ff7517b83b8e942512dcb8c1f504eafab55cea90', required: this.required })), this.secondaryLabel && h("span", { key: '736889aae85065fb28a56131e2f7a3da9fc86a48', class: "co-number-field__secondary-label" }, this.secondaryLabel))), h("div", { key: 'fd6163c7cb83073db2c19c3477447076372abb44', class: "co-number-field__row", part: "row" }, !this.hideControls && (h("button", { key: 'e1a52831b83c3255ce63c4ed48a228fe4fdb1629', class: "co-number-field__btn co-number-field__btn--minus", type: "button", tabIndex: -1, disabled: !this.canDecrement, onClick: this.handleDecrement, "aria-label": "Decrease" }, h("co-icon", { key: '86e0ce9b9801e50d9bda6b18a8e1f6f96581b178', name: "minus", size: 16 }))), h("input", { key: '4bdf89e9a4958841a948b3bd6e9886898917f464', ref: el => (this.inputEl = el), class: "co-number-field__input", type: "text", inputMode: "decimal",
|
|
347
355
|
// Mismo guard `focused` que el @Watch: mientras el usuario edita, su
|
|
348
356
|
// texto manda. Sin esto, el re-render que dispara emitValue repinta
|
|
349
357
|
// el input desde el NÚMERO y se come el texto en construcción
|
|
350
358
|
// ("34,640.00" pegado quedaba "34,640"; un "12." perdería el punto).
|
|
351
|
-
value: this.focused && this.inputEl ? this.inputEl.value : this.displayValue, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput, onPaste: this.handlePaste, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, part: "input" }), this.affixText && (h("span", { key: '
|
|
359
|
+
value: this.focused && this.inputEl ? this.inputEl.value : this.displayValue, placeholder: this.placeholder, disabled: this.disabled, onInput: this.handleInput, onPaste: this.handlePaste, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, part: "input" }), this.affixText && (h("span", { key: '7bc7c12c6fe2708691d9a2972f9ed3037e82a1a8', class: "co-number-field__affix", "aria-hidden": "true" }, this.affixText)), this.clearable && !this.isEmpty && !this.disabled && (h("button", { key: '2ef7c424a34a8a6cbfe8ac4cd0a5d8f0ed74e6d4', class: "co-number-field__clear", type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear" }, h("co-icon", { key: 'c428ca841c0de013cd151bd356686be43992de04', name: "x-circle", size: 16, weight: "fill" }))), h("slot", { key: 'fb127a663d3839bbb10b8232b250eaf67faab898', name: "suffix" }), !this.hideControls && (h("button", { key: '684329d2f32a58f6be2a124f0cd20986a7fc49af', class: "co-number-field__btn co-number-field__btn--plus", type: "button", tabIndex: -1, disabled: !this.canIncrement, onClick: this.handleIncrement, "aria-label": "Increase" }, h("co-icon", { key: '7ef48466e060efb314466d62216a8e00168ddbcd', name: "plus", size: 16 })))), this.helperText && (h("div", { key: '2cf6df2556160fef3c1dfd1b525991eb822cb285', class: `co-number-field__helper co-number-field__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: '905ad795d9714fa9ae8fc2b9d4b9f6a7bba2d2ce', name: this.statusIcon, size: 14, weight: "fill", class: "co-number-field__helper-icon" }), h("span", { key: '0c4825c4145298700de006eb3170e9ec3b52d3b7', class: "co-number-field__helper-text" }, this.helperText)))));
|
|
352
360
|
}
|
|
353
361
|
static get is() { return "co-number-field"; }
|
|
354
362
|
static get encapsulation() { return "shadow"; }
|
|
@@ -676,6 +676,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
|
|
|
676
676
|
* @prop --co-option-list-item-gap: Separación entre los elementos de una fila (ícono, textos, acciones).
|
|
677
677
|
* @prop --co-option-list-item-min-height: Alto mínimo de fila (default 32px); no cambia el paso fijo de la lista virtual.
|
|
678
678
|
* @prop --co-option-list-item-padding-y: Padding vertical de la fila.
|
|
679
|
+
* @prop --co-option-list-item-padding-start: Padding izquierdo de la fila (default 4px).
|
|
679
680
|
* @prop --co-option-list-item-radius: Radio de la fila.
|
|
680
681
|
* @prop --co-option-list-item-bg: Fondo de la fila en reposo.
|
|
681
682
|
* @prop --co-option-list-item-ring: Sombra/anillo de la fila en reposo.
|
|
@@ -688,6 +689,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
|
|
|
688
689
|
* @prop --co-option-list-icon-tile-radius: Radio del recuadro del ícono.
|
|
689
690
|
* @prop --co-option-list-icon-tile-mix: Porcentaje del tinte del ícono en el fondo del recuadro (default 12%).
|
|
690
691
|
* @prop --co-option-list-icon-tile-ring-mix: Porcentaje del tinte en el borde del recuadro (default 0%, sin borde).
|
|
692
|
+
* @prop --co-option-list-icon-tile-glyph-size: Lado del glifo dentro del recuadro del ícono (default 14px).
|
|
691
693
|
* @prop --co-option-list-search-height: Alto del buscador (default 32px).
|
|
692
694
|
* @prop --co-option-list-search-margin: Margen del buscador.
|
|
693
695
|
* @prop --co-option-list-search-padding: Padding del buscador.
|
|
@@ -697,7 +699,10 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
|
|
|
697
699
|
* @prop --co-option-list-search-border-focus: Color del borde del buscador con foco.
|
|
698
700
|
* @prop --co-option-list-search-bg-focus: Fondo del buscador con foco.
|
|
699
701
|
* @prop --co-option-list-search-caret: Color del cursor de texto del buscador.
|
|
702
|
+
* @prop --co-option-list-search-font-size: Tamaño del texto del buscador (default 14px).
|
|
703
|
+
* @prop --co-option-list-search-font-weight: Peso del texto del buscador (default 500).
|
|
700
704
|
* @prop --co-option-list-group-padding-top: Padding superior del encabezado de grupo.
|
|
705
|
+
* @prop --co-option-list-group-first-padding-top: Padding superior del PRIMER encabezado de grupo (default = el de todos).
|
|
701
706
|
* @prop --co-option-list-group-padding-bottom: Padding inferior del encabezado de grupo.
|
|
702
707
|
* @prop --co-option-list-group-font-family: Familia tipográfica del encabezado de grupo (default mono).
|
|
703
708
|
* @prop --co-option-list-group-font-size: Tamaño del encabezado de grupo.
|
|
@@ -742,7 +747,10 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
|
|
|
742
747
|
* `-search-margin` (12px 12px 0), `-search-padding` (0 8px 0 4px),
|
|
743
748
|
* `-search-border` (1px solid border-subtle), `-search-border-focus`
|
|
744
749
|
* (border-focus), `-search-bg` (transparent), `-search-bg-focus` (= bg),
|
|
745
|
-
* `-search-radius` (radius-xs) y `-search-caret` (auto).
|
|
750
|
+
* `-search-radius` (radius-xs) y `-search-caret` (auto). Tipografía del
|
|
751
|
+
* texto/placeholder: `-search-font-size` (14px) y `-search-font-weight` (500)
|
|
752
|
+
* — paletas con filas de 13 donde el buscador a 14/500 se leía más grande que
|
|
753
|
+
* la lista. Defaults = Figma. */
|
|
746
754
|
.co-option-list__search {
|
|
747
755
|
display: flex;
|
|
748
756
|
align-items: center;
|
|
@@ -779,8 +787,8 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
|
|
|
779
787
|
background: transparent;
|
|
780
788
|
padding: 0;
|
|
781
789
|
font-family: var(--co-font-family-primary, 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
|
|
782
|
-
font-size: var(--co-font-size-14, 14px);
|
|
783
|
-
font-weight: 500;
|
|
790
|
+
font-size: var(--co-option-list-search-font-size, var(--co-font-size-14, 14px));
|
|
791
|
+
font-weight: var(--co-option-list-search-font-weight, 500);
|
|
784
792
|
letter-spacing: var(--co-font-letter-spacing-body, -0.03em);
|
|
785
793
|
line-height: 1;
|
|
786
794
|
color: var(--co-semantic-text-default, #1f1c1b);
|
|
@@ -837,7 +845,9 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
|
|
|
837
845
|
min-width: 0;
|
|
838
846
|
min-height: var(--co-option-list-item-min-height, 32px);
|
|
839
847
|
box-sizing: border-box;
|
|
840
|
-
|
|
848
|
+
/* Overridable: `--co-option-list-item-padding-start` (default 4px) — paletas con tile grande que lo centran en la
|
|
849
|
+
fila con el mismo aire a la izquierda que arriba/abajo (fila 40 + tile 24: 8 por lado = 6 + el margen 2 del tile). */
|
|
850
|
+
padding: var(--co-option-list-item-padding-y, var(--co-spacing-xs, 4px)) var(--co-spacing-sm2, 8px) var(--co-option-list-item-padding-y, var(--co-spacing-xs, 4px)) var(--co-option-list-item-padding-start, var(--co-spacing-xs, 4px));
|
|
841
851
|
/* Overridables (paletas con filas-tarjeta, Attio): `--co-option-list-item-radius` (default 8px) y
|
|
842
852
|
`--co-option-list-item-font-size` (default 14px). */
|
|
843
853
|
border-radius: var(--co-option-list-item-radius, var(--co-border-radius-xs, 8px));
|
|
@@ -905,6 +915,15 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
|
|
|
905
915
|
color: var(--co-option-list-icon-tint);
|
|
906
916
|
}
|
|
907
917
|
|
|
918
|
+
/* Glifo del tile: `--co-option-list-icon-tile-glyph-size` (default 14px, el `size` que el .tsx le pasa al co-icon) —
|
|
919
|
+
paletas con tile de 24 que llevan el glifo de 16 del bloque del lienzo. El `!important` es necesario porque co-icon
|
|
920
|
+
fija su ancho/alto INLINE en el estilo de su Host (mismo caso que `--co-select-caret-size` en co-select.css); sin
|
|
921
|
+
setear la variable el glifo mide lo mismo que siempre. */
|
|
922
|
+
.co-option-list__icon-tile co-icon {
|
|
923
|
+
width: var(--co-option-list-icon-tile-glyph-size, 14px) !important;
|
|
924
|
+
height: var(--co-option-list-icon-tile-glyph-size, 14px) !important;
|
|
925
|
+
}
|
|
926
|
+
|
|
908
927
|
.co-option-list__dot {
|
|
909
928
|
flex-shrink: 0;
|
|
910
929
|
width: 10px;
|
|
@@ -1075,6 +1094,13 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
|
|
|
1075
1094
|
color: var(--co-option-list-group-color, var(--co-semantic-text-default, #1f1c1b));
|
|
1076
1095
|
}
|
|
1077
1096
|
|
|
1097
|
+
/* Primer rótulo de la lista: `--co-option-list-group-first-padding-top` (default = el de todos los rótulos) — paletas
|
|
1098
|
+
con aire grande ENTRE secciones que no quieren ese mismo aire bajo su cabecera (filtro/buscador): arriba del primero
|
|
1099
|
+
ya está el padding de la lista. */
|
|
1100
|
+
.co-option-list__group:first-child {
|
|
1101
|
+
padding-top: var(--co-option-list-group-first-padding-top, var(--co-option-list-group-padding-top, var(--co-spacing-sm2, 8px)));
|
|
1102
|
+
}
|
|
1103
|
+
|
|
1078
1104
|
/* ── Clear row ───────────────────────────────────────────── */
|
|
1079
1105
|
.co-option-list__clear-row {
|
|
1080
1106
|
display: flex;
|
|
@@ -446,7 +446,7 @@ export class CoPopover {
|
|
|
446
446
|
"references": {
|
|
447
447
|
"PopoverPlacement": {
|
|
448
448
|
"location": "local",
|
|
449
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
449
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-popover/co-popover.tsx",
|
|
450
450
|
"id": "src/components/co-popover/co-popover.tsx::PopoverPlacement"
|
|
451
451
|
}
|
|
452
452
|
}
|
|
@@ -224,7 +224,7 @@ export class CoRadioGroup {
|
|
|
224
224
|
"references": {
|
|
225
225
|
"RadioOption": {
|
|
226
226
|
"location": "local",
|
|
227
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
227
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-radio-group/co-radio-group.tsx",
|
|
228
228
|
"id": "src/components/co-radio-group/co-radio-group.tsx::RadioOption"
|
|
229
229
|
}
|
|
230
230
|
}
|
|
@@ -1349,7 +1349,7 @@ export class CoRefField {
|
|
|
1349
1349
|
"references": {
|
|
1350
1350
|
"RefFieldOption": {
|
|
1351
1351
|
"location": "local",
|
|
1352
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
1352
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-ref-field/co-ref-field.tsx",
|
|
1353
1353
|
"id": "src/components/co-ref-field/co-ref-field.tsx::RefFieldOption"
|
|
1354
1354
|
}
|
|
1355
1355
|
}
|
|
@@ -1490,7 +1490,7 @@ export class CoRefField {
|
|
|
1490
1490
|
"references": {
|
|
1491
1491
|
"RefFieldOption": {
|
|
1492
1492
|
"location": "local",
|
|
1493
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
1493
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-ref-field/co-ref-field.tsx",
|
|
1494
1494
|
"id": "src/components/co-ref-field/co-ref-field.tsx::RefFieldOption"
|
|
1495
1495
|
}
|
|
1496
1496
|
}
|
|
@@ -1511,7 +1511,7 @@ export class CoRefField {
|
|
|
1511
1511
|
"references": {
|
|
1512
1512
|
"RefFieldOption": {
|
|
1513
1513
|
"location": "local",
|
|
1514
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
1514
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-ref-field/co-ref-field.tsx",
|
|
1515
1515
|
"id": "src/components/co-ref-field/co-ref-field.tsx::RefFieldOption"
|
|
1516
1516
|
}
|
|
1517
1517
|
}
|
|
@@ -1550,7 +1550,7 @@ export class CoRefField {
|
|
|
1550
1550
|
},
|
|
1551
1551
|
"RefFieldOption": {
|
|
1552
1552
|
"location": "local",
|
|
1553
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
1553
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-ref-field/co-ref-field.tsx",
|
|
1554
1554
|
"id": "src/components/co-ref-field/co-ref-field.tsx::RefFieldOption"
|
|
1555
1555
|
}
|
|
1556
1556
|
},
|
|
@@ -160,7 +160,7 @@ export class CoSegmentedBar {
|
|
|
160
160
|
"references": {
|
|
161
161
|
"CoSegment": {
|
|
162
162
|
"location": "local",
|
|
163
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
163
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-segmented-bar/co-segmented-bar.tsx",
|
|
164
164
|
"id": "src/components/co-segmented-bar/co-segmented-bar.tsx::CoSegment"
|
|
165
165
|
}
|
|
166
166
|
}
|
|
@@ -846,7 +846,7 @@ export class CoSelect {
|
|
|
846
846
|
"references": {
|
|
847
847
|
"SelectOption": {
|
|
848
848
|
"location": "local",
|
|
849
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
849
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-select/co-select.tsx",
|
|
850
850
|
"id": "src/components/co-select/co-select.tsx::SelectOption"
|
|
851
851
|
}
|
|
852
852
|
}
|
|
@@ -718,7 +718,7 @@ export class CoSidebarNav {
|
|
|
718
718
|
"references": {
|
|
719
719
|
"NavigateDetail": {
|
|
720
720
|
"location": "local",
|
|
721
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
721
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-sidebar-nav/co-sidebar-nav.tsx",
|
|
722
722
|
"id": "src/components/co-sidebar-nav/co-sidebar-nav.tsx::NavigateDetail"
|
|
723
723
|
}
|
|
724
724
|
}
|
|
@@ -189,7 +189,7 @@ export class CoToast {
|
|
|
189
189
|
"references": {
|
|
190
190
|
"CoToastActionsLayout": {
|
|
191
191
|
"location": "local",
|
|
192
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
192
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-toast/co-toast.tsx",
|
|
193
193
|
"id": "src/components/co-toast/co-toast.tsx::CoToastActionsLayout"
|
|
194
194
|
}
|
|
195
195
|
}
|
|
@@ -215,7 +215,7 @@ export class CoToast {
|
|
|
215
215
|
"references": {
|
|
216
216
|
"CoToastVariant": {
|
|
217
217
|
"location": "local",
|
|
218
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
218
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-toast/co-toast.tsx",
|
|
219
219
|
"id": "src/components/co-toast/co-toast.tsx::CoToastVariant"
|
|
220
220
|
}
|
|
221
221
|
}
|
|
@@ -3,7 +3,23 @@
|
|
|
3
3
|
/**
|
|
4
4
|
* @prop --co-toggle-button-width: Ancho del botón (default auto); útil para pastillas de ancho fijo.
|
|
5
5
|
* @prop --co-toggle-button-radius: Radio del botón (default según la talla); se sobrescribe sobre el elemento.
|
|
6
|
+
* @prop --co-toggle-button-color: Tinta de la pastilla no seleccionada (default: la de cada variante).
|
|
7
|
+
* @prop --co-toggle-button-color-selected: Tinta de la pastilla seleccionada (default: la de cada variante).
|
|
8
|
+
* @prop --co-toggle-button-color-hover: Tinta de la no seleccionada bajo el puntero; solo `track` (default: la de siempre).
|
|
6
9
|
*/
|
|
10
|
+
/* Knobs de TINTA (custom props heredables, sin ::part — mismo mecanismo que
|
|
11
|
+
--co-toggle-pill-* / --co-toggle-track-*): el consumidor las fija en el grupo
|
|
12
|
+
o en un ancestro y llegan a cada pastilla a través del shadow.
|
|
13
|
+
--co-toggle-button-color tinta de la pastilla NO seleccionada
|
|
14
|
+
--co-toggle-button-color-selected tinta de la seleccionada
|
|
15
|
+
--co-toggle-button-color-hover tinta de la no seleccionada bajo el puntero
|
|
16
|
+
(solo `track`, la única variante cuyo
|
|
17
|
+
hover ya cambiaba la tinta)
|
|
18
|
+
Cada regla lleva como fallback EXACTAMENTE el valor que tenía antes, así que
|
|
19
|
+
sin knobs nada cambia. Caso de uso: un `track` xs cuyos segmentos inactivos
|
|
20
|
+
deben leerse apagados (gris secundario) frente al activo (tinta plena) —
|
|
21
|
+
hoy el xs pinta los cuatro con la misma tinta y solo la pill delata el
|
|
22
|
+
estado. Lo fija `co-toggle-button.css.test.ts`. */
|
|
7
23
|
|
|
8
24
|
:host {
|
|
9
25
|
display: inline-flex;
|
|
@@ -33,7 +49,7 @@
|
|
|
33
49
|
background: color-mix(in srgb, var(--co-semantic-surface-secondary) 35%, transparent);
|
|
34
50
|
-webkit-backdrop-filter: var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));
|
|
35
51
|
backdrop-filter: var(--co-glass-filter, blur(var(--co-glass-blur)) saturate(var(--co-glass-saturate)));
|
|
36
|
-
color: var(--co-semantic-text-default);
|
|
52
|
+
color: var(--co-toggle-button-color, var(--co-semantic-text-default));
|
|
37
53
|
font-family: var(--co-font-family-primary);
|
|
38
54
|
font-weight: 500;
|
|
39
55
|
cursor: pointer;
|
|
@@ -43,11 +59,13 @@
|
|
|
43
59
|
line-height: 1;
|
|
44
60
|
}
|
|
45
61
|
|
|
46
|
-
/* Sizes
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
.co-toggle-button--
|
|
50
|
-
.co-toggle-button--
|
|
62
|
+
/* Sizes. Tipografía overridable: `--co-toggle-button-font-size` (heredable, sin ::part) — un segmentado cuyo alto
|
|
63
|
+
fija `--co-toggle-pill-height` y necesita un paso de texto entre dos tamaños (p. ej. pill xs de 24 con rótulo 13).
|
|
64
|
+
Sin la variable cada tamaño conserva su fuente de siempre. */
|
|
65
|
+
.co-toggle-button--l { height: 48px; padding: 0 var(--co-spacing-lg); font-size: var(--co-toggle-button-font-size, var(--co-font-size-16)); }
|
|
66
|
+
.co-toggle-button--m { height: 40px; padding: 0 var(--co-spacing-md); font-size: var(--co-toggle-button-font-size, var(--co-font-size-14)); }
|
|
67
|
+
.co-toggle-button--s { height: 32px; padding: 0 var(--co-spacing-sm2); font-size: var(--co-toggle-button-font-size, var(--co-font-size-14)); }
|
|
68
|
+
.co-toggle-button--xs { height: 24px; padding: 0 var(--co-spacing-sm); font-size: var(--co-toggle-button-font-size, var(--co-font-size-12)); }
|
|
51
69
|
|
|
52
70
|
/* Icon-only */
|
|
53
71
|
.co-toggle-button--icon-only.co-toggle-button--l { width: 48px; padding: 0; }
|
|
@@ -65,7 +83,7 @@
|
|
|
65
83
|
reads as gray, which loses the strong active affordance. */
|
|
66
84
|
.co-toggle-button--selected {
|
|
67
85
|
background: var(--co-color-base-negro, #1f1c1b);
|
|
68
|
-
color: var(--co-color-base-blanco, #fff);
|
|
86
|
+
color: var(--co-toggle-button-color-selected, var(--co-color-base-blanco, #fff));
|
|
69
87
|
border-color: var(--co-color-base-negro, #1f1c1b);
|
|
70
88
|
}
|
|
71
89
|
|
|
@@ -136,7 +154,7 @@
|
|
|
136
154
|
border-radius: var(--co-toggle-pill-radius, 8px);
|
|
137
155
|
border-color: transparent;
|
|
138
156
|
background: transparent;
|
|
139
|
-
color: var(--co-semantic-text-secondary);
|
|
157
|
+
color: var(--co-toggle-button-color, var(--co-semantic-text-secondary));
|
|
140
158
|
box-shadow: none;
|
|
141
159
|
padding: 0 12px;
|
|
142
160
|
-webkit-backdrop-filter: none;
|
|
@@ -150,20 +168,24 @@
|
|
|
150
168
|
|
|
151
169
|
:host([variant='track']) .co-toggle-button:hover:not(:disabled) {
|
|
152
170
|
background: var(--co-semantic-surface-hover);
|
|
153
|
-
color: var(--co-semantic-text-default);
|
|
171
|
+
color: var(--co-toggle-button-color-hover, var(--co-semantic-text-default));
|
|
154
172
|
}
|
|
155
173
|
|
|
156
174
|
/* Pill seleccionada: superficie de página + hairline (la sombra sola no la
|
|
157
175
|
separaba del track). */
|
|
158
176
|
:host([variant='track']) .co-toggle-button--selected {
|
|
159
177
|
background: var(--co-semantic-surface-page);
|
|
160
|
-
color: var(--co-semantic-text-default);
|
|
178
|
+
color: var(--co-toggle-button-color-selected, var(--co-semantic-text-default));
|
|
161
179
|
border-color: var(--co-toggle-pill-border, var(--co-semantic-border-default));
|
|
162
180
|
box-shadow: var(--co-toggle-pill-shadow, var(--co-shadow-sm, 0 1px 2px 0 rgba(26, 26, 26, 0.04)));
|
|
163
181
|
}
|
|
164
182
|
|
|
183
|
+
/* La tinta se repite acá porque la regla de hover de arriba (0,5,0) le gana a
|
|
184
|
+
la de la seleccionada (0,3,0): sin esta línea, el knob de hover pintaría la
|
|
185
|
+
pastilla ACTIVA al pasarle el puntero. Default = el de siempre. */
|
|
165
186
|
:host([variant='track']) .co-toggle-button--selected:hover:not(:disabled) {
|
|
166
187
|
background: var(--co-semantic-surface-page);
|
|
188
|
+
color: var(--co-toggle-button-color-selected, var(--co-semantic-text-default));
|
|
167
189
|
border-color: var(--co-toggle-pill-border, var(--co-semantic-border-default));
|
|
168
190
|
}
|
|
169
191
|
|
|
@@ -184,7 +206,15 @@
|
|
|
184
206
|
}
|
|
185
207
|
|
|
186
208
|
:host([variant='track'][size='xs']) .co-toggle-button:not(.co-toggle-button--selected) {
|
|
187
|
-
color: var(--co-semantic-text-default);
|
|
209
|
+
color: var(--co-toggle-button-color, var(--co-semantic-text-default));
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
/* La regla de arriba (0,5,0) empata con el hover de `track` y va después: sin
|
|
213
|
+
esta, el xs nunca cambiaba de tinta bajo el puntero — invisible mientras
|
|
214
|
+
ambas decían text-default, pero con el knob de reposo en gris el hover se
|
|
215
|
+
quedaba gris. Default = text-default, el de siempre. */
|
|
216
|
+
:host([variant='track'][size='xs']) .co-toggle-button:not(.co-toggle-button--selected):hover:not(:disabled) {
|
|
217
|
+
color: var(--co-toggle-button-color-hover, var(--co-semantic-text-default));
|
|
188
218
|
}
|
|
189
219
|
|
|
190
220
|
:host([variant='track'][size='xs']) .co-toggle-button.co-toggle-button--icon-only {
|
|
@@ -204,7 +234,7 @@
|
|
|
204
234
|
border-radius: var(--co-border-radius-xxs);
|
|
205
235
|
border-color: transparent;
|
|
206
236
|
background: var(--co-semantic-surface-control, #f6f6f6);
|
|
207
|
-
color: var(--co-semantic-text-default);
|
|
237
|
+
color: var(--co-toggle-button-color, var(--co-semantic-text-default));
|
|
208
238
|
font-size: var(--co-font-size-12);
|
|
209
239
|
font-weight: var(--co-font-weight-regular);
|
|
210
240
|
/* El diseño pide el contenido a 8px del borde de la pastilla. El borde de
|
|
@@ -224,7 +254,7 @@
|
|
|
224
254
|
|
|
225
255
|
:host([variant='soft']) .co-toggle-button--selected {
|
|
226
256
|
background: var(--co-color-celeste-100);
|
|
227
|
-
color: var(--co-color-primary-azul);
|
|
257
|
+
color: var(--co-toggle-button-color-selected, var(--co-color-primary-azul));
|
|
228
258
|
border-color: transparent;
|
|
229
259
|
}
|
|
230
260
|
|
|
@@ -214,7 +214,7 @@ export class CoTransferList {
|
|
|
214
214
|
"references": {
|
|
215
215
|
"TransferOption": {
|
|
216
216
|
"location": "local",
|
|
217
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
217
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-transfer-list/co-transfer-list.tsx",
|
|
218
218
|
"id": "src/components/co-transfer-list/co-transfer-list.tsx::TransferOption"
|
|
219
219
|
}
|
|
220
220
|
}
|
|
@@ -243,7 +243,7 @@ export class CoTreeItem {
|
|
|
243
243
|
"references": {
|
|
244
244
|
"TreeItemSelection": {
|
|
245
245
|
"location": "local",
|
|
246
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
246
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-tree-item/co-tree-item.tsx",
|
|
247
247
|
"id": "src/components/co-tree-item/co-tree-item.tsx::TreeItemSelection"
|
|
248
248
|
}
|
|
249
249
|
}
|
|
@@ -269,7 +269,7 @@ export class CoTreeItem {
|
|
|
269
269
|
"references": {
|
|
270
270
|
"TreeItemSize": {
|
|
271
271
|
"location": "local",
|
|
272
|
-
"path": "/Users/agox/worktrees/cobalt-
|
|
272
|
+
"path": "/Users/agox/worktrees/cobalt-number-comma/packages/core/src/components/co-tree-item/co-tree-item.tsx",
|
|
273
273
|
"id": "src/components/co-tree-item/co-tree-item.tsx::TreeItemSize"
|
|
274
274
|
}
|
|
275
275
|
}
|