@prolibu-suite/cobalt-core 0.10.0 → 0.10.1
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 +395 -29
- package/dist/cjs/co-accordion.cjs.entry.js +4 -4
- package/dist/cjs/co-action-bar.cjs.entry.js +1 -1
- package/dist/cjs/co-audio-player.cjs.entry.js +82 -12
- package/dist/cjs/co-avatar.cjs.entry.js +72 -0
- package/dist/cjs/co-button.cjs.entry.js +1 -1
- package/dist/cjs/co-checkbox.cjs.entry.js +3 -3
- package/dist/cjs/co-chip_2.cjs.entry.js +62 -10
- package/dist/cjs/co-color-picker.cjs.entry.js +40 -10
- package/dist/cjs/co-data-table.cjs.entry.js +82 -4
- package/dist/cjs/co-input.cjs.entry.js +6 -2
- package/dist/cjs/co-menu-item.cjs.entry.js +1 -1
- package/dist/cjs/co-modal.cjs.entry.js +7 -3
- package/dist/cjs/co-navbar.cjs.entry.js +2 -2
- package/dist/cjs/co-number-field.cjs.entry.js +3 -3
- package/dist/cjs/co-overlay.cjs.entry.js +1 -1
- package/dist/cjs/co-page-header.cjs.entry.js +1 -1
- package/dist/cjs/co-phone-field.cjs.entry.js +1 -1
- package/dist/cjs/co-progress-bar.cjs.entry.js +2 -2
- package/dist/cjs/co-progress-circle.cjs.entry.js +2 -2
- package/dist/cjs/co-provider-logo_2.cjs.entry.js +1 -1
- package/dist/cjs/co-radio.cjs.entry.js +3 -3
- package/dist/cjs/co-rating.cjs.entry.js +3 -3
- package/dist/cjs/co-ref-field.cjs.entry.js +100 -9
- package/dist/cjs/co-rich-text-editor.cjs.entry.js +3 -3
- package/dist/cjs/co-row.cjs.entry.js +2 -2
- package/dist/cjs/co-select.cjs.entry.js +4 -4
- package/dist/cjs/co-separator.cjs.entry.js +1 -1
- package/dist/cjs/co-sidebar.cjs.entry.js +2 -2
- package/dist/cjs/co-slider.cjs.entry.js +2 -2
- package/dist/cjs/co-switch.cjs.entry.js +3 -3
- package/dist/cjs/co-tab-group.cjs.entry.js +2 -2
- package/dist/cjs/co-tab.cjs.entry.js +2 -2
- package/dist/cjs/co-tags-field.cjs.entry.js +5 -5
- package/dist/cjs/co-textarea.cjs.entry.js +4 -4
- package/dist/cjs/co-time-field.cjs.entry.js +1 -1
- package/dist/cjs/co-toggle-button-group.cjs.entry.js +3 -3
- package/dist/cjs/co-toggle-button.cjs.entry.js +3 -3
- package/dist/cjs/{co-avatar_2.cjs.entry.js → co-tooltip.cjs.entry.js} +2 -70
- package/dist/cjs/co-video.cjs.entry.js +2 -2
- package/dist/cjs/cobalt.cjs.js +1 -1
- package/dist/cjs/index-MDAnKsze.js +12 -8
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cobalt/cobalt.esm.js +1 -1
- package/dist/cobalt/{p-82266f11.entry.js → p-000a15b8.entry.js} +1 -1
- package/dist/cobalt/{p-fe7e8813.entry.js → p-148d4aa6.entry.js} +1 -1
- package/dist/cobalt/p-16f8cee6.entry.js +1 -0
- package/dist/cobalt/p-239c5c5f.entry.js +1 -0
- package/dist/cobalt/{p-4d897896.entry.js → p-28764b8e.entry.js} +1 -1
- package/dist/cobalt/{p-73c6d735.entry.js → p-2a30c143.entry.js} +1 -1
- package/dist/cobalt/{p-85501c6a.entry.js → p-2f0f3bb1.entry.js} +1 -1
- package/dist/cobalt/{p-e01f9b9a.entry.js → p-2fba312b.entry.js} +1 -1
- package/dist/cobalt/p-354d5089.entry.js +1 -0
- package/dist/cobalt/{p-5298c030.entry.js → p-383a998e.entry.js} +1 -1
- package/dist/cobalt/{p-325b91b6.entry.js → p-3c4f7026.entry.js} +1 -1
- package/dist/cobalt/p-416795f5.entry.js +1 -0
- package/dist/cobalt/{p-54c987d7.entry.js → p-5a3e4c81.entry.js} +1 -1
- package/dist/cobalt/p-5adf117c.entry.js +1 -0
- package/dist/cobalt/{p-83a9a05a.entry.js → p-5ca394b1.entry.js} +1 -1
- package/dist/cobalt/{p-1a589c8e.entry.js → p-5e4973a6.entry.js} +1 -1
- package/dist/cobalt/{p-b565104d.entry.js → p-6c82a892.entry.js} +1 -1
- package/dist/cobalt/{p-83ea631d.entry.js → p-789c4b3e.entry.js} +1 -1
- package/dist/cobalt/{p-ea20f048.entry.js → p-7e8e6907.entry.js} +1 -1
- package/dist/cobalt/{p-10b82207.entry.js → p-8471abe2.entry.js} +1 -1
- package/dist/cobalt/p-8f2199ff.entry.js +1 -0
- package/dist/cobalt/p-9246e09c.entry.js +1 -0
- package/dist/cobalt/{p-eb063cc0.entry.js → p-93fe45fd.entry.js} +1 -1
- package/dist/cobalt/{p-ad33c40e.entry.js → p-95cfcb34.entry.js} +1 -1
- package/dist/cobalt/{p-bd683db3.entry.js → p-9cf738ed.entry.js} +1 -1
- package/dist/cobalt/p-a2462d7a.entry.js +1 -0
- package/dist/cobalt/p-a325ea0c.entry.js +1 -0
- package/dist/cobalt/{p-e8a4e6b0.entry.js → p-b5bba7fe.entry.js} +1 -1
- package/dist/cobalt/{p-6bf6bc3e.entry.js → p-b821d9de.entry.js} +1 -1
- package/dist/cobalt/{p-92b092db.entry.js → p-be34e447.entry.js} +1 -1
- package/dist/cobalt/p-c7d7d7f7.entry.js +1 -0
- package/dist/cobalt/{p-aae86f96.entry.js → p-d0b2c418.entry.js} +1 -1
- package/dist/cobalt/{p-50bcc76f.entry.js → p-d3344187.entry.js} +1 -1
- package/dist/cobalt/p-d375014b.entry.js +1 -0
- package/dist/cobalt/p-d9d9e8ae.entry.js +1 -0
- package/dist/cobalt/p-e371ec7a.entry.js +1 -0
- package/dist/cobalt/p-eadfd661.entry.js +1 -0
- package/dist/cobalt/p-ef301976.entry.js +1 -0
- package/dist/cobalt/{p-f68dd124.entry.js → p-fb2d1144.entry.js} +1 -1
- package/dist/collection/components/co-accordion/co-accordion.css +2 -2
- package/dist/collection/components/co-accordion/co-accordion.js +4 -4
- package/dist/collection/components/co-action-bar/co-action-bar.css +9 -2
- package/dist/collection/components/co-audio-player/co-audio-player.js +138 -12
- 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-button/co-button.css +6 -3
- package/dist/collection/components/co-checkbox/co-checkbox.js +22 -3
- package/dist/collection/components/co-checkbox-group/co-checkbox-group.js +1 -1
- package/dist/collection/components/co-color-picker/co-color-picker.js +40 -10
- 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.css +63 -2
- package/dist/collection/components/co-data-table/co-data-table.js +59 -4
- package/dist/collection/components/co-data-table/headerTruncationLogic.js +34 -0
- package/dist/collection/components/co-date-range-picker/co-date-range-picker.js +2 -2
- package/dist/collection/components/co-input/co-input.js +17 -5
- package/dist/collection/components/co-menu-item/co-menu-item.css +9 -0
- package/dist/collection/components/co-modal/co-modal.css +6 -0
- package/dist/collection/components/co-modal/co-modal.js +33 -2
- package/dist/collection/components/co-navbar/co-navbar.js +2 -2
- package/dist/collection/components/co-number-field/co-number-field.js +3 -3
- package/dist/collection/components/co-option-list/co-option-list.js +32 -3
- package/dist/collection/components/co-option-list/optionListLogic.js +31 -8
- package/dist/collection/components/co-overlay/co-overlay.js +1 -1
- package/dist/collection/components/co-page-header/co-page-header.js +1 -1
- package/dist/collection/components/co-phone-field/co-phone-field.js +1 -1
- package/dist/collection/components/co-popover/co-popover.js +1 -1
- package/dist/collection/components/co-progress-bar/co-progress-bar.js +2 -2
- package/dist/collection/components/co-progress-circle/co-progress-circle.js +2 -2
- package/dist/collection/components/co-radio/co-radio.js +3 -3
- package/dist/collection/components/co-radio-group/co-radio-group.js +1 -1
- package/dist/collection/components/co-rating/co-rating.js +3 -3
- package/dist/collection/components/co-ref-field/co-ref-field.css +40 -0
- package/dist/collection/components/co-ref-field/co-ref-field.js +207 -11
- package/dist/collection/components/co-rich-text-editor/co-rich-text-editor.js +3 -3
- package/dist/collection/components/co-row/co-row.js +2 -2
- package/dist/collection/components/co-segmented-bar/co-segmented-bar.js +1 -1
- package/dist/collection/components/co-select/co-select.js +24 -5
- package/dist/collection/components/co-separator/co-separator.js +1 -1
- package/dist/collection/components/co-sidebar/co-sidebar.js +2 -2
- package/dist/collection/components/co-sidebar-nav/co-sidebar-nav.js +1 -1
- package/dist/collection/components/co-skeleton/co-skeleton.js +1 -1
- package/dist/collection/components/co-slider/co-slider.js +2 -2
- package/dist/collection/components/co-switch/co-switch.js +3 -3
- package/dist/collection/components/co-tab/co-tab.js +2 -2
- package/dist/collection/components/co-tab-group/co-tab-group.js +2 -2
- package/dist/collection/components/co-tags-field/co-tags-field.js +5 -5
- package/dist/collection/components/co-textarea/co-textarea.js +4 -4
- package/dist/collection/components/co-time-field/co-time-field.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 +6 -5
- package/dist/collection/components/co-toggle-button/co-toggle-button.js +2 -2
- package/dist/collection/components/co-toggle-button-group/co-toggle-button-group.css +9 -5
- package/dist/collection/components/co-toggle-button-group/co-toggle-button-group.js +2 -2
- package/dist/collection/components/co-tooltip/co-tooltip.js +2 -2
- package/dist/collection/components/co-transfer-list/co-transfer-list.js +1 -1
- package/dist/collection/components/co-video/co-video.js +2 -2
- package/dist/components/co-accordion.js +1 -1
- package/dist/components/co-action-bar.js +1 -1
- package/dist/components/co-audio-player.js +1 -1
- package/dist/components/co-autocomplete.js +1 -1
- package/dist/components/co-avatar-group.js +1 -1
- package/dist/components/co-avatar.js +1 -1
- package/dist/components/co-button.js +1 -1
- package/dist/components/co-calendar-month.js +1 -1
- package/dist/components/co-calendar-timegrid.js +1 -1
- package/dist/components/co-checkbox.js +1 -1
- package/dist/components/co-color-picker.js +1 -1
- package/dist/components/co-column-picker.js +1 -1
- package/dist/components/co-combobox.js +1 -1
- package/dist/components/co-command-search.js +1 -1
- package/dist/components/co-data-table.js +1 -1
- package/dist/components/co-date-picker.js +1 -1
- package/dist/components/co-date-range-picker.js +1 -1
- package/dist/components/co-date-range.js +1 -1
- package/dist/components/co-date-time-picker.js +1 -1
- package/dist/components/co-drawer.js +1 -1
- package/dist/components/co-event-calendar.js +1 -1
- package/dist/components/co-file-field.js +1 -1
- package/dist/components/co-input.js +1 -1
- package/dist/components/co-lightbox.js +1 -1
- package/dist/components/co-list-item.js +1 -1
- package/dist/components/co-menu-item.js +1 -1
- package/dist/components/co-modal.js +1 -1
- package/dist/components/co-navbar.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-overlay.js +1 -1
- package/dist/components/co-page-header.js +1 -1
- package/dist/components/co-phone-field.js +1 -1
- package/dist/components/co-progress-bar.js +1 -1
- package/dist/components/co-progress-circle.js +1 -1
- package/dist/components/co-radio.js +1 -1
- package/dist/components/co-rating.js +1 -1
- package/dist/components/co-ref-field.js +1 -1
- package/dist/components/co-rich-text-editor.js +1 -1
- package/dist/components/co-row.js +1 -1
- package/dist/components/co-select.js +1 -1
- package/dist/components/co-separator.js +1 -1
- package/dist/components/co-sidebar-nav.js +1 -1
- package/dist/components/co-sidebar.js +1 -1
- package/dist/components/co-skeleton.js +1 -1
- package/dist/components/co-slider.js +1 -1
- package/dist/components/co-switch.js +1 -1
- package/dist/components/co-tab-group.js +1 -1
- package/dist/components/co-tab.js +1 -1
- package/dist/components/co-tags-field.js +1 -1
- package/dist/components/co-textarea.js +1 -1
- package/dist/components/co-time-field.js +1 -1
- package/dist/components/co-toggle-button-group.js +1 -1
- package/dist/components/co-toggle-button.js +1 -1
- package/dist/components/co-tooltip.js +1 -1
- package/dist/components/co-video.js +1 -1
- package/dist/components/p-7TncUlLN.js +1 -0
- package/dist/components/{p-BxP8OBw6.js → p-B9xitpGU.js} +1 -1
- package/dist/components/{p-x4grh-eZ.js → p-CBTGN490.js} +1 -1
- package/dist/components/{p-CXPRaTuo.js → p-CLsAo0-A.js} +1 -1
- package/dist/components/{p-B1QFLcY9.js → p-D2ldYZo1.js} +1 -1
- package/dist/components/{p-Bv6U5y3d.js → p-D3mVYO-G.js} +1 -1
- package/dist/components/{p-DkDTmHCg.js → p-DDV_bRcU.js} +1 -1
- package/dist/components/{p-Be_kyNRE.js → p-DSnJWzQw.js} +1 -1
- package/dist/components/{p-BBP5__CY.js → p-DTi2O4O8.js} +1 -1
- package/dist/components/p-De7w9k6_.js +1 -0
- package/dist/components/{p-Cl3AdEQJ.js → p-DoHLTC0n.js} +1 -1
- package/dist/components/{p-CnX3L8aF.js → p-DxtNejr2.js} +1 -1
- package/dist/components/p-wjt4IAGZ.js +1 -0
- package/dist/components/{p-DIo66nBr.js → p-zuhal3IZ.js} +1 -1
- package/dist/esm/co-accordion.entry.js +4 -4
- package/dist/esm/co-action-bar.entry.js +1 -1
- package/dist/esm/co-audio-player.entry.js +82 -12
- package/dist/esm/co-avatar.entry.js +70 -0
- package/dist/esm/co-button.entry.js +1 -1
- package/dist/esm/co-checkbox.entry.js +3 -3
- package/dist/esm/co-chip_2.entry.js +62 -10
- package/dist/esm/co-color-picker.entry.js +40 -10
- package/dist/esm/co-data-table.entry.js +82 -4
- package/dist/esm/co-input.entry.js +6 -2
- package/dist/esm/co-menu-item.entry.js +1 -1
- package/dist/esm/co-modal.entry.js +7 -3
- package/dist/esm/co-navbar.entry.js +2 -2
- package/dist/esm/co-number-field.entry.js +3 -3
- package/dist/esm/co-overlay.entry.js +1 -1
- package/dist/esm/co-page-header.entry.js +1 -1
- package/dist/esm/co-phone-field.entry.js +1 -1
- package/dist/esm/co-progress-bar.entry.js +2 -2
- package/dist/esm/co-progress-circle.entry.js +2 -2
- package/dist/esm/co-provider-logo_2.entry.js +1 -1
- package/dist/esm/co-radio.entry.js +3 -3
- package/dist/esm/co-rating.entry.js +3 -3
- package/dist/esm/co-ref-field.entry.js +100 -9
- package/dist/esm/co-rich-text-editor.entry.js +3 -3
- package/dist/esm/co-row.entry.js +2 -2
- package/dist/esm/co-select.entry.js +4 -4
- package/dist/esm/co-separator.entry.js +1 -1
- package/dist/esm/co-sidebar.entry.js +2 -2
- package/dist/esm/co-slider.entry.js +2 -2
- package/dist/esm/co-switch.entry.js +3 -3
- package/dist/esm/co-tab-group.entry.js +2 -2
- package/dist/esm/co-tab.entry.js +2 -2
- package/dist/esm/co-tags-field.entry.js +5 -5
- package/dist/esm/co-textarea.entry.js +4 -4
- package/dist/esm/co-time-field.entry.js +1 -1
- package/dist/esm/co-toggle-button-group.entry.js +3 -3
- package/dist/esm/co-toggle-button.entry.js +3 -3
- package/dist/esm/{co-avatar_2.entry.js → co-tooltip.entry.js} +3 -70
- package/dist/esm/co-video.entry.js +2 -2
- package/dist/esm/cobalt.js +1 -1
- package/dist/esm/index-DH5lfRNj.js +12 -8
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/co-accordion/co-accordion.d.ts +6 -0
- package/dist/types/components/co-audio-player/co-audio-player.d.ts +25 -0
- package/dist/types/components/co-checkbox/co-checkbox.d.ts +4 -0
- package/dist/types/components/co-color-picker/co-color-picker.d.ts +4 -2
- package/dist/types/components/co-data-table/co-data-table.d.ts +15 -0
- package/dist/types/components/co-data-table/headerTruncationLogic.d.ts +24 -0
- package/dist/types/components/co-input/co-input.d.ts +5 -1
- package/dist/types/components/co-modal/co-modal.d.ts +10 -0
- package/dist/types/components/co-option-list/co-option-list.d.ts +13 -0
- package/dist/types/components/co-option-list/optionListLogic.d.ts +23 -6
- package/dist/types/components/co-ref-field/co-ref-field.d.ts +38 -0
- package/dist/types/components/co-select/co-select.d.ts +6 -0
- package/dist/types/components.d.ts +79 -3
- package/package.json +2 -2
- package/dist/cobalt/p-15d59169.entry.js +0 -1
- package/dist/cobalt/p-1788aab5.entry.js +0 -1
- package/dist/cobalt/p-20a39218.entry.js +0 -1
- package/dist/cobalt/p-3cc3ff93.entry.js +0 -1
- package/dist/cobalt/p-4908f33f.entry.js +0 -1
- package/dist/cobalt/p-63825d7f.entry.js +0 -1
- package/dist/cobalt/p-6f700f0d.entry.js +0 -1
- package/dist/cobalt/p-88195a63.entry.js +0 -1
- package/dist/cobalt/p-8fa5dc4a.entry.js +0 -1
- package/dist/cobalt/p-b1e8d69e.entry.js +0 -1
- package/dist/cobalt/p-b48917c9.entry.js +0 -1
- package/dist/cobalt/p-c32c176a.entry.js +0 -1
- package/dist/cobalt/p-e48f4e45.entry.js +0 -1
- package/dist/cobalt/p-ef5ca521.entry.js +0 -1
- package/dist/components/p-9ceBPSd1.js +0 -1
- package/dist/components/p-B2IsXte7.js +0 -1
- package/dist/components/p-BsTO1uUA.js +0 -1
|
@@ -3,7 +3,7 @@ import { R as RequiredMark } from './requiredMark-BCJUuZvC.js';
|
|
|
3
3
|
import { F as FieldChip } from './fieldChip-uyggU8VV.js';
|
|
4
4
|
import { i as isLightColor } from './color-BRbgGqLw.js';
|
|
5
5
|
|
|
6
|
-
const coRefFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1;position:relative}.co-ref-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-ref-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-ref-field__label{display:inline-flex;align-items:center;color:var(--co-ref-field-label-color, var(--co-semantic-text-secondary));font-family:var(--co-ref-field-label-font-family, var(--co-font-family-primary));font-size:var(--co-ref-field-label-font-size, var(--co-font-size-14));font-weight:var(--co-ref-field-label-font-weight, 400);line-height:1;white-space:nowrap;cursor:default;text-transform:var(--co-ref-field-label-text-transform, none);letter-spacing:var(--co-ref-field-label-letter-spacing, var(--co-font-letter-spacing-body))}.co-ref-field__secondary-label{color:var(--co-semantic-text-muted);font-family:var(--co-font-family-mono);font-size:var(--co-font-size-12);font-weight:400;line-height:1;white-space:nowrap;text-align:right}.co-ref-field__trigger{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-ref-field-trigger-bg, var(--co-semantic-surface-page));border:1px solid var(--co-ref-field-trigger-border-color, var(--co-semantic-border-field));border-radius:var(--co-border-radius-xs);min-height:40px;box-sizing:border-box;cursor:pointer;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field--flat{background:transparent;border-color:transparent}.co-ref-field--s{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--sm{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--lg{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-ref-field--open{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field__trigger:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field--disabled{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-ref-field--error{border-color:var(--co-semantic-status-error)}.co-ref-field--success{border-color:var(--co-semantic-status-success)}.co-ref-field--warning{border-color:var(--co-color-status-review)}.co-ref-field--s .co-ref-field__selected{--co-avatar-size:20px}.co-ref-field--sm .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--md .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--lg .co-ref-field__selected{--co-avatar-size:28px}.co-ref-field__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__label-icon{flex-shrink:0;margin-right:var(--co-spacing-xs);color:var(--co-semantic-text-secondary)}.co-ref-field__value{flex:1;min-width:0;display:flex;align-items:center}.co-ref-field__placeholder{color:var(--co-semantic-text-muted);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__caret{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__trigger-badge{flex-shrink:0;display:grid;place-items:center;width:18px;height:18px;border-radius:var(--co-border-radius-xxs);background:var(--co-ref-field-trigger-badge-bg, rgba(0, 0, 0, 0.22));color:var(--co-semantic-text-default)}.co-ref-field__clear{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__clear:hover{color:var(--co-semantic-text-default)}.co-ref-field__edit{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__edit:hover{color:var(--co-semantic-text-default)}.co-ref-field__selected{display:flex;align-items:center;gap:var(--co-spacing-sm);min-width:0}.co-ref-field__color-dot{width:10px;height:10px;min-width:10px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__avatar{flex-shrink:0}.co-ref-field__selected-label{color:var(--co-semantic-text-default);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__chips-row{flex:1;min-width:0;display:flex;align-items:center;gap:var(--co-spacing-xs)}.co-ref-field__chips{flex:1;min-width:0;display:flex;flex-wrap:nowrap;overflow:hidden;gap:var(--co-spacing-xs);align-items:center}.co-ref-field__chip{display:inline-flex;align-items:center;gap:var(--co-spacing-sm);padding:0 var(--co-spacing-sm2);background:var(--co-color-gray-100);border-radius:var(--co-border-radius-full);line-height:1;max-width:min(160px, 100%);flex-shrink:0}.co-ref-field__chip--avatar{padding-left:var(--co-spacing-xxs)}.co-ref-field__chip--s{min-height:20px;--co-avatar-size:20px;font-size:var(--co-font-size-12)}.co-ref-field__chip--sm{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-12)}.co-ref-field__chip--md{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-14)}.co-ref-field__chip--lg{min-height:28px;--co-avatar-size:28px;font-size:var(--co-font-size-14)}.co-ref-field__chip--clipped{visibility:hidden}.co-ref-field__chip-dot{width:8px;height:8px;min-width:8px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__chip--fill{color:var(--co-color-base-blanco);border-radius:var(--co-spacing-sm)}.co-ref-field__chip--fill-light{color:var(--co-color-base-negro)}.co-ref-field__chip--fill .co-ref-field__chip-label,.co-ref-field__chip--fill .co-ref-field__chip-remove{color:inherit}.co-ref-field__chip--fill .co-ref-field__chip-remove{opacity:0.72}.co-ref-field__chip--fill .co-ref-field__chip-remove:hover{color:inherit;opacity:1}.co-ref-field__chip-label{color:var(--co-semantic-text-default);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.co-ref-field__chip-remove{display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-color-gray-500);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out);flex-shrink:0}.co-ref-field__chip-remove:hover{color:var(--co-semantic-text-default)}.co-ref-field__chip-overflow{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:var(--co-spacing-xs) var(--co-spacing-sm);background:var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-full);font-size:var(--co-font-size-12);font-weight:600;color:var(--co-semantic-text-secondary);line-height:1}.co-ref-field__panel{display:flex;flex-direction:column;border-radius:var(--co-border-radius-sm, 12px);overflow:hidden}.co-ref-field__panel--dark{--co-semantic-surface-page:#0A0A0A;--co-semantic-surface-primary:#0A0A0A;--co-semantic-surface-hover:rgba(255, 255, 255, 0.08);--co-semantic-surface-muted:rgba(255, 255, 255, 0.12);--co-semantic-text-default:#ffffff;--co-semantic-text-secondary:rgba(255, 255, 255, 0.8);--co-semantic-text-muted:rgba(255, 255, 255, 0.5);--co-semantic-border-subtle:rgba(255, 255, 255, 0.12);--co-semantic-border-default:rgba(255, 255, 255, 0.16);background:#0A0A0A;color:#ffffff}.co-ref-field__panel--light{--co-semantic-surface-page:#ffffff;--co-semantic-surface-primary:#ffffff;--co-semantic-surface-hover:var(--co-color-gray-100, #f5f5f5);--co-semantic-surface-muted:var(--co-color-gray-200, #e5e5e5);--co-semantic-text-default:var(--co-color-gray-700, #1F1C1B);--co-semantic-text-secondary:rgba(0, 0, 0, 0.6);--co-semantic-text-muted:rgba(0, 0, 0, 0.45);--co-semantic-border-subtle:var(--co-color-gray-200, #e5e5e5);--co-semantic-border-default:var(--co-color-gray-300, #d4d4d4);background:#ffffff;color:var(--co-color-gray-700, #1F1C1B)}.co-ref-field__footer{display:flex;gap:var(--co-spacing-sm2);border-top:1px solid var(--co-semantic-border-subtle);padding:var(--co-spacing-sm2)}.co-ref-field__footer-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md);border-radius:var(--co-border-radius-xs);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12, 12px);font-weight:500;line-height:1;letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;cursor:pointer;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box;min-height:32px}.co-ref-field__footer-btn:hover{opacity:0.85}.co-ref-field__footer-btn--secondary{background:transparent;color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-default)}.co-ref-field__footer-btn--primary{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none}.co-ref-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs);font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-muted)}.co-ref-field__helper--error{color:var(--co-semantic-status-error)}.co-ref-field__helper--success{color:var(--co-semantic-status-success)}.co-ref-field__helper--warning{color:var(--co-color-status-review)}:host([layout='horizontal']) .co-ref-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-ref-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-ref-field__label{white-space:normal}:host([layout='horizontal']) .co-ref-field>:not(.co-ref-field__labels){grid-column:2;min-width:0}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}`;
|
|
6
|
+
const coRefFieldCss = () => `:host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1;position:relative}.co-ref-field{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-ref-field__labels{display:flex;align-items:center;justify-content:space-between;padding:0 var(--co-spacing-xs);gap:var(--co-spacing-sm2)}.co-ref-field__label{display:inline-flex;align-items:center;color:var(--co-ref-field-label-color, var(--co-semantic-text-secondary));font-family:var(--co-ref-field-label-font-family, var(--co-font-family-primary));font-size:var(--co-ref-field-label-font-size, var(--co-font-size-14));font-weight:var(--co-ref-field-label-font-weight, 400);line-height:1;white-space:nowrap;cursor:default;text-transform:var(--co-ref-field-label-text-transform, none);letter-spacing:var(--co-ref-field-label-letter-spacing, var(--co-font-letter-spacing-body))}.co-ref-field__secondary-label{color:var(--co-semantic-text-muted);font-family:var(--co-font-family-mono);font-size:var(--co-font-size-12);font-weight:400;line-height:1;white-space:nowrap;text-align:right}.co-ref-field__trigger{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-ref-field-trigger-bg, var(--co-semantic-surface-page));border:1px solid var(--co-ref-field-trigger-border-color, var(--co-semantic-border-field));border-radius:var(--co-border-radius-xs);min-height:40px;box-sizing:border-box;cursor:pointer;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field--flat{background:transparent;border-color:transparent}.co-ref-field--s{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--sm{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-ref-field--lg{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-ref-field--open{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field__trigger:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-ref-field--disabled{background:var(--co-semantic-surface-disabled);border-color:transparent;cursor:not-allowed}.co-ref-field--error{border-color:var(--co-semantic-status-error)}.co-ref-field--success{border-color:var(--co-semantic-status-success)}.co-ref-field--warning{border-color:var(--co-color-status-review)}.co-ref-field--s .co-ref-field__selected{--co-avatar-size:20px}.co-ref-field--sm .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--md .co-ref-field__selected{--co-avatar-size:22px}.co-ref-field--lg .co-ref-field__selected{--co-avatar-size:28px}.co-ref-field__icon{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__label-icon{flex-shrink:0;margin-right:var(--co-spacing-xs);color:var(--co-semantic-text-secondary)}.co-ref-field__value{flex:1;min-width:0;display:flex;align-items:center}.co-ref-field__placeholder{color:var(--co-semantic-text-muted);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__inherited-tip{min-width:0;max-width:100%}.co-ref-field__inherited{display:block;color:var(--co-semantic-text-secondary);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__inherited-badge{flex-shrink:0;display:inline-flex;align-items:center;box-sizing:border-box;height:22px;padding:0 var(--co-spacing-sm2);border:1px solid var(--co-ref-field-inherited-badge-border, var(--co-semantic-border-default));border-radius:var(--co-border-radius-full);color:var(--co-ref-field-inherited-badge-color, var(--co-semantic-text-secondary));font-size:var(--co-font-size-12);font-weight:400;line-height:1;white-space:nowrap}.co-ref-field__caret{flex-shrink:0;color:var(--co-semantic-text-muted);display:flex;align-items:center}.co-ref-field__trigger-badge{flex-shrink:0;display:grid;place-items:center;width:18px;height:18px;border-radius:var(--co-border-radius-xxs);background:var(--co-ref-field-trigger-badge-bg, rgba(0, 0, 0, 0.22));color:var(--co-semantic-text-default)}.co-ref-field__clear{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__clear:hover{color:var(--co-semantic-text-default)}.co-ref-field__edit{flex-shrink:0;display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-ref-field__edit:hover{color:var(--co-semantic-text-default)}.co-ref-field__selected{display:flex;align-items:center;gap:var(--co-spacing-sm);min-width:0}.co-ref-field__color-dot{width:10px;height:10px;min-width:10px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__avatar{flex-shrink:0}.co-ref-field__selected-label{color:var(--co-semantic-text-default);font-size:inherit;font-weight:400;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.co-ref-field__chips-row{flex:1;min-width:0;display:flex;align-items:center;gap:var(--co-spacing-xs)}.co-ref-field__chips{flex:1;min-width:0;display:flex;flex-wrap:nowrap;overflow:hidden;gap:var(--co-spacing-xs);align-items:center}.co-ref-field__chip{display:inline-flex;align-items:center;gap:var(--co-spacing-sm);padding:0 var(--co-spacing-sm2);background:var(--co-color-gray-100);border-radius:var(--co-border-radius-full);line-height:1;max-width:min(160px, 100%);flex-shrink:0}.co-ref-field__chip--avatar{padding-left:var(--co-spacing-xxs)}.co-ref-field__chip--s{min-height:20px;--co-avatar-size:20px;font-size:var(--co-font-size-12)}.co-ref-field__chip--sm{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-12)}.co-ref-field__chip--md{min-height:22px;--co-avatar-size:22px;font-size:var(--co-font-size-14)}.co-ref-field__chip--lg{min-height:28px;--co-avatar-size:28px;font-size:var(--co-font-size-14)}.co-ref-field__chip--clipped{visibility:hidden}.co-ref-field__chip-dot{width:8px;height:8px;min-width:8px;border-radius:var(--co-border-radius-full);flex-shrink:0}.co-ref-field__chip--fill{color:var(--co-color-base-blanco);border-radius:var(--co-spacing-sm)}.co-ref-field__chip--fill-light{color:var(--co-color-base-negro)}.co-ref-field__chip--fill .co-ref-field__chip-label,.co-ref-field__chip--fill .co-ref-field__chip-remove{color:inherit}.co-ref-field__chip--fill .co-ref-field__chip-remove{opacity:0.72}.co-ref-field__chip--fill .co-ref-field__chip-remove:hover{color:inherit;opacity:1}.co-ref-field__chip-label{color:var(--co-semantic-text-default);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.co-ref-field__chip-remove{display:flex;align-items:center;padding:0;margin:0;border:none;background:transparent;cursor:pointer;color:var(--co-color-gray-500);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out);flex-shrink:0}.co-ref-field__chip-remove:hover{color:var(--co-semantic-text-default)}.co-ref-field__chip-overflow{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;padding:var(--co-spacing-xs) var(--co-spacing-sm);background:var(--co-color-opacity-negro-8);border-radius:var(--co-border-radius-full);font-size:var(--co-font-size-12);font-weight:600;color:var(--co-semantic-text-secondary);line-height:1}.co-ref-field__panel{display:flex;flex-direction:column;border-radius:var(--co-border-radius-sm, 12px);overflow:hidden}.co-ref-field__panel--dark{--co-semantic-surface-page:#0A0A0A;--co-semantic-surface-primary:#0A0A0A;--co-semantic-surface-hover:rgba(255, 255, 255, 0.08);--co-semantic-surface-muted:rgba(255, 255, 255, 0.12);--co-semantic-text-default:#ffffff;--co-semantic-text-secondary:rgba(255, 255, 255, 0.8);--co-semantic-text-muted:rgba(255, 255, 255, 0.5);--co-semantic-border-subtle:rgba(255, 255, 255, 0.12);--co-semantic-border-default:rgba(255, 255, 255, 0.16);background:#0A0A0A;color:#ffffff}.co-ref-field__panel--light{--co-semantic-surface-page:#ffffff;--co-semantic-surface-primary:#ffffff;--co-semantic-surface-hover:var(--co-color-gray-100, #f5f5f5);--co-semantic-surface-muted:var(--co-color-gray-200, #e5e5e5);--co-semantic-text-default:var(--co-color-gray-700, #1F1C1B);--co-semantic-text-secondary:rgba(0, 0, 0, 0.6);--co-semantic-text-muted:rgba(0, 0, 0, 0.45);--co-semantic-border-subtle:var(--co-color-gray-200, #e5e5e5);--co-semantic-border-default:var(--co-color-gray-300, #d4d4d4);background:#ffffff;color:var(--co-color-gray-700, #1F1C1B)}.co-ref-field__footer{display:flex;gap:var(--co-spacing-sm2);border-top:1px solid var(--co-semantic-border-subtle);padding:var(--co-spacing-sm2)}.co-ref-field__footer-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--co-spacing-sm);padding:var(--co-spacing-sm2) var(--co-spacing-md);border-radius:var(--co-border-radius-xs);font-family:var(--co-font-family-primary);font-size:var(--co-font-size-12, 12px);font-weight:500;line-height:1;letter-spacing:var(--co-font-letter-spacing-body);white-space:nowrap;cursor:pointer;transition:opacity var(--co-motion-duration-fast) var(--co-motion-ease-out);box-sizing:border-box;min-height:32px}.co-ref-field__footer-btn:hover{opacity:0.85}.co-ref-field__footer-btn--secondary{background:transparent;color:var(--co-semantic-text-default);border:1px solid var(--co-semantic-border-default)}.co-ref-field__footer-btn--primary{background:var(--co-semantic-surface-primary);color:var(--co-semantic-on-primary);border:none}.co-ref-field__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);padding:0 var(--co-spacing-xs);font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-muted)}.co-ref-field__helper--error{color:var(--co-semantic-status-error)}.co-ref-field__helper--success{color:var(--co-semantic-status-success)}.co-ref-field__helper--warning{color:var(--co-color-status-review)}:host([layout='horizontal']) .co-ref-field{display:grid;grid-template-columns:var(--co-field-label-width, max-content) 1fr;align-items:start;column-gap:var(--co-spacing-md);row-gap:var(--co-spacing-sm2)}:host([layout='horizontal']) .co-ref-field__labels{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-ref-field__label{white-space:normal}:host([layout='horizontal']) .co-ref-field>:not(.co-ref-field__labels){grid-column:2;min-width:0}.co-field-required{margin-left:2px;color:var(--co-color-status-error)}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}`;
|
|
7
7
|
|
|
8
8
|
const CoRefField = class {
|
|
9
9
|
constructor(hostRef) {
|
|
@@ -95,6 +95,15 @@ const CoRefField = class {
|
|
|
95
95
|
this.triggerBadgeIcon = '';
|
|
96
96
|
/** Accessible name / tooltip for the trigger badge. */
|
|
97
97
|
this.triggerBadgeLabel = '';
|
|
98
|
+
/**
|
|
99
|
+
* Valor HEREDADO: texto que se pinta cuando NO hay valor, en lugar del
|
|
100
|
+
* placeholder, para mostrar lo que aplica por defecto (p. ej. el layout
|
|
101
|
+
* predeterminado del workspace en Deal.proposal.template.layout). No es un
|
|
102
|
+
* valor: `value` sigue vacío y no hay ×. Vacío = placeholder de siempre.
|
|
103
|
+
*/
|
|
104
|
+
this.inheritedLabel = '';
|
|
105
|
+
/** Chip outlined junto al valor heredado (p. ej. 'Predeterminado'). Solo con inheritedLabel. */
|
|
106
|
+
this.inheritedBadgeLabel = '';
|
|
98
107
|
/**
|
|
99
108
|
* Shape of the leading avatar (selected value + option rows). Defaults to
|
|
100
109
|
* 'circle' (people refs); use 'square' for company/workspace refs — it renders
|
|
@@ -105,11 +114,21 @@ const CoRefField = class {
|
|
|
105
114
|
this.pinnable = false;
|
|
106
115
|
/** Drag-reorder de la lista del panel (forward a co-option-list). */
|
|
107
116
|
this.listReorderable = false;
|
|
117
|
+
/** Tooltip del valor heredado: co-tooltip lee `disabled` en el mouseenter
|
|
118
|
+
* (scheduleShow), así que el truncado se mide ANTES del hover — al montar /
|
|
119
|
+
* redimensionar el span (RO propio: el de los chips hace disconnect() por
|
|
120
|
+
* render) y al cambiar el texto — nunca en el hover mismo. */
|
|
121
|
+
this.inheritedTruncated = false;
|
|
108
122
|
this.isOpen = false;
|
|
109
123
|
/** How many trailing chips don't fit the trigger width (responsive mode). */
|
|
110
124
|
this.overflowCount = 0;
|
|
111
125
|
this.lastChipsKey = '\x00';
|
|
112
126
|
this.pendingFocus = false;
|
|
127
|
+
/** El host proyecta su PROPIO panel (`<div slot="panel">`: galería, grid…)
|
|
128
|
+
* en lugar de la co-option-list. Se detecta al ABRIR — los hijos light-DOM
|
|
129
|
+
* ya existen y el panel se monta on-demand — y el host cierra/selecciona
|
|
130
|
+
* vía los métodos `selectOption`/`closePanel`. El footer se conserva. */
|
|
131
|
+
this.hasPanelSlot = false;
|
|
113
132
|
// ── Popover event handlers ─────────────────────────────────
|
|
114
133
|
this.handlePopoverOpen = () => {
|
|
115
134
|
this.isOpen = true;
|
|
@@ -117,6 +136,28 @@ const CoRefField = class {
|
|
|
117
136
|
this.handlePopoverClose = () => {
|
|
118
137
|
this.isOpen = false;
|
|
119
138
|
};
|
|
139
|
+
this.measureInherited = () => {
|
|
140
|
+
const el = this.inheritedEl;
|
|
141
|
+
const truncated = el ? el.scrollWidth > el.clientWidth + 1 : false;
|
|
142
|
+
if (truncated !== this.inheritedTruncated)
|
|
143
|
+
this.inheritedTruncated = truncated;
|
|
144
|
+
};
|
|
145
|
+
// Stencil llama el ref con null al desmontar (nullifyVNodeRefs): observar /
|
|
146
|
+
// des-observar en el mismo lugar. observe() dispara una notificación inicial
|
|
147
|
+
// → primera medición sin hover previo.
|
|
148
|
+
this.setInheritedEl = (el) => {
|
|
149
|
+
var _a, _b;
|
|
150
|
+
const next = el || undefined;
|
|
151
|
+
if (next === this.inheritedEl)
|
|
152
|
+
return;
|
|
153
|
+
if (this.inheritedEl)
|
|
154
|
+
(_a = this.inheritedResizeObserver) === null || _a === void 0 ? void 0 : _a.unobserve(this.inheritedEl);
|
|
155
|
+
this.inheritedEl = next;
|
|
156
|
+
if (next)
|
|
157
|
+
(_b = this.inheritedResizeObserver) === null || _b === void 0 ? void 0 : _b.observe(next);
|
|
158
|
+
else if (this.inheritedTruncated)
|
|
159
|
+
this.inheritedTruncated = false;
|
|
160
|
+
};
|
|
120
161
|
this.handleTriggerClick = (e) => {
|
|
121
162
|
if (this.disabled)
|
|
122
163
|
e.stopPropagation();
|
|
@@ -275,6 +316,11 @@ const CoRefField = class {
|
|
|
275
316
|
// Responsive chips: refit on any trigger width change (same pattern as
|
|
276
317
|
// co-combobox).
|
|
277
318
|
this.resizeObserver = new ResizeObserver(() => this.calcOverflow());
|
|
319
|
+
this.inheritedResizeObserver = new ResizeObserver(() => this.measureInherited());
|
|
320
|
+
// Reconexión del host: el observer es nuevo pero el span ya está montado y
|
|
321
|
+
// el ref no vuelve a llamarse (mismo elemento) → re-observar acá.
|
|
322
|
+
if (this.inheritedEl)
|
|
323
|
+
this.inheritedResizeObserver.observe(this.inheritedEl);
|
|
278
324
|
}
|
|
279
325
|
componentDidRender() {
|
|
280
326
|
var _a, _b, _c, _d;
|
|
@@ -303,8 +349,9 @@ const CoRefField = class {
|
|
|
303
349
|
}
|
|
304
350
|
}
|
|
305
351
|
disconnectedCallback() {
|
|
306
|
-
var _a;
|
|
352
|
+
var _a, _b;
|
|
307
353
|
(_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
|
|
354
|
+
(_b = this.inheritedResizeObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
|
|
308
355
|
}
|
|
309
356
|
/**
|
|
310
357
|
* Counts how many trailing chips overflow the single-line chips wrapper
|
|
@@ -340,6 +387,7 @@ const CoRefField = class {
|
|
|
340
387
|
// ── Watchers ───────────────────────────────────────────────
|
|
341
388
|
onOpenChange(isOpen) {
|
|
342
389
|
if (isOpen) {
|
|
390
|
+
this.hasPanelSlot = !!this.el.querySelector(':scope > [slot="panel"]');
|
|
343
391
|
this.coOpen.emit();
|
|
344
392
|
// The panel is mounted on-demand: co-option-list takes its selected-first
|
|
345
393
|
// snapshot in componentWillLoad on every open; we only need to focus the
|
|
@@ -354,6 +402,12 @@ const CoRefField = class {
|
|
|
354
402
|
this.restoreTriggerFocus();
|
|
355
403
|
}
|
|
356
404
|
}
|
|
405
|
+
// ── Valor heredado: medición del truncado (drives co-tooltip `disabled`) ──
|
|
406
|
+
onInheritedLabelChange() {
|
|
407
|
+
// El span no cambia de caja al cambiar el texto (overflow:hidden) → el RO
|
|
408
|
+
// no dispara: medir tras el render.
|
|
409
|
+
requestAnimationFrame(this.measureInherited);
|
|
410
|
+
}
|
|
357
411
|
/** Devuelve el foco al trigger al cerrar el panel (Escape, selección),
|
|
358
412
|
* salvo que el cierre venga de un click-outside que ya movió el foco a
|
|
359
413
|
* otro elemento — en ese caso no robarlo. */
|
|
@@ -364,6 +418,25 @@ const CoRefField = class {
|
|
|
364
418
|
(_a = this.triggerEl) === null || _a === void 0 ? void 0 : _a.focus();
|
|
365
419
|
}
|
|
366
420
|
}
|
|
421
|
+
/** Selección desde un panel proyectado (slot `panel`): mismo contrato que un
|
|
422
|
+
* click en la co-option-list — actualiza `value`, emite `coChange` con
|
|
423
|
+
* `{ value, item }` y cierra en single. */
|
|
424
|
+
async selectOption(option) {
|
|
425
|
+
this.handleOptionClick(option);
|
|
426
|
+
}
|
|
427
|
+
/** Cierra el panel (Escape/Enter manejados por un panel proyectado). */
|
|
428
|
+
async closePanel() {
|
|
429
|
+
this.isOpen = false;
|
|
430
|
+
}
|
|
431
|
+
/** Abre el panel. Espejo de `closePanel` para un panel proyectado que se
|
|
432
|
+
* cierra a sí mismo (p.ej. para mostrar un modal — un click dentro de un
|
|
433
|
+
* co-modal cuenta como click-outside del popover) y quiere volver a abrirse
|
|
434
|
+
* después. No-op si está disabled, igual que el trigger. */
|
|
435
|
+
async openPanel() {
|
|
436
|
+
if (this.disabled)
|
|
437
|
+
return;
|
|
438
|
+
this.isOpen = true;
|
|
439
|
+
}
|
|
367
440
|
// ── Render helpers ─────────────────────────────────────────
|
|
368
441
|
renderTrigger() {
|
|
369
442
|
const selected = this.effectiveDisplayItems;
|
|
@@ -375,7 +448,7 @@ const CoRefField = class {
|
|
|
375
448
|
[`co-ref-field--${this.normalizedSize}`]: true,
|
|
376
449
|
[`co-ref-field--${this.status}`]: this.status !== 'default',
|
|
377
450
|
'co-ref-field--flat': this.variant === 'flat',
|
|
378
|
-
}, role: "combobox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-label": this.label || undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-controls": this.isOpen ? CoRefField.LIST_ID : undefined, tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.triggerEl = el), onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, this.iconLeft && (h("span", { class: "co-ref-field__icon" }, h("co-icon", { name: this.iconLeft, size: 16 }))), h("div", { class: "co-ref-field__value" }, !hasValue && h("span", { class: "co-ref-field__placeholder", part: "trigger-placeholder" }, this.placeholder), hasValue && !this.multiple && this.renderSingleValue(selected[0]), hasValue && this.multiple && this.renderMultipleValue(selected)), hasValue && this.triggerBadgeIcon && (h("span", { class: "co-ref-field__trigger-badge", part: "trigger-badge", role: "img", title: this.triggerBadgeLabel || undefined, "aria-label": this.triggerBadgeLabel || undefined }, h("co-icon", { name: this.triggerBadgeIcon, size: 11, weight: "fill" }))), hasValue && !this.multiple && this.editable && !this.disabled && (h("button", { class: "co-ref-field__edit", part: "trigger-edit", tabIndex: -1, onClick: this.handleEditClick, type: "button", title: this.editLabel || undefined, "aria-label": this.editLabel || undefined }, h("co-icon", { name: "pencil-simple", size: 14 }))), hasValue && this.clearable && !this.disabled && (h("button", { class: "co-ref-field__clear", part: "trigger-clear", tabIndex: -1, onClick: this.handleClear, type: "button" }, h("co-icon", { name: "x", size: 14 }))), h("span", { class: "co-ref-field__caret", part: "trigger-chevron" }, h("co-icon", { name: "caret-up-down", size: 16 }))));
|
|
451
|
+
}, role: "combobox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-label": this.label || undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-controls": this.isOpen ? CoRefField.LIST_ID : undefined, tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.triggerEl = el), onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, this.iconLeft && (h("span", { class: "co-ref-field__icon" }, h("co-icon", { name: this.iconLeft, size: 16 }))), h("div", { class: "co-ref-field__value" }, !hasValue && this.inheritedLabel && (h("co-tooltip", { block: true, class: "co-ref-field__inherited-tip", content: this.inheritedLabel, placement: "top", disabled: !this.inheritedTruncated }, h("span", { class: "co-ref-field__inherited", part: "trigger-inherited", ref: this.setInheritedEl }, this.inheritedLabel))), !hasValue && !this.inheritedLabel && (h("span", { class: "co-ref-field__placeholder", part: "trigger-placeholder" }, this.placeholder)), hasValue && !this.multiple && this.renderSingleValue(selected[0]), hasValue && this.multiple && this.renderMultipleValue(selected)), !hasValue && this.inheritedLabel && this.inheritedBadgeLabel && (h("span", { class: "co-ref-field__inherited-badge", part: "trigger-inherited-badge" }, this.inheritedBadgeLabel)), hasValue && this.triggerBadgeIcon && (h("span", { class: "co-ref-field__trigger-badge", part: "trigger-badge", role: "img", title: this.triggerBadgeLabel || undefined, "aria-label": this.triggerBadgeLabel || undefined }, h("co-icon", { name: this.triggerBadgeIcon, size: 11, weight: "fill" }))), hasValue && !this.multiple && this.editable && !this.disabled && (h("button", { class: "co-ref-field__edit", part: "trigger-edit", tabIndex: -1, onClick: this.handleEditClick, type: "button", title: this.editLabel || undefined, "aria-label": this.editLabel || undefined }, h("co-icon", { name: "pencil-simple", size: 14 }))), hasValue && this.clearable && !this.disabled && (h("button", { class: "co-ref-field__clear", part: "trigger-clear", tabIndex: -1, onClick: this.handleClear, type: "button" }, h("co-icon", { name: "x", size: 14 }))), h("span", { class: "co-ref-field__caret", part: "trigger-chevron" }, h("co-icon", { name: "caret-up-down", size: 16 }))));
|
|
379
452
|
}
|
|
380
453
|
/**
|
|
381
454
|
* Leading visual for a selected value / chip. Prefers a real avatar (image
|
|
@@ -424,21 +497,39 @@ const CoRefField = class {
|
|
|
424
497
|
}, style: fill ? { backgroundColor: item.color } : undefined, onRemove: (e) => this.handleRemoveChip(item._id, e) }, item.image || item.avatar ? (this.renderItemAvatar(item)) : item.color && !fill ? (h("span", { class: "co-ref-field__chip-dot", style: { backgroundColor: item.color } })) : null));
|
|
425
498
|
})), overflow > 0 && h("span", { class: "co-ref-field__chip-overflow" }, "+", overflow)));
|
|
426
499
|
}
|
|
500
|
+
/** Botones del footer. `slotted`: dentro de la co-option-list van por su
|
|
501
|
+
* slot `footer`; en el panel proyectado se pintan directo bajo el slot. */
|
|
502
|
+
renderFooter(slotted) {
|
|
503
|
+
if (!this.showFooter)
|
|
504
|
+
return null;
|
|
505
|
+
return (h("div", { class: "co-ref-field__footer", slot: slotted ? 'footer' : undefined }, this.footerSecondaryLabel && (h("button", { class: "co-ref-field__footer-btn co-ref-field__footer-btn--secondary", type: "button", onClick: this.handleFooterSecondary }, h("co-icon", { name: "plus", size: 16 }), h("span", null, this.footerSecondaryLabel))), h("button", { class: "co-ref-field__footer-btn co-ref-field__footer-btn--primary", type: "button", onClick: this.handleFooterPrimary }, h("co-icon", { name: "check", size: 16 }), h("span", null, this.footerPrimaryLabel))));
|
|
506
|
+
}
|
|
427
507
|
renderPanel() {
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
508
|
+
const panelClass = {
|
|
509
|
+
'co-ref-field__panel': true,
|
|
510
|
+
'co-ref-field__panel--dark': this.panelTheme === 'dark',
|
|
511
|
+
'co-ref-field__panel--light': this.panelTheme === 'light',
|
|
512
|
+
};
|
|
513
|
+
const panelStyle = this.panelWidth ? { width: this.panelWidth } : undefined;
|
|
514
|
+
if (this.hasPanelSlot) {
|
|
515
|
+
// Panel del host: la búsqueda, las opciones y su a11y son suyas; acá
|
|
516
|
+
// quedan el chrome del panel (radius/tema/ancho), el id que el trigger
|
|
517
|
+
// referencia por aria-controls y el footer compartido.
|
|
518
|
+
return (h("div", { class: Object.assign(Object.assign({}, panelClass), { 'co-ref-field__panel--custom': true }), id: CoRefField.LIST_ID, style: panelStyle }, h("slot", { name: "panel" }), this.renderFooter(false)));
|
|
519
|
+
}
|
|
520
|
+
return (h("div", { class: panelClass, style: panelStyle }, h("co-option-list", { id: CoRefField.LIST_ID, ref: (el) => (this.optionListEl = el), items: typeof this.options === 'string' ? this.options : JSON.stringify(this.options), value: this.value, selectedItems: typeof this.selectedDisplay === 'string' ? this.selectedDisplay : JSON.stringify(this.selectedDisplay), multiple: this.multiple, selectedFirst: this.multiple, reorderable: this.multiple, pinnable: this.pinnable, listReorderable: this.listReorderable, selectedAffordance: "deselect", searchable: this.searchable, searchPlaceholder: this.searchPlaceholder, searchDebounce: this.searchDebounce, loading: this.loading, total: this.total, emptyMessage: this.emptyMessage, avatarShape: this.avatarShape, onCoSearch: (e) => this.coSearch.emit(e.detail), onCoChange: (e) => this.handleListChange(e.detail), onCoReorder: (e) => this.handleReorder(e.detail), onCoPinToggle: (e) => this.coPinToggle.emit(e.detail), onCoListReorder: (e) => this.coListReorder.emit(e.detail), onCoLoadMore: () => this.coLoadMore.emit() }, h("slot", { name: "panel-footer", slot: "footer" }), this.renderFooter(true))));
|
|
433
521
|
}
|
|
434
522
|
// ── Main render ────────────────────────────────────────────
|
|
435
523
|
render() {
|
|
436
|
-
return (h("div", { key: '
|
|
524
|
+
return (h("div", { key: 'fa7de667cc9002d1a4a042b0d200524cbcb89b78', class: "co-ref-field" }, (this.label || this.secondaryLabel) && (h("div", { key: 'a6ddd5b71364e4f5bdf63b04faa09bfc0a32f6bc', class: "co-ref-field__labels" }, this.label && (h("label", { key: '766f803c8be77f72e52e4d3cdd7b6d7a363a146a', class: "co-ref-field__label" }, this.labelIcon && (h("co-icon", { key: 'a8b6c7f189af4b9f37de8c3cc96cb489fd9183e4', class: "co-ref-field__label-icon", name: this.labelIcon, size: 16 })), this.label, h(RequiredMark, { key: '643edcb040ef9a91040e8d52f628bc0af06c36ba', required: this.required }))), this.secondaryLabel && (h("span", { key: '7a107c578e003760423acc6d450f2a42a0868375', class: "co-ref-field__secondary-label" }, this.secondaryLabel)))), h("co-popover", { key: '9938ca629c5927156ea137adfefd1d927104312b', open: this.isOpen, placement: "bottom-start", matchWidth: !this.panelWidth, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: '7618ea5fb13e4944596fd728cf934b5c28bd29ab', slot: "trigger" }, this.renderTrigger()), this.isOpen && this.renderPanel()), this.helperText && (h("div", { key: '1dd9fc7659e8f8791bb4b785407b0e89b32107c8', class: `co-ref-field__helper co-ref-field__helper--${this.status}` }, this.status !== 'default' && (h("co-icon", { key: '399674b95ebcc91581f1f1cea54451f8ee33d9da', name: this.status === 'error' ? 'warning-circle' : this.status === 'success' ? 'check-circle' : 'info', size: 14 })), h("span", { key: '640adc4e5cd4cd742a171cac1319b75489cb7ef8' }, this.helperText)))));
|
|
437
525
|
}
|
|
438
526
|
get el() { return getElement(this); }
|
|
439
527
|
static get watchers() { return {
|
|
440
528
|
"isOpen": [{
|
|
441
529
|
"onOpenChange": 0
|
|
530
|
+
}],
|
|
531
|
+
"inheritedLabel": [{
|
|
532
|
+
"onInheritedLabelChange": 0
|
|
442
533
|
}]
|
|
443
534
|
}; }
|
|
444
535
|
};
|
|
@@ -2031,7 +2031,7 @@ const CoRichTextEditor = class {
|
|
|
2031
2031
|
render() {
|
|
2032
2032
|
const showToolbar = this.resolvedToolbar !== 'none' && !this.readonly && !this.disabled;
|
|
2033
2033
|
const showCount = this.showCharacterCount || this.maxLength != null;
|
|
2034
|
-
return (h("div", { key: '
|
|
2034
|
+
return (h("div", { key: '3acc844eb53d8b3568d9f72e053363b674e9ba87', class: {
|
|
2035
2035
|
'co-rich-text-editor': true,
|
|
2036
2036
|
'co-rich-text-editor--focused': this.hasFocus,
|
|
2037
2037
|
'co-rich-text-editor--disabled': this.disabled,
|
|
@@ -2039,10 +2039,10 @@ const CoRichTextEditor = class {
|
|
|
2039
2039
|
'co-rich-text-editor--loading': !this.ready,
|
|
2040
2040
|
[`co-rich-text-editor--${this.status}`]: this.status !== 'default',
|
|
2041
2041
|
'co-rich-text-editor--flat': this.variant === 'flat',
|
|
2042
|
-
}, part: "wrapper" }, (this.label || this.secondaryLabel) && (h("div", { key: '
|
|
2042
|
+
}, part: "wrapper" }, (this.label || this.secondaryLabel) && (h("div", { key: '53b6f47e19e422ab1c7b3e2d452f320495199c33', class: "co-rich-text-editor__labels" }, this.label && h("label", { key: 'c4c7eb0f49cbffc40cbd6cfd2a28848201623be9', class: "co-rich-text-editor__label", part: "label" }, this.label), this.secondaryLabel && (h("span", { key: '13663ac237f80b637ebf8df841ba52c4aa73a0f4', class: "co-rich-text-editor__secondary-label" }, this.secondaryLabel)))), h("div", { key: 'deb51dfabddb6ca08dc849f17f7850d635bee9e0', class: "co-rich-text-editor__frame" }, showToolbar && (h("co-rich-text-toolbar", { key: 'f62c2cf76ce791f0648bde14c30300c40417a22b', class: "co-rich-text-editor__toolbar", part: "toolbar", variant: this.resolvedToolbar, disabled: this.disabled || this.readonly, locale: this.locale, attachmentsEnabled: this.attachmentsEnabled, attachmentAccept: this.attachmentAccept, onCoAttachmentsSelected: (e) => {
|
|
2043
2043
|
e.stopPropagation();
|
|
2044
2044
|
this.coAttachmentsSelected.emit(e.detail);
|
|
2045
|
-
}, ref: (el) => (this.toolbarEl = el) })), h("div", { key: '
|
|
2045
|
+
}, ref: (el) => (this.toolbarEl = el) })), h("div", { key: 'af3c512a9ec4ed3dc62d83b8acbd13132c84f349', class: "co-rich-text-editor__box" }, h("div", { key: '3cacb60bf24487d631ec3e7153313b3ed940ea8e', class: "co-rte-content", part: "content", role: "textbox", "aria-multiline": "true", "aria-label": this.label, "aria-required": this.required ? 'true' : undefined, "aria-invalid": this.status === 'error' ? 'true' : undefined, ref: (el) => (this.contentEl = el) }))), h("div", { key: 'ac6511ee617587f29a55adeb5ef9840be559adcd', class: "co-rich-text-editor__footer" }, this.helperText && (h("div", { key: '8ae2c198a948e553d22111bad15d5119c7ee090f', class: `co-rich-text-editor__helper co-rich-text-editor__helper--${this.status}`, part: "helper" }, h("co-icon", { key: 'a764d0daeeaeee64fae43c2358cdad9ecfe89b13', name: this.helperIcon, size: 14 }), h("span", { key: 'c1efcf1a97de016fa78a408306696cc0f4b29f29' }, this.helperText))), showCount && (h("span", { key: 'c68f01b407e6b2aa17582b58244b147825729138', class: "co-rich-text-editor__count", ref: (el) => (this.charCountEl = el) }, this.charCount, this.maxLength != null ? ` / ${this.maxLength}` : '')))));
|
|
2046
2046
|
}
|
|
2047
2047
|
get el() { return getElement(this); }
|
|
2048
2048
|
static get watchers() { return {
|
package/dist/esm/co-row.entry.js
CHANGED
|
@@ -11,11 +11,11 @@ const CoRow = class {
|
|
|
11
11
|
this.size = 'sm';
|
|
12
12
|
}
|
|
13
13
|
render() {
|
|
14
|
-
return (h("div", { key: '
|
|
14
|
+
return (h("div", { key: 'df05ce9c0da83cd61ce3a42e4a578ea4d038e12c', class: {
|
|
15
15
|
'co-row': true,
|
|
16
16
|
[`co-row--${this.position}`]: true,
|
|
17
17
|
[`co-row--${this.size}`]: true,
|
|
18
|
-
}, part: "row" }, h("div", { key: '
|
|
18
|
+
}, part: "row" }, h("div", { key: 'fcd7514bd6071f16f8b92ace2651bf33b74a402e', class: "co-row__prefix" }, h("slot", { key: '47254fffd8803454f9d8f0cccfb6e80bb7058b38', name: "prefix" })), h("div", { key: '43aaab6683919b7e9e47c0a67203edffa3db81df', class: "co-row__content" }, h("slot", { key: '4fb7a8ea03f79313176ca8c5ae23f878eace9027' })), h("div", { key: '3c7bcd64ccf417e95620cec6ae87d7d9d1697bed', class: "co-row__suffix" }, h("slot", { key: 'af2e72debbcc68919ef3e28d03ff18cf747ccc43', name: "suffix" }))));
|
|
19
19
|
}
|
|
20
20
|
};
|
|
21
21
|
CoRow.style = coRowCss();
|
|
@@ -475,20 +475,20 @@ const CoSelect = class {
|
|
|
475
475
|
const activeOptionId = this.isOpen && this.activeIndex >= 0 && this.activeIndex < options.length
|
|
476
476
|
? this.optionId(this.activeIndex)
|
|
477
477
|
: undefined;
|
|
478
|
-
return (h("div", { key: '
|
|
478
|
+
return (h("div", { key: 'd59a2a542e3a53efbff607faa01eb8eef899e8a1', class: {
|
|
479
479
|
'co-select': true,
|
|
480
480
|
'co-select--open': this.isOpen,
|
|
481
481
|
'co-select--disabled': this.disabled,
|
|
482
482
|
[`co-select--${this.size}`]: true,
|
|
483
483
|
[`co-select--${this.status}`]: this.status !== 'default',
|
|
484
484
|
'co-select--flat': this.variant === 'flat',
|
|
485
|
-
} }, (this.label || this.secondaryLabel) && (h("div", { key: '
|
|
485
|
+
} }, (this.label || this.secondaryLabel) && (h("div", { key: 'd386f9b3ffcf323736615fe9abb2f2b5b059ef5d', class: "co-select__labels" }, this.label && h("label", { key: '4eb476e1413845a01da90e9d2d1a5d8c77f2dd27', class: "co-select__label" }, this.label, h(RequiredMark, { key: '448008d31b3870ba542003981fde4e59025c119f', required: this.required })), this.secondaryLabel && h("span", { key: 'da8d3dbe5290ed411cafe35ca8d11c9f3a13cf05', class: "co-select__secondary-label" }, this.secondaryLabel))), h("co-popover", { key: 'f83933aad455b009c909d067775a4458d9cf2b93', open: this.isOpen, placement: "bottom-start", matchWidth: true, offset: 4, onCoOpen: this.handlePopoverOpen, onCoClose: this.handlePopoverClose }, h("div", { key: 'cc19e9fa6bb7448f39426fff39a4f000b957cc49', slot: "trigger", class: "co-select__trigger", role: "combobox", "aria-expanded": this.isOpen ? 'true' : 'false', "aria-haspopup": "listbox", "aria-label": this.label || this.ariaLabelText || undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-controls": CoSelect.LISTBOX_ID, "aria-activedescendant": activeOptionId, tabIndex: this.disabled ? -1 : 0, ref: (el) => (this.triggerEl = el), onClick: this.handleTriggerClick, onKeyDown: this.handleTriggerKeyDown }, this.iconLeft && h("co-icon", { key: '34b24e244f80e3229d6a9b27af293995fdaf1499', name: this.iconLeft, size: 16, class: "co-select__icon" }), ((_a = this.selectedOption) === null || _a === void 0 ? void 0 : _a.image) && (h("img", { key: '29d4e4aca6b8baeb14da68f7d848e7d92cf2300e', class: "co-select__flag", src: this.selectedOption.image, alt: "" })), this.multiple && this.hasValue ? (h("div", { class: "co-select__chips" }, this.selectedValues.map((v) => {
|
|
486
486
|
const opt = this.parsedOptions.find((o) => o.value === v);
|
|
487
487
|
return (h("span", { class: "co-select__chip", key: v }, h("span", { class: "co-select__chip-label" }, opt ? opt.label : v), h("button", { class: "co-select__chip-remove", type: "button", tabIndex: -1, "aria-label": "Remove", onClick: (e) => {
|
|
488
488
|
e.stopPropagation();
|
|
489
489
|
this.handleOptionClick(v);
|
|
490
490
|
} }, h("co-icon", { name: "x", size: 12 }))));
|
|
491
|
-
}))) : (h("span", { class: { 'co-select__text': true, 'co-select__text--placeholder': !this.hasValue } }, this.hasValue ? this.displayText : this.placeholder)), this.clearable && this.hasValue && !this.disabled && (h("button", { key: '
|
|
491
|
+
}))) : (h("span", { class: { 'co-select__text': true, 'co-select__text--placeholder': !this.hasValue } }, this.hasValue ? this.displayText : this.placeholder)), this.clearable && this.hasValue && !this.disabled && (h("button", { key: '8283fa5c6e945370d297820e4bf7a0c5c7118d49', class: "co-select__clear", type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear" }, h("co-icon", { key: 'f9a7b5def3a2cc4e01f2a56e0c10743bc8e07e59', name: "x-circle", size: 16, weight: "fill" }))), h("co-icon", { key: 'f8b679fffe85ffb822e5cc839e35811c462f9592', name: this.isOpen ? 'caret-up' : 'caret-down', size: 16, class: "co-select__caret" })), h("div", { key: 'bda5777b9ebfd020189e29c1a1f6b17c7c86d978', class: "co-select__dropdown" }, this.isOpen && this.searchable && (h("div", { key: 'ad68d72ce251b1b85e8d3b459f435036ee3e755c', class: "co-select__search" }, h("co-icon", { key: '17fce190c24cc8d3a858b0d8eac91fa2f0bfcdc4', name: "magnifying-glass", size: 16, class: "co-select__search-icon" }), h("input", { key: '11b596b00d4ec1ca622fbf8f2a4fe1206dbbd175', class: "co-select__search-input", type: "text", placeholder: this.searchPlaceholder, value: this.searchText, "aria-controls": CoSelect.LISTBOX_ID, "aria-activedescendant": activeOptionId, onInput: this.handleSearchInput, onKeyDown: this.handleNavKeyDown, ref: (el) => (this.searchInputEl = el) }))), this.isOpen && this.searchable && options.length === 0 && (h("div", { key: '248d24733e9a785582be376e9adf1bddd486db79', class: "co-select__empty" }, this.emptyText)), h("div", { key: 'd4a45905d6eeac9e7275df90e01fb7e2fb092fbd', class: "co-select__options", id: CoSelect.LISTBOX_ID, role: "listbox", "aria-multiselectable": this.multiple ? 'true' : undefined, ref: (el) => (this.optionsContainerEl = el) }, this.isOpen && (() => {
|
|
492
492
|
const { totalHeight, startIdx, endIdx, offsetY } = this.getVirtualSlice(options);
|
|
493
493
|
return (
|
|
494
494
|
// Los wrappers del virtualizador van `presentation` para que las
|
|
@@ -504,7 +504,7 @@ const CoSelect = class {
|
|
|
504
504
|
'co-select__option--active': index === this.activeIndex,
|
|
505
505
|
}, onClick: () => !isDisabled && this.handleOptionClick(opt.value) }, opt.image ? (h("img", { class: "co-select__option-flag", src: opt.image, alt: "", loading: "lazy" })) : opt.icon ? (h("co-icon", { name: opt.icon, size: 20, class: "co-select__option-icon" })) : null, h("span", { class: "co-select__option-label" }, this.renderLabel(opt.label)), isSelected && h("co-icon", { name: "check", size: 16, class: "co-select__option-check" })));
|
|
506
506
|
}))));
|
|
507
|
-
})()), this.isOpen && this.showFooter && (h("co-list-footer", { key: '
|
|
507
|
+
})()), this.isOpen && this.showFooter && (h("co-list-footer", { key: 'd4ec3a85eb066f11213ba0fa4614cc7439180121', class: "co-select__footer", primaryLabel: this.footerPrimaryLabel, primaryIcon: "check", onCoPrimary: this.handleFooterPrimary })))), this.helperText && (h("div", { key: '893289181663600d899a1dba74f2ac47cba72a28', class: `co-select__helper co-select__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: 'a21b2833866b76dc197cbb1a50edd1e1ec9d3e16', name: this.statusIcon, size: 14, class: "co-select__helper-icon" }), h("span", { key: '5c887dd997d3f7046f74586a5c4258f9a02df416', class: "co-select__helper-text" }, this.helperText)))));
|
|
508
508
|
}
|
|
509
509
|
get el() { return getElement(this); }
|
|
510
510
|
static get watchers() { return {
|
|
@@ -61,7 +61,7 @@ const CoSeparator = class {
|
|
|
61
61
|
style['--co-separator-inset-end'] = '0px';
|
|
62
62
|
}
|
|
63
63
|
}
|
|
64
|
-
return (h("hr", { key: '
|
|
64
|
+
return (h("hr", { key: '049f323b914f76e3ea6097e56fbbda92e827c58d', class: {
|
|
65
65
|
'co-separator': true,
|
|
66
66
|
'co-separator--vertical': this.vertical,
|
|
67
67
|
'co-separator--dark': this.dark,
|
|
@@ -10,10 +10,10 @@ const CoSidebar = class {
|
|
|
10
10
|
this.mode = 'full';
|
|
11
11
|
}
|
|
12
12
|
render() {
|
|
13
|
-
return (h("nav", { key: '
|
|
13
|
+
return (h("nav", { key: '2b28eeec6d294b22c82de54918a5c9f5da2765b9', class: {
|
|
14
14
|
'co-sidebar': true,
|
|
15
15
|
[`co-sidebar--${this.mode}`]: true,
|
|
16
|
-
}, part: "sidebar" }, h("div", { key: '
|
|
16
|
+
}, part: "sidebar" }, h("div", { key: 'a2f2c05634bb76c3e9a9fdab221835d94c25d9fc', class: "co-sidebar__header", part: "header" }, h("slot", { key: 'f32a89453858268fd4672330fdf1d263793ae578', name: "header" })), h("div", { key: 'ecfaf8385f5fed7f545268e29a5a67468aa5a87a', class: "co-sidebar__body", part: "body" }, h("slot", { key: '2466d2aefe5268f21fd515d282baae2662c17f6c' })), h("div", { key: 'b7e2738a2a6bef17f588d59fba0c4ab21aefa7f8', class: "co-sidebar__footer", part: "footer" }, h("slot", { key: 'dcfcf1f58c99ca0acf359bbf9f73dfe51b0e7c76', name: "footer" }))));
|
|
17
17
|
}
|
|
18
18
|
};
|
|
19
19
|
CoSidebar.style = coSidebarCss();
|
|
@@ -78,12 +78,12 @@ const CoSlider = class {
|
|
|
78
78
|
}
|
|
79
79
|
render() {
|
|
80
80
|
const pct = this.percentage;
|
|
81
|
-
return (h("div", { key: '
|
|
81
|
+
return (h("div", { key: 'f1b21cde4464675c8a27a30f04af6aeb0eb5c115', class: {
|
|
82
82
|
'co-slider': true,
|
|
83
83
|
'co-slider--disabled': this.disabled,
|
|
84
84
|
'co-slider--dragging': this.dragging,
|
|
85
85
|
[`co-slider--${this.status}`]: this.status !== 'default',
|
|
86
|
-
} }, (this.label || this.secondaryLabel || this.showValue) && (h("div", { key: '
|
|
86
|
+
} }, (this.label || this.secondaryLabel || this.showValue) && (h("div", { key: '20377b1c1b2cb329dd52cc10dfe4f5abf03eaecb', class: "co-slider__labels" }, h("div", { key: 'a9507269b1938732642ce7e7a4371628912377e3', class: "co-slider__labels-left" }, this.label && h("label", { key: '01e1760ef4a59ddc26bb4322f4b97133ccd04992', class: "co-slider__label" }, this.label), this.secondaryLabel && h("span", { key: '1b6c54039e18d9c8025941f76e1b92699855abae', class: "co-slider__secondary-label" }, this.secondaryLabel)), this.showValue && h("span", { key: 'c3fa230e31d052a9cb8a2efc8a3ed3b0b93e8041', class: "co-slider__value" }, this.value))), h("div", { key: 'c387ace9f1256cf4cf52e23add68242c147cd398', class: "co-slider__track-wrapper", ref: el => (this.trackEl = el), onPointerDown: this.handlePointerDown }, h("div", { key: 'f454a70a71984f0b45bd68efc9a36ba74bb4a73b', class: "co-slider__track" }, h("div", { key: '28b1fd955b14cd9ec563ad0a0c8cb625cf87bf1e', class: "co-slider__fill", style: { width: `${pct}%` } })), h("div", { key: '3f8e97722be5d5589931158b243f3e7084dae971', class: "co-slider__thumb", style: { left: `${pct}%` } })), this.showMarks && (h("div", { key: '7b58ecbcdfa544a47e15a9be15cec4baab35c56e', class: "co-slider__marks" }, h("span", { key: 'e94e7641d59d54aa92b7896d4f9a85cff93ca162', class: "co-slider__mark" }, this.min), h("span", { key: 'f6b139482d3d18885461d9d44fac8c4960897c00', class: "co-slider__mark" }, this.max))), h("input", { key: '65ddf275339b86a5451e28905ed4086bdde3bb75', class: "co-slider__native", type: "range", min: this.min, max: this.max, step: this.step, value: this.value, disabled: this.disabled, onInput: this.handleInputChange, "aria-label": this.label || 'Slider' }), this.helperText && (h("div", { key: '4b603fee85613d8221dfdca0687d7735c7bd7947', class: `co-slider__helper co-slider__helper--${this.status}` }, this.statusIcon && h("co-icon", { key: 'c75be242a86fafbe87edaf0b47458f6897ca642f', name: this.statusIcon, size: 14, weight: "fill", class: "co-slider__helper-icon" }), h("span", { key: 'fa7e03cd30070441423b261de7704c39f24fbb9d', class: "co-slider__helper-text" }, this.helperText)))));
|
|
87
87
|
}
|
|
88
88
|
get el() { return getElement(this); }
|
|
89
89
|
};
|
|
@@ -34,16 +34,16 @@ const CoSwitch = class {
|
|
|
34
34
|
render() {
|
|
35
35
|
const hasLabels = this.label || this.secondaryLabel;
|
|
36
36
|
const hasHelper = !!this.helperText;
|
|
37
|
-
return (h("div", { key: '
|
|
37
|
+
return (h("div", { key: '956a6fb6f379beec4aceda49fb0b6460a4e88e7e', class: {
|
|
38
38
|
'co-switch-wrapper': true,
|
|
39
39
|
'co-switch-wrapper--disabled': this.disabled,
|
|
40
40
|
[`co-switch-wrapper--${this.status}`]: this.status !== 'default',
|
|
41
|
-
} }, h("div", { key: '
|
|
41
|
+
} }, h("div", { key: '320bc52265bbb759766bf2897fa46149fd29ea56', class: "co-switch-wrapper__row", onClick: this.handleClick }, h("button", { key: '8f8ccbee5f6b8bf4c59af1363184dc8289c0fd4f', role: "switch", "aria-checked": String(this.checked), "aria-label": this.label || '', class: {
|
|
42
42
|
'co-switch': true,
|
|
43
43
|
'co-switch--on': this.checked,
|
|
44
44
|
'co-switch--off': !this.checked,
|
|
45
45
|
'co-switch--disabled': this.disabled,
|
|
46
|
-
}, disabled: this.disabled, part: "track" }, h("span", { key: '
|
|
46
|
+
}, disabled: this.disabled, part: "track" }, h("span", { key: '963515eb5e7a6c2d8904367cabe4afd92c4034bd', class: "co-switch__thumb", part: "thumb" })), hasLabels && (h("div", { key: '2560a81688f26bc0b3bddef3c5553a8f9754678b', class: "co-switch-wrapper__labels" }, this.label && h("span", { key: '9996ab6c675c43be962414e28ecef532738322bc', class: "co-switch-wrapper__label", part: "label" }, this.label, h(RequiredMark, { key: '5505498fc3a27b5bf515935c46a3fdfdfe563cad', required: this.required })), this.secondaryLabel && (h("span", { key: '6886950f1e66077f46cceca4aabf2b0ae7a21f3c', class: "co-switch-wrapper__secondary-label", part: "secondary-label" }, this.secondaryLabel))))), hasHelper && (h("div", { key: '536e0021e9e1a986eb76eacf9e1b9af37cf0e1f0', class: `co-switch-wrapper__helper co-switch-wrapper__helper--${this.status}` }, this.statusIcon && (h("co-icon", { key: 'e98eb52b8f30b868b0b4df6f45b7594290c8ebd3', name: this.statusIcon, size: 14, weight: "fill", class: "co-switch-wrapper__helper-icon" })), h("span", { key: 'f77df5e62fedd3c28dd0e6b8dcc2ad9118c9f032', class: "co-switch-wrapper__helper-text" }, this.helperText)))));
|
|
47
47
|
}
|
|
48
48
|
};
|
|
49
49
|
CoSwitch.style = coSwitchCss();
|
|
@@ -54,10 +54,10 @@ const CoTabGroup = class {
|
|
|
54
54
|
});
|
|
55
55
|
}
|
|
56
56
|
render() {
|
|
57
|
-
return (h("div", { key: '
|
|
57
|
+
return (h("div", { key: '70c781dc6c053c0fbaecb294d08130df50f6895c', class: {
|
|
58
58
|
'co-tab-group': true,
|
|
59
59
|
[`co-tab-group--${this.variant}`]: true,
|
|
60
|
-
}, role: "tablist", part: "tab-group", onWheel: this.onWheel }, h("slot", { key: '
|
|
60
|
+
}, role: "tablist", part: "tab-group", onWheel: this.onWheel }, h("slot", { key: '4337b016d1ce84d1d4bdda5d8f0f6b3f03e1fa27', onSlotchange: this.onSlotChange })));
|
|
61
61
|
}
|
|
62
62
|
get el() { return getElement(this); }
|
|
63
63
|
static get watchers() { return {
|
package/dist/esm/co-tab.entry.js
CHANGED
|
@@ -26,13 +26,13 @@ const CoTab = class {
|
|
|
26
26
|
}
|
|
27
27
|
render() {
|
|
28
28
|
const iconSize = this.variant === 'underline' ? 16 : this.size === 'large' ? 18 : 14;
|
|
29
|
-
return (h("button", { key: '
|
|
29
|
+
return (h("button", { key: '773b792dbc4250e0833629d95495b97140892ee3', class: {
|
|
30
30
|
'co-tab': true,
|
|
31
31
|
[`co-tab--${this.size}`]: true,
|
|
32
32
|
[`co-tab--${this.variant}`]: true,
|
|
33
33
|
'co-tab--selected': this.selected,
|
|
34
34
|
'co-tab--disabled': this.disabled,
|
|
35
|
-
}, type: "button", role: "tab", "aria-selected": this.selected ? 'true' : 'false', disabled: this.disabled, part: "tab", onClick: this.handleClick }, this.iconLeft && (h("co-icon", { key: '
|
|
35
|
+
}, type: "button", role: "tab", "aria-selected": this.selected ? 'true' : 'false', disabled: this.disabled, part: "tab", onClick: this.handleClick }, this.iconLeft && (h("co-icon", { key: '764382b4d7a71307897e71b1937c0b22b5c873b0', name: this.iconLeft, size: iconSize })), h("span", { key: '0276e774f797a28a5a9d4a22726a8c5b40ee7c72' }, this.label), this.badge && (h("span", { key: '8d758122ee23232d7687b69f8dddf1820f647505', class: "co-tab__badge", part: "badge" }, this.badge)), this.iconRight && (h("co-icon", { key: '5c2fda105048d62b45a5f0a124110a4a5b919575', name: this.iconRight, size: iconSize }))));
|
|
36
36
|
}
|
|
37
37
|
};
|
|
38
38
|
CoTab.style = coTabCss();
|
|
@@ -174,14 +174,14 @@ const CoTagsField = class {
|
|
|
174
174
|
const showClear = this.clearable && this.hasValue && !this.disabled && !this.readonly;
|
|
175
175
|
const helper = this.isInvalid ? this.errorMessage : this.helperText;
|
|
176
176
|
const showInput = !this.readonly && !this.atCapacity;
|
|
177
|
-
return (h("div", { key: '
|
|
177
|
+
return (h("div", { key: 'f3e43affdea1fbb7b4a146c7d47fc476064a4461', class: {
|
|
178
178
|
'co-tags-field': true,
|
|
179
179
|
'co-tags-field--disabled': this.disabled,
|
|
180
180
|
'co-tags-field--focused': this.hasFocus,
|
|
181
181
|
'co-tags-field--filled': this.hasValue,
|
|
182
182
|
'co-tags-field--invalid': this.isInvalid,
|
|
183
183
|
[`co-tags-field--${this.size}`]: true,
|
|
184
|
-
}, part: "wrapper" }, this.label && (h("div", { key: '
|
|
184
|
+
}, part: "wrapper" }, this.label && (h("div", { key: 'd1ee2a4474f714b5677dbe30234c35ae5eafcbb8', class: "co-tags-field__labels" }, h("label", { key: '2992ec19d614d79e4d464c4d395d0928b4640796', class: "co-tags-field__label", part: "label" }, this.label, h(RequiredMark, { key: 'dff39a47aeb7f61abeffd3da6d774feea1cbb690', required: this.required })))), h("div", { key: '634c966d0e00075e31a87e8c34d5d82e706d259b', class: "co-tags-field__field-row" }, h("div", { key: '770158cf92aebf36c7ef070af2dedc15527b0207', class: "co-tags-field__field", part: "field", onClick: this.handleFieldClick }, h("div", { key: 'd92243180b3a674e7a8c49e5d693cec55e77b90d', class: "co-tags-field__input-wrapper" }, tags.map((tag, index) => this.editingIndex === index ? (h("input", { key: `edit-${index}`, ref: (el) => (this.editEl = el), class: "co-tags-field__edit", type: "text", value: this.editingDraft, onInput: (e) => (this.editingDraft = e.target.value), onKeyDown: this.handleEditKeyDown, onBlur: () => this.saveEdit() })) : (
|
|
185
185
|
// Shared field-chip (utils/fieldChip.tsx) per the Figma
|
|
186
186
|
// "Tipo=Chips" spec — same look as co-ref-field's chips.
|
|
187
187
|
h(FieldChip, { key: `chip-${index}-${tag}`, baseClass: "co-tags-field__chip", label: tag, title: tag, onChipDblClick: () => this.startEdit(index), onRemove: !this.disabled && !this.readonly
|
|
@@ -189,13 +189,13 @@ const CoTagsField = class {
|
|
|
189
189
|
e.stopPropagation();
|
|
190
190
|
this.removeTag(index);
|
|
191
191
|
}
|
|
192
|
-
: undefined }))), showInput && (h("input", { key: '
|
|
192
|
+
: undefined }))), showInput && (h("input", { key: '9b60812333730a949d9bef63f63690086735d4ad', ref: (el) => (this.inputEl = el), class: "co-tags-field__native", type: "text", autocomplete: "off", value: this.draft, placeholder: tags.length === 0 ? this.placeholder : '', disabled: this.disabled, required: this.required && tags.length === 0, "aria-invalid": this.isInvalid ? 'true' : 'false', "aria-label": !this.label ? 'Tags' : undefined, onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyDown: this.handleKeyDown, part: "input" }))), this.clearable && (h("button", { key: '5e36f6cbe51abd905584791348bd00ff903d448a', class: {
|
|
193
193
|
'co-tags-field__clear': true,
|
|
194
194
|
'co-tags-field__clear--hidden': !showClear,
|
|
195
|
-
}, type: "button", tabIndex: -1, onMouseDown: (e) => e.preventDefault() /* keep input focus */, onClick: this.handleClearAll, "aria-label": "Clear all", part: "clear" }, h("co-icon", { key: '
|
|
195
|
+
}, type: "button", tabIndex: -1, onMouseDown: (e) => e.preventDefault() /* keep input focus */, onClick: this.handleClearAll, "aria-label": "Clear all", part: "clear" }, h("co-icon", { key: 'bf2295665df0b0f628ab68b33435b5864af74c7e', name: "x-circle", size: 16, weight: "fill" }))))), this.name && h("input", { key: 'bb9359faedaec2cbcf175929b24f2d00ecf13e59', type: "hidden", name: this.name, value: JSON.stringify(tags) }), helper && (h("div", { key: '7994108e5ab59ad4e85243b44b958a6ebfaf250f', class: {
|
|
196
196
|
'co-tags-field__helper': true,
|
|
197
197
|
'co-tags-field__helper--error': this.isInvalid,
|
|
198
|
-
}, part: "helper" }, this.isInvalid && (h("co-icon", { key: '
|
|
198
|
+
}, part: "helper" }, this.isInvalid && (h("co-icon", { key: '0ec2df5f071939df6b84dc4c0a013d3c2355bfeb', name: "warning-circle", size: 14, class: "co-tags-field__helper-icon" })), h("span", { key: '82354fcd44fe07f40f906cf88c998554ac7b199a', class: "co-tags-field__helper-text" }, helper)))));
|
|
199
199
|
}
|
|
200
200
|
get el() { return getElement(this); }
|
|
201
201
|
static get watchers() { return {
|
|
@@ -73,7 +73,7 @@ const CoTextarea = class {
|
|
|
73
73
|
const showClear = this.clearable && this.hasValue && !this.disabled && !this.readonly;
|
|
74
74
|
const isOverLimit = this.maxLength != null && this.charCount > this.maxLength;
|
|
75
75
|
const statusClass = this.status !== 'default' ? `co-textarea--${this.status}` : '';
|
|
76
|
-
return (h("div", { key: '
|
|
76
|
+
return (h("div", { key: 'c5d9a8fc2c47e2ac4787441d2837b9bf600aceb8', class: {
|
|
77
77
|
'co-textarea': true,
|
|
78
78
|
'co-textarea--disabled': this.disabled,
|
|
79
79
|
'co-textarea--focused': this.hasFocus,
|
|
@@ -82,13 +82,13 @@ const CoTextarea = class {
|
|
|
82
82
|
[`co-textarea--${this.size}`]: true,
|
|
83
83
|
[statusClass]: !!statusClass,
|
|
84
84
|
'co-textarea--flat': this.variant === 'flat',
|
|
85
|
-
}, part: "wrapper" }, (this.label || this.secondaryLabel) && (h("div", { key: '
|
|
85
|
+
}, part: "wrapper" }, (this.label || this.secondaryLabel) && (h("div", { key: '4c71cdc7a1d8063b4fc88613cc6840ae4d8fffbd', class: "co-textarea__labels" }, this.label && (h("label", { key: '7a332a79ca80a5e7e6e0e18431871c83175cf6ad', class: "co-textarea__label", part: "label" }, this.label, h(RequiredMark, { key: 'f266eeff511590081664ff5677e85f91bb8cc6c6', required: this.required }))), this.secondaryLabel && (h("span", { key: '43d1d98374cd6cdb9e9ebbed9a0677d36ccf0242', class: "co-textarea__secondary-label" }, this.secondaryLabel)))), h("div", { key: '31b9a71972fc8bf6db1e01f6ef421d1cd01c0c71', class: "co-textarea__field", part: "field" }, h("textarea", { key: 'c6e42c9cb50919f8d28d52acc6ac67824d2ab9bc', ref: (el) => (this.textareaEl = el), class: {
|
|
86
86
|
'co-textarea__native': true,
|
|
87
87
|
[`co-textarea__native--resize-${this.resize}`]: true,
|
|
88
|
-
}, rows: this.rows, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, "aria-invalid": this.status === 'error' || isOverLimit ? 'true' : 'false', onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, part: "input" }), showClear && (h("button", { key: '
|
|
88
|
+
}, rows: this.rows, value: this.value, placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, "aria-invalid": this.status === 'error' || isOverLimit ? 'true' : 'false', onInput: this.handleInput, onFocus: this.handleFocus, onBlur: this.handleBlur, part: "input" }), showClear && (h("button", { key: '37ade2676d789e93699b31c60ee1922287613c99', class: "co-textarea__clear", type: "button", tabIndex: -1, onClick: this.handleClear, "aria-label": "Clear" }, h("co-icon", { key: '635e46dd3780dce114beeda02e05a8dc512f0e64', name: "x-circle", size: 16, weight: "fill" })))), (this.helperText || this.maxLength != null) && (h("div", { key: 'c845c82bba32624dbb23b518283f646fc573766e', class: "co-textarea__footer" }, this.helperText && (h("div", { key: '3cf30fdfbab68e06fc757b7a64b7d89cbefe53ac', class: {
|
|
89
89
|
'co-textarea__helper': true,
|
|
90
90
|
'co-textarea__helper--error': this.status === 'error',
|
|
91
|
-
}, part: "helper" }, this.status === 'error' && (h("co-icon", { key: '
|
|
91
|
+
}, part: "helper" }, this.status === 'error' && (h("co-icon", { key: '16009fbd88a7f4769bb1ddf1cbadf8aaf3dce17b', name: "warning-circle", size: 14, class: "co-textarea__helper-icon" })), h("span", { key: '3986eda7ec8df0da750a410bf6c361b864386d64', class: "co-textarea__helper-text" }, this.helperText))), this.maxLength != null && (h("span", { key: '7ed3ab0c254b0d69f90016dcdc419408410ea457', class: {
|
|
92
92
|
'co-textarea__counter': true,
|
|
93
93
|
'co-textarea__counter--over': isOverLimit,
|
|
94
94
|
}, part: "counter" }, this.charCount, "/", this.maxLength))))));
|
|
@@ -309,7 +309,7 @@ const CoTimeField = class {
|
|
|
309
309
|
}
|
|
310
310
|
render() {
|
|
311
311
|
const t = getDateStrings(this.locale);
|
|
312
|
-
return (h("div", { key: '
|
|
312
|
+
return (h("div", { key: 'e9feeca94b48ef78597c8a8aeb56e147cc639cac', class: { 'co-time-field': true, 'co-time-field--disabled': this.disabled }, role: "group", "aria-label": this.fieldLabel || t.timeFieldLabel }, h("span", { key: 'a1b992c5bbb5dfd2dfec4aedadf7f432a218a36c', class: "co-time-field__segs" }, this.renderSeg('hour', t), h("span", { key: 'dbc63905e7c40a17e01dd2a7e69b914c9d5359e3', class: "co-time-field__sep", "aria-hidden": "true" }, ":"), this.renderSeg('minute', t), this.hour12 && this.renderSeg('period', t)), h("span", { key: 'b48347646ac193984b5d247709280ef00569c5d8', class: "co-time-field__steppers" }, h("button", { key: '594b11fc3e26a3a6f72becbb6eed0896304dd773', type: "button", tabIndex: -1, "aria-hidden": "true", onMouseDown: (e) => e.preventDefault(), onClick: this.onStepperClick(1) }, h("co-icon", { key: 'd7467c53e0e863633c5efc0ce1574e43f2f317ad', name: "caret-up", size: 10 })), h("button", { key: 'c8a0e2aeeb202d09d7f6b96fadc10c96d2cd5b7c', type: "button", tabIndex: -1, "aria-hidden": "true", onMouseDown: (e) => e.preventDefault(), onClick: this.onStepperClick(-1) }, h("co-icon", { key: '4358757b857d4011f0b05dcb14b82f35057c7e64', name: "caret-down", size: 10 })))));
|
|
313
313
|
}
|
|
314
314
|
get el() { return getElement(this); }
|
|
315
315
|
static get watchers() { return {
|