@prolibu-suite/cobalt-core 0.11.9 → 0.11.10

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.
Files changed (48) hide show
  1. package/custom-elements.json +74 -31
  2. package/dist/cjs/co-color-picker.cjs.entry.js +1 -1
  3. package/dist/cjs/co-file-field.cjs.entry.js +30 -8
  4. package/dist/cjs/cobalt.cjs.js +1 -1
  5. package/dist/cjs/{fileI18n-6sdbKvo6.js → fileI18n-Bz8zbHlB.js} +3 -0
  6. package/dist/cjs/loader.cjs.js +1 -1
  7. package/dist/cobalt/cobalt.esm.js +1 -1
  8. package/dist/cobalt/{p-cd43d372.entry.js → p-15d995b4.entry.js} +1 -1
  9. package/dist/cobalt/p-b6463d35.entry.js +1 -0
  10. package/dist/cobalt/p-z0tbse7d.js +1 -0
  11. package/dist/collection/components/co-autocomplete/co-autocomplete.js +1 -1
  12. package/dist/collection/components/co-avatar-group/co-avatar-group.js +1 -1
  13. package/dist/collection/components/co-checkbox-group/co-checkbox-group.js +1 -1
  14. package/dist/collection/components/co-color-area/co-color-area.js +2 -2
  15. package/dist/collection/components/co-color-slider/co-color-slider.js +1 -1
  16. package/dist/collection/components/co-combobox/co-combobox.js +1 -1
  17. package/dist/collection/components/co-command-search/co-command-search.js +1 -1
  18. package/dist/collection/components/co-data-table/co-data-table.js +1 -1
  19. package/dist/collection/components/co-date-range-picker/co-date-range-picker.js +2 -2
  20. package/dist/collection/components/co-document-editor/co-document-editor.js +5 -5
  21. package/dist/collection/components/co-file-field/co-file-field.js +50 -8
  22. package/dist/collection/components/co-file-field/co-file-field.utils.js +14 -0
  23. package/dist/collection/components/co-popover/co-popover.js +1 -1
  24. package/dist/collection/components/co-radio-group/co-radio-group.js +1 -1
  25. package/dist/collection/components/co-ref-field/co-ref-field.js +4 -4
  26. package/dist/collection/components/co-segmented-bar/co-segmented-bar.js +1 -1
  27. package/dist/collection/components/co-select/co-select.js +1 -1
  28. package/dist/collection/components/co-sidebar-nav/co-sidebar-nav.js +1 -1
  29. package/dist/collection/components/co-toast/co-toast.js +2 -2
  30. package/dist/collection/components/co-transfer-list/co-transfer-list.js +1 -1
  31. package/dist/collection/components/co-tree-item/co-tree-item.js +2 -2
  32. package/dist/collection/utils/fileI18n.js +3 -0
  33. package/dist/components/co-color-picker.js +1 -1
  34. package/dist/components/co-file-field.js +1 -1
  35. package/dist/components/p-z0tbse7d.js +1 -0
  36. package/dist/esm/co-color-picker.entry.js +1 -1
  37. package/dist/esm/co-file-field.entry.js +30 -8
  38. package/dist/esm/cobalt.js +1 -1
  39. package/dist/esm/{fileI18n-gKnOhsd2.js → fileI18n-z0tbse7d.js} +3 -0
  40. package/dist/esm/loader.js +1 -1
  41. package/dist/types/components/co-file-field/co-file-field.d.ts +13 -0
  42. package/dist/types/components/co-file-field/co-file-field.utils.d.ts +6 -0
  43. package/dist/types/components.d.ts +16 -0
  44. package/dist/types/utils/fileI18n.d.ts +1 -0
  45. package/package.json +4 -4
  46. package/dist/cobalt/p-c31b9b51.entry.js +0 -1
  47. package/dist/cobalt/p-gKnOhsd2.js +0 -1
  48. package/dist/components/p-gKnOhsd2.js +0 -1
@@ -1016,7 +1016,7 @@ export class CoDocumentEditor {
1016
1016
  "references": {
1017
1017
  "DocumentPageSize": {
1018
1018
  "location": "local",
1019
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1019
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1020
1020
  "id": "src/components/co-document-editor/co-document-editor.tsx::DocumentPageSize"
1021
1021
  }
1022
1022
  }
@@ -1042,7 +1042,7 @@ export class CoDocumentEditor {
1042
1042
  "references": {
1043
1043
  "DocumentMargins": {
1044
1044
  "location": "local",
1045
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1045
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1046
1046
  "id": "src/components/co-document-editor/co-document-editor.tsx::DocumentMargins"
1047
1047
  }
1048
1048
  }
@@ -1107,7 +1107,7 @@ export class CoDocumentEditor {
1107
1107
  "references": {
1108
1108
  "DocumentFeatures": {
1109
1109
  "location": "local",
1110
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1110
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1111
1111
  "id": "src/components/co-document-editor/co-document-editor.tsx::DocumentFeatures"
1112
1112
  }
1113
1113
  }
@@ -1301,7 +1301,7 @@ export class CoDocumentEditor {
1301
1301
  "references": {
1302
1302
  "DocumentHeaderDetail": {
1303
1303
  "location": "local",
1304
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1304
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1305
1305
  "id": "src/components/co-document-editor/co-document-editor.tsx::DocumentHeaderDetail"
1306
1306
  }
1307
1307
  }
@@ -1337,7 +1337,7 @@ export class CoDocumentEditor {
1337
1337
  "references": {
1338
1338
  "DocumentActionDetail": {
1339
1339
  "location": "local",
1340
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1340
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-document-editor/co-document-editor.tsx",
1341
1341
  "id": "src/components/co-document-editor/co-document-editor.tsx::DocumentActionDetail"
1342
1342
  }
1343
1343
  }
@@ -1,7 +1,7 @@
1
1
  import { h } from "@stencil/core";
2
2
  import { RequiredMark } from "../../utils/requiredMark";
3
3
  import { fillTemplate, getFileStrings } from "../../utils/fileI18n";
4
- import { acceptsFile, downloadViaBlob, fileExtension, formatBytes, isPreviewable, isVideo, previewSrc, truncateLeft, } from "./co-file-field.utils";
4
+ import { acceptsFile, downloadViaBlob, fileExtension, formatBytes, isAnnotatable, isPreviewable, isVideo, previewSrc, truncateLeft, } from "./co-file-field.utils";
5
5
  /**
6
6
  * Host-driven file selector — renders a drop-zone + previews + a file list with
7
7
  * upload progress, but performs NO upload itself. When the user picks/drops
@@ -45,6 +45,13 @@ export class CoFileField {
45
45
  this.layout = 'vertical';
46
46
  /** Allow drag-reordering of the uploaded list (multiple mode). */
47
47
  this.reorderable = true;
48
+ /**
49
+ * Offer an "annotate" action on stored raster images (png/jpg/webp). The
50
+ * field draws nothing itself: it emits `coAnnotate` and the host opens its
51
+ * editor, uploads the result and removes the original — same contract as
52
+ * uploads (the WC emits intent, the host does the I/O).
53
+ */
54
+ this.annotatable = false;
48
55
  /** Controlled file list, JSON array of {@link FileItem} (owned by the host). */
49
56
  this.files = '[]';
50
57
  this.dragOver = false;
@@ -377,12 +384,12 @@ export class CoFileField {
377
384
  const previews = this.previewItems();
378
385
  const canReorder = this.reorderable && this.multiple && !this.disabled && !this.readonly && items.length > 1;
379
386
  const capacity = this.capacityHint(s);
380
- return (h("div", { key: '4a6cea48737c68e53f90a32e962660473f49ce5a', class: {
387
+ return (h("div", { key: 'ce032373afbb21b082696b4d532655c3d599800c', class: {
381
388
  'co-file-field': true,
382
389
  'co-file-field--disabled': this.disabled,
383
390
  'co-file-field--invalid': this.isInvalid,
384
391
  [statusClass]: !!statusClass,
385
- }, part: "wrapper" }, this.label && (h("div", { key: '3532e314c63b19208c7a7665dd025ff38585a598', class: "co-file-field__labels" }, h("label", { key: 'ae8aa6da81d6b959233218473086ecabe5ab8017', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: '78d12c0e676217fd208bc03cc6a119b6fbf521e7', required: this.required })))), showDropzone && (h("div", { key: 'a6e5764aa57090d6b9383b1f8148bcba1239ff3a', class: {
392
+ }, part: "wrapper" }, this.label && (h("div", { key: '7650af04090b50b39e9dde6879156b51fd0a1b11', class: "co-file-field__labels" }, h("label", { key: '5f305d56f5dcbe3b8d267e22471f4c6536792510', class: "co-file-field__label", part: "label" }, this.label, h(RequiredMark, { key: '46896eae83028b9117c32b2ab9ac21443a58c608', required: this.required })))), showDropzone && (h("div", { key: 'c2767c1c6f8e0e928f328db2e985f747f34b13af', class: {
386
393
  'co-file-field__dropzone': true,
387
394
  'co-file-field__dropzone--drag': this.dragOver,
388
395
  }, part: "dropzone", role: "button", tabIndex: this.disabled ? -1 : 0, onClick: this.handleBrowse, onKeyDown: (e) => {
@@ -390,7 +397,7 @@ export class CoFileField {
390
397
  e.preventDefault();
391
398
  this.handleBrowse();
392
399
  }
393
- }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: '44558c1a5d15c5aca23a7e204bcccf5e57d6b740', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: '662340ae54f1d070606c0fd8226155b0360e803e', name: "file-arrow-up", size: 18 }), h("span", { key: '752f18e7121040eb4edf571a54a9a5308825cb13' }, this.uploadButtonText || s.uploadButton)), h("span", { key: 'b92332ee8e7e658b33814b8c1ae34a4630045819', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: 'ed1f7c9093145ecbb49446b72a3d3bc99ee232e2', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: 'fd4953e9dfebf35936ae836d6f28ccdc17ccf951', class: "co-file-field__actions", part: "actions" }, h("slot", { key: 'c2e568fabd1512ecfa298c2ab281d310fbe21664', name: "actions" })), h("input", { key: '17acb79e8d066c18f7c1ac051a365d4282c852af', ref: (el) => (this.inputEl = el), class: "co-file-field__input", type: "file", multiple: this.multiple, accept: this.inputAccept, disabled: this.disabled, onChange: this.handleInputChange, "aria-hidden": "true", tabIndex: -1 }))), items.length > 0 && (h("div", { key: 'a793e2b836269abaafe71fd56b07b3d54155cf75', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: '2a265874db718faf1e78f2dd46e5ff14bbfbbff2', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: 'a4ebb3fae5ad4b2b29263381f9eb5ae03a98867d', class: "co-file-field__previews", part: "previews" }, previews.map((item) => {
400
+ }, onDragOver: this.handleDragOver, onDragLeave: this.handleDragLeave, onDrop: this.handleDrop }, h("button", { key: 'f9b2ef43730b009a6ca322ea6cae833f86a52ff0', class: "co-file-field__upload-btn", part: "upload-button", type: "button", tabIndex: -1 }, h("co-icon", { key: 'ffa7d7fdb830fc789ffd4ada624c450c70109701', name: "file-arrow-up", size: 18 }), h("span", { key: 'c9c54dd9432f8c74894a0054ecdf0c59aede974a' }, this.uploadButtonText || s.uploadButton)), h("span", { key: '74f8884d62b79960e0080794404f24e45d229284', class: "co-file-field__dropzone-text" }, this.dropText || s.dropHint), capacity && h("span", { key: '4c6bdd2de90754b50135e9212510884d1495b8d4', class: "co-file-field__dropzone-hint" }, capacity), h("div", { key: '42bd92119fed5b9be39e7db5c351990faafc7135', class: "co-file-field__actions", part: "actions" }, h("slot", { key: 'fa2a649c222125ba63fa74028dba417c50f7b3f6', name: "actions" })), h("input", { key: '982021a63eb6bec0b19ca917382a6efd37938ab3', ref: (el) => (this.inputEl = el), class: "co-file-field__input", type: "file", multiple: this.multiple, accept: this.inputAccept, disabled: this.disabled, onChange: this.handleInputChange, "aria-hidden": "true", tabIndex: -1 }))), items.length > 0 && (h("div", { key: '95bd1f51b0a361dec2ca0b272212ef64d438db0a', class: "co-file-field__uploaded" }, this.multiple && (h("div", { key: '479851cd44dbdc9ad99e9b26764f558845966c53', class: "co-file-field__uploaded-title", part: "uploaded-title" }, `${this.uploadedTitle || s.uploadedTitle} (${items.length})`)), previews.length > 0 && (h("div", { key: '8be03edd2b1b8b7628d6e34fa82751045589b416', class: "co-file-field__previews", part: "previews" }, previews.map((item) => {
394
401
  const key = this.keyFor(item);
395
402
  const video = isVideo(item);
396
403
  // A video without a usable poster still gets a card — the
@@ -401,7 +408,7 @@ export class CoFileField {
401
408
  'co-file-field__preview': true,
402
409
  'co-file-field__preview--video': video,
403
410
  }, part: "preview", type: "button", key: `prev-${key}`, title: item.name, "aria-label": `${video ? s.playVideo : s.openPreview}: ${item.name}`, onClick: () => this.handlePreviewOpen(item) }, showImg && (h("img", { src: video ? poster : item.thumbnail || item.url, alt: item.name, loading: "lazy", onError: () => this.handlePreviewError(item) })), video && (h("span", { class: "co-file-field__preview-play", "aria-hidden": "true" }, h("span", { class: "co-file-field__preview-play-badge" }, h("co-icon", { name: "play", size: 20, weight: "fill" })), !poster && (h("span", { class: "co-file-field__preview-ext" }, fileExtension(item).toUpperCase()))))));
404
- }))), h("ul", { key: '97ead2383d036b1ed2b09d6e931be2bfbcce25d2', class: "co-file-field__list", part: "list" }, items.map((item) => {
411
+ }))), h("ul", { key: '1fa661f14a8644a2703204d1faac79e5599c5e77', class: "co-file-field__list", part: "list" }, items.map((item) => {
405
412
  const key = this.keyFor(item);
406
413
  const draggable = canReorder && item.status === 'done';
407
414
  return (h("li", { class: {
@@ -421,14 +428,14 @@ export class CoFileField {
421
428
  'co-file-field__row-icon--spin': item.status === 'uploading',
422
429
  } })), h("div", { class: "co-file-field__row-body" }, h("span", { class: "co-file-field__row-name", title: item.name }, truncateLeft(item.name)), item.status === 'uploading' && (h("div", { class: "co-file-field__progress" }, h("div", { class: "co-file-field__progress-bar", style: typeof item.progress === 'number'
423
430
  ? { width: `${item.progress}%` }
424
- : undefined }))), item.status === 'error' && item.error && (h("span", { class: "co-file-field__row-error" }, item.error))), item.size != null && (h("span", { class: "co-file-field__row-size" }, formatBytes(item.size))), item.status === 'done' && !!item.url && (h("co-tooltip", { content: s.downloadFile }, h("a", { class: "co-file-field__action", href: item.url, target: "_blank", rel: "noopener noreferrer", download: item.name, tabIndex: -1, "aria-label": s.downloadFile, onClick: (e) => this.onDownloadClick(e, item) }, h("co-icon", { name: "download", size: 18 })))), item.status === 'done' && !!item.url && (h("co-tooltip", { content: this.copiedKey === key ? s.copied : s.copyUrl }, h("button", { class: {
431
+ : undefined }))), item.status === 'error' && item.error && (h("span", { class: "co-file-field__row-error" }, item.error))), item.size != null && (h("span", { class: "co-file-field__row-size" }, formatBytes(item.size))), this.annotatable && !this.disabled && !this.readonly && isAnnotatable(item) && (h("co-tooltip", { content: s.annotateImage }, h("button", { class: "co-file-field__action", type: "button", tabIndex: -1, "aria-label": `${s.annotateImage}: ${item.name}`, onClick: () => this.coAnnotate.emit({ id: key, url: item.url, name: item.name }) }, h("co-icon", { name: "pencil-simple-line", size: 18 })))), item.status === 'done' && !!item.url && (h("co-tooltip", { content: s.downloadFile }, h("a", { class: "co-file-field__action", href: item.url, target: "_blank", rel: "noopener noreferrer", download: item.name, tabIndex: -1, "aria-label": s.downloadFile, onClick: (e) => this.onDownloadClick(e, item) }, h("co-icon", { name: "download", size: 18 })))), item.status === 'done' && !!item.url && (h("co-tooltip", { content: this.copiedKey === key ? s.copied : s.copyUrl }, h("button", { class: {
425
432
  'co-file-field__action': true,
426
433
  'co-file-field__action--copied': this.copiedKey === key,
427
434
  }, type: "button", tabIndex: -1, "aria-label": s.copyUrl, onClick: () => this.handleCopy(item) }, h("co-icon", { name: this.copiedKey === key ? 'check' : 'copy', size: 18 })))), !this.disabled && !this.readonly && (h("co-tooltip", { content: s.removeFile }, h("button", { class: "co-file-field__action", type: "button", tabIndex: -1, "aria-label": s.removeFile, onClick: () => this.coRemove.emit(key) }, h("co-icon", { name: "trash", size: 18 }))))));
428
- })))), helper && (h("div", { key: 'd4fef1bb2aa10f90ca7cd5e01bb5fed9ea917637', class: {
435
+ })))), helper && (h("div", { key: '7562fdf435667ae305e677830cae06a3374ef67b', class: {
429
436
  'co-file-field__helper': true,
430
437
  'co-file-field__helper--error': this.isInvalid,
431
- }, part: "helper" }, this.isInvalid && (h("co-icon", { key: '2fb9d5d28732c239bcec4b0a30dfe194367e8b5d', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: '09bd101388c52a7fb8d0139c20f52f2da733543b', class: "co-file-field__helper-text" }, helper)))));
438
+ }, part: "helper" }, this.isInvalid && (h("co-icon", { key: 'ac43b079725a8b015f2ba1a8b8f22783f60e556e', name: "warning-circle", size: 14, class: "co-file-field__helper-icon" })), h("span", { key: 'cd256498ce501e5b59ae1a5850f8f8ddccb98580', class: "co-file-field__helper-text" }, helper)))));
432
439
  }
433
440
  static get is() { return "co-file-field"; }
434
441
  static get encapsulation() { return "shadow"; }
@@ -756,6 +763,26 @@ export class CoFileField {
756
763
  "attribute": "reorderable",
757
764
  "defaultValue": "true"
758
765
  },
766
+ "annotatable": {
767
+ "type": "boolean",
768
+ "mutable": false,
769
+ "complexType": {
770
+ "original": "boolean",
771
+ "resolved": "boolean",
772
+ "references": {}
773
+ },
774
+ "required": false,
775
+ "optional": false,
776
+ "docs": {
777
+ "tags": [],
778
+ "text": "Offer an \"annotate\" action on stored raster images (png/jpg/webp). The\nfield draws nothing itself: it emits `coAnnotate` and the host opens its\neditor, uploads the result and removes the original \u2014 same contract as\nuploads (the WC emits intent, the host does the I/O)."
779
+ },
780
+ "getter": false,
781
+ "setter": false,
782
+ "reflect": false,
783
+ "attribute": "annotatable",
784
+ "defaultValue": "false"
785
+ },
759
786
  "files": {
760
787
  "type": "string",
761
788
  "mutable": false,
@@ -870,6 +897,21 @@ export class CoFileField {
870
897
  "resolved": "{ id: string; url: string; }",
871
898
  "references": {}
872
899
  }
900
+ }, {
901
+ "method": "coAnnotate",
902
+ "name": "coAnnotate",
903
+ "bubbles": false,
904
+ "cancelable": true,
905
+ "composed": true,
906
+ "docs": {
907
+ "tags": [],
908
+ "text": "Emitted when the user asks to annotate a stored image (see `annotatable`)."
909
+ },
910
+ "complexType": {
911
+ "original": "{ id: string; url: string; name: string }",
912
+ "resolved": "{ id: string; url: string; name: string; }",
913
+ "references": {}
914
+ }
873
915
  }, {
874
916
  "method": "coPreviewOpen",
875
917
  "name": "coPreviewOpen",
@@ -77,6 +77,20 @@ export function isImage(item) {
77
77
  return true;
78
78
  return hasImageExtension(item);
79
79
  }
80
+ /** Raster formats a host can redraw on a canvas and export again without loss of
81
+ * meaning. GIF (animation), SVG (vector) and the rest stay out: flattening them
82
+ * to a bitmap would silently change the file. */
83
+ const ANNOTATABLE_EXTS = new Set(['png', 'jpg', 'jpeg', 'webp']);
84
+ /**
85
+ * A stored raster image the host can annotate (draw on and re-upload). Needs the
86
+ * ORIGINAL `url` — a thumbnail is a downscaled copy, and a PDF that entered the
87
+ * grid through its thumbnail is not an image at all.
88
+ */
89
+ export function isAnnotatable(item) {
90
+ if (item.status !== 'done' || !item.url)
91
+ return false;
92
+ return ANNOTATABLE_EXTS.has(fileExtension(item));
93
+ }
80
94
  /** Items that earn a card in the previews grid: images and videos alike. */
81
95
  export function isPreviewable(item) {
82
96
  return isImage(item) || isVideo(item);
@@ -476,7 +476,7 @@ export class CoPopover {
476
476
  "references": {
477
477
  "PopoverPlacement": {
478
478
  "location": "local",
479
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-popover/co-popover.tsx",
479
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-popover/co-popover.tsx",
480
480
  "id": "src/components/co-popover/co-popover.tsx::PopoverPlacement"
481
481
  }
482
482
  }
@@ -224,7 +224,7 @@ export class CoRadioGroup {
224
224
  "references": {
225
225
  "RadioOption": {
226
226
  "location": "local",
227
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-radio-group/co-radio-group.tsx",
227
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/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
  }
@@ -1356,7 +1356,7 @@ export class CoRefField {
1356
1356
  "references": {
1357
1357
  "RefFieldOption": {
1358
1358
  "location": "local",
1359
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-ref-field/co-ref-field.tsx",
1359
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-ref-field/co-ref-field.tsx",
1360
1360
  "id": "src/components/co-ref-field/co-ref-field.tsx::RefFieldOption"
1361
1361
  }
1362
1362
  }
@@ -1497,7 +1497,7 @@ export class CoRefField {
1497
1497
  "references": {
1498
1498
  "RefFieldOption": {
1499
1499
  "location": "local",
1500
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-ref-field/co-ref-field.tsx",
1500
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-ref-field/co-ref-field.tsx",
1501
1501
  "id": "src/components/co-ref-field/co-ref-field.tsx::RefFieldOption"
1502
1502
  }
1503
1503
  }
@@ -1518,7 +1518,7 @@ export class CoRefField {
1518
1518
  "references": {
1519
1519
  "RefFieldOption": {
1520
1520
  "location": "local",
1521
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-ref-field/co-ref-field.tsx",
1521
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-ref-field/co-ref-field.tsx",
1522
1522
  "id": "src/components/co-ref-field/co-ref-field.tsx::RefFieldOption"
1523
1523
  }
1524
1524
  }
@@ -1557,7 +1557,7 @@ export class CoRefField {
1557
1557
  },
1558
1558
  "RefFieldOption": {
1559
1559
  "location": "local",
1560
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-ref-field/co-ref-field.tsx",
1560
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-ref-field/co-ref-field.tsx",
1561
1561
  "id": "src/components/co-ref-field/co-ref-field.tsx::RefFieldOption"
1562
1562
  }
1563
1563
  },
@@ -160,7 +160,7 @@ export class CoSegmentedBar {
160
160
  "references": {
161
161
  "CoSegment": {
162
162
  "location": "local",
163
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-segmented-bar/co-segmented-bar.tsx",
163
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/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
  }
@@ -848,7 +848,7 @@ export class CoSelect {
848
848
  "references": {
849
849
  "SelectOption": {
850
850
  "location": "local",
851
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-select/co-select.tsx",
851
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-select/co-select.tsx",
852
852
  "id": "src/components/co-select/co-select.tsx::SelectOption"
853
853
  }
854
854
  }
@@ -536,7 +536,7 @@ export class CoSidebarNav {
536
536
  "references": {
537
537
  "NavigateDetail": {
538
538
  "location": "local",
539
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-sidebar-nav/co-sidebar-nav.tsx",
539
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-sidebar-nav/co-sidebar-nav.tsx",
540
540
  "id": "src/components/co-sidebar-nav/co-sidebar-nav.tsx::NavigateDetail"
541
541
  }
542
542
  }
@@ -189,7 +189,7 @@ export class CoToast {
189
189
  "references": {
190
190
  "CoToastActionsLayout": {
191
191
  "location": "local",
192
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-toast/co-toast.tsx",
192
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/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-sidebar-icons/packages/core/src/components/co-toast/co-toast.tsx",
218
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/packages/core/src/components/co-toast/co-toast.tsx",
219
219
  "id": "src/components/co-toast/co-toast.tsx::CoToastVariant"
220
220
  }
221
221
  }
@@ -214,7 +214,7 @@ export class CoTransferList {
214
214
  "references": {
215
215
  "TransferOption": {
216
216
  "location": "local",
217
- "path": "/Users/agox/worktrees/cobalt-sidebar-icons/packages/core/src/components/co-transfer-list/co-transfer-list.tsx",
217
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/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-sidebar-icons/packages/core/src/components/co-tree-item/co-tree-item.tsx",
246
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/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-sidebar-icons/packages/core/src/components/co-tree-item/co-tree-item.tsx",
272
+ "path": "/Users/agox/Documents/Prolibu/prolibu-cobalt/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
  }
@@ -17,6 +17,7 @@ const DICT = {
17
17
  removeFile: 'Eliminar archivo',
18
18
  copyUrl: 'Copiar enlace',
19
19
  downloadFile: 'Descargar',
20
+ annotateImage: 'Anotar imagen',
20
21
  copied: 'Copiado',
21
22
  dragToReorder: 'Arrastra para reordenar',
22
23
  openPreview: 'Abrir vista previa',
@@ -35,6 +36,7 @@ const DICT = {
35
36
  removeFile: 'Remove file',
36
37
  copyUrl: 'Copy link',
37
38
  downloadFile: 'Download',
39
+ annotateImage: 'Annotate image',
38
40
  copied: 'Copied',
39
41
  dragToReorder: 'Drag to reorder',
40
42
  openPreview: 'Open preview',
@@ -53,6 +55,7 @@ const DICT = {
53
55
  removeFile: 'Remover arquivo',
54
56
  copyUrl: 'Copiar link',
55
57
  downloadFile: 'Baixar',
58
+ annotateImage: 'Anotar imagem',
56
59
  copied: 'Copiado',
57
60
  dragToReorder: 'Arraste para reordenar',
58
61
  openPreview: 'Abrir pré-visualização',
@@ -1 +1 @@
1
- import{p as o,H as e,c as r,h as i,t}from"./index.js";import{R as s}from"./p-CWneqh4n.js";import{h as c,a,b as n,c as l,i as h}from"./p-BzxEh7sq.js";import{l as p,f as d}from"./p-gKnOhsd2.js";import{d as u}from"./p-qMNHMnvI.js";import{d as v}from"./p-xA7AfoIW.js";const m={en:{swatches:"Color presets",groupNeutrals:"Neutrals",groupBrand:"Brand colors",area:"Saturation and brightness",hue:"Hue",hueValue:"{n} degrees",saturation:"Saturation",satValue:"Saturation {n}%",brightness:"Brightness",briValue:"Brightness {n}%",area2D:"2D slider",hexField:"Hex code",eyedropper:"Pick a color from the screen",copy:"Copy"},es:{swatches:"Colores predefinidos",groupNeutrals:"Neutros",groupBrand:"Colores de marca",area:"Saturación y brillo",hue:"Matiz",hueValue:"{n} grados",saturation:"Saturación",satValue:"Saturación {n} %",brightness:"Brillo",briValue:"Brillo {n} %",area2D:"Control 2D",hexField:"Código hexadecimal",eyedropper:"Elegir un color de la pantalla",copy:"Copiar"},pt:{swatches:"Cores predefinidas",groupNeutrals:"Neutros",groupBrand:"Cores da marca",area:"Saturação e brilho",hue:"Matiz",hueValue:"{n} graus",saturation:"Saturação",satValue:"Saturação {n} %",brightness:"Brilho",briValue:"Brilho {n} %",area2D:"Controle 2D",hexField:"Código hexadecimal",eyedropper:"Escolher uma cor da tela",copy:"Copiar"}},g=o=>{var e;return"string"==typeof o?{key:o,name:o,value:o,synthesizedKey:!0}:null!=o.key?{key:o.key,name:o.name,value:o.value}:{key:null!==(e=o.name)&&void 0!==e?e:o.value,name:o.name,value:o.value,synthesizedKey:!0}},b=[{key:"black",name:"Black",value:"#1F1C1B"},{key:"gray",name:"Gray",value:"#585858"},{key:"silver",name:"Silver",value:"#C4C4C4"},{key:"smoke",name:"Smoke",value:"#E3E3E3"},{key:"bone",name:"Bone",value:"#F7F6F0"},{key:"green",name:"Green",value:"#02A270"},{key:"olive",name:"Olive",value:"#AAB43C"},{key:"yellow",name:"Yellow",value:"#FDBF00"},{key:"orange",name:"Orange",value:"#F0821E"},{key:"red",name:"Red",value:"#EB1E1E"},{key:"pink",name:"Pink",value:"#F32A73"},{key:"burgundy",name:"Burgundy",value:"#811137"},{key:"violet",name:"Violet",value:"#5F4BD7"},{key:"electricBlue",name:"Electric blue",value:"#000AFF"},{key:"blue",name:"Blue",value:"#2563EB"},{key:"lightBlue",name:"Light blue",value:"#00BEE6"},{key:"teal",name:"Teal",value:"#00AFAF"}],f=["black","gray","silver","smoke","bone"],x=b.filter((o=>!f.includes(o.key))).map((o=>o.key)),k=new Set(f),_=new Set(x),y=/^#?[0-9a-f]*$/i,w=Object.freeze({h:0,s:100,v:100}),z=o=>o.reduce(((o,e)=>o.concat(e.items)),[]),C=o(class o extends e{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.coChange=r(this,"coChange",7),this.coInput=r(this,"coInput",7),this.inline=!1,this.value="",this.placeholder="Select color",this.disabled=!1,this.required=!1,this.status="default",this.layout="vertical",this.size="md",this.presets="",this.locale="en",this.isOpen=!1,this.copied=!1,this.hsv=w,this.hexDraft="",this.hexEditing=!1,this.areaAxis="s",this.emitted="",this.committed="",this.focusedIndex=0,this.areaDragging=!1,this.handlePopoverOpen=()=>{this.isOpen=!0,this.areaDragging=!1,this.resetHexDraft();const o=this.flatPresets.findIndex((o=>o.value.toUpperCase()===(this.value||"").toUpperCase()));this.focusedIndex=o>=0?o:0},this.handlePopoverClose=()=>{this.isOpen=!1,this.finishHexEdit(),this.restoreTriggerFocus()},this.handleTriggerKeyDown=o=>{this.disabled||("Enter"===o.key||" "===o.key?(o.preventDefault(),this.isOpen=!this.isOpen):"ArrowDown"!==o.key||this.isOpen||(o.preventDefault(),this.isOpen=!0))},this.pointerToHsv=o=>{var e;const r=null===(e=this.areaEl)||void 0===e?void 0:e.getBoundingClientRect();return!!(r&&r.width>0&&r.height>0)&&(this.previewHsv({s:100*Math.min(Math.max((o.clientX-r.left)/r.width,0),1),v:100*(1-Math.min(Math.max((o.clientY-r.top)/r.height,0),1))}),!0)},this.handleAreaPointerDown=o=>{var e,r;this.disabled||0!==o.button||(null===(r=null===(e=this.areaEl)||void 0===e?void 0:e.setPointerCapture)||void 0===r||r.call(e,o.pointerId),this.areaDragging=this.pointerToHsv(o))},this.handleAreaPointerMove=o=>{!this.disabled&&this.areaDragging&&1===o.buttons&&this.pointerToHsv(o)},this.handleAreaPointerCancel=()=>{this.areaDragging=!1},this.handleAreaPointerUp=o=>{this.areaDragging&&0===o.button&&(this.areaDragging=!1,this.disabled||this.commit(c(this.hsv)))},this.handleAreaKeyDown=e=>{if(this.disabled)return;const r=o.AREA_KEYS[e.key];if(!r)return;e.preventDefault();const i=Math.min(100,Math.max(0,this.hsv[r.axis]+r.dir*(e.shiftKey?10:1)));this.focusAxis(r.axis),this.previewHsv({[r.axis]:i}),this.commit(c(this.hsv))},this.handleHueKeyDown=o=>{if(this.disabled||!o.shiftKey)return;const e="ArrowRight"===o.key||"ArrowUp"===o.key?1:"ArrowLeft"===o.key||"ArrowDown"===o.key?-1:0;e&&(o.preventDefault(),this.previewHsv({h:Math.min(360,Math.max(0,this.hsv.h+10*e))}),this.commit(c(this.hsv)))},this.handleGridKeyDown=o=>{var e;if(this.disabled)return;const r=this.presetGroups,i=z(r),t=i.length;if(!t)return;const s=Math.min(Math.max(this.focusedIndex,0),t-1);let c=s;switch(o.key){case"ArrowRight":c=(s+1)%t;break;case"ArrowLeft":c=(s-1+t)%t;break;case"ArrowDown":c=this.verticalNeighbor(r,s,1);break;case"ArrowUp":c=this.verticalNeighbor(r,s,-1);break;case"Home":c=0;break;case"End":c=t-1;break;case"Enter":case" ":return o.preventDefault(),void this.handleSwatchClick(i[s].value);default:return}o.preventDefault(),this.focusedIndex=c,null===(e=this.optionEls()[c])||void 0===e||e.focus()},this.handleHexInput=o=>{var e,r;if(this.disabled)return;const i=o.target,t=this.escapeHex(i.value);if(i.value!==t){const o=null!==(e=i.selectionStart)&&void 0!==e?e:i.value.length,s=Math.min(this.escapeHex(i.value.slice(0,o)).length,t.length);i.value=t,null===(r=i.setSelectionRange)||void 0===r||r.call(i,s,s)}this.hexEditing=!0,this.hexDraft=t,a(t)&&this.previewHex(this.expandHex(t))},this.handleHexBlur=()=>{this.finishHexEdit()},this.handleHexKeyDown=o=>{"Enter"===o.key&&(o.preventDefault(),this.finishHexEdit())},this.handleHexPaste=o=>{var e,r;if(this.disabled)return;const i=(null!==(r=null===(e=o.clipboardData)||void 0===e?void 0:e.getData("text"))&&void 0!==r?r:"").trim(),t=n(i);if(t)return o.preventDefault(),this.hexEditing=!1,this.hexDraft=this.escapeHex(t),void this.commit(t);y.test(i)||o.preventDefault()},this.handleEyeDropper=async()=>{if(this.finishHexEdit(),this.hasEyeDropper)try{const o=window.EyeDropper,{sRGBHex:e}=await(new o).open(),r=n(e);r&&this.commit(r)}catch(o){}}}syncFromValue(o){if(this.syncHexDraft(o),(o||"").toUpperCase()===(this.emitted||"").toUpperCase())return;this.committed=o,this.emitted=o;const e=l(o||"");e&&(this.hsv=e)}componentWillLoad(){this.inline&&this.handlePopoverOpen();const o=l(this.value||"");this.hsv=null!=o?o:w,this.areaAxis="s",this.resetHexDraft(),this.committed=this.value,this.emitted=this.value}previewHsv(o){this.hsv=Object.assign(Object.assign({},this.hsv),o),this.emitPreview(c(this.hsv))}previewHex(o){const e=l(o);e&&(this.hsv=e),this.emitPreview(o)}emitPreview(o){this.emitted=o,this.value=o,this.coInput.emit(o)}commit(o){if(c(this.hsv)!==o){const e=l(o);e&&(this.hsv=e)}this.emitted=o,this.committed=o,this.value=o,this.coChange.emit(o)}get strings(){return function(o){return m[p(o)]}(this.locale)}get parsedPresets(){if(Array.isArray(this.presets))return this.presets.map(g);if("string"==typeof this.presets&&this.presets.trim())try{const o=JSON.parse(this.presets);if(Array.isArray(o))return o.map((o=>g(o)))}catch(o){}return b}get presetGroups(){const o=this.parsedPresets,e=function(o){const e=[],r=[];for(const i of o){if(i.synthesizedKey)return null;if(k.has(i.key))e.push(i);else{if(!_.has(i.key))return null;r.push(i)}}return e.length&&r.length?{neutrals:e,brand:r}:null}(o);return e?[{label:this.strings.groupNeutrals,items:e.neutrals,from:0},{label:this.strings.groupBrand,items:e.brand,from:e.neutrals.length}]:[{label:void 0,items:o,from:0}]}get flatPresets(){return z(this.presetGroups)}restoreTriggerFocus(){var o;const e=document.activeElement;(e===this.el||this.el.contains(e))&&(null===(o=this.triggerEl)||void 0===o||o.focus({preventScroll:!0}))}handleSwatchClick(o){this.disabled||(this.commit(o),this.inline||(this.isOpen=!1,this.restoreTriggerFocus()))}focusAxis(o){this.areaAxis=o;const e="s"===o?this.satEl:this.valEl;e&&(e.removeAttribute("aria-hidden"),e.focus())}optionEls(){var o,e;return Array.from(null!==(e=null===(o=this.gridEl)||void 0===o?void 0:o.querySelectorAll('[role="option"]'))&&void 0!==e?e:[])}verticalNeighbor(o,e,r){const i=o.findIndex((o=>e>=o.from&&e<o.from+o.items.length));if(i<0)return e;const t=o[i],s=e-t.from,c=s%6,a=Math.ceil(t.items.length/6),n=Math.floor(s/6)+r;if(n>=0&&n<a)return t.from+Math.min(6*n+c,t.items.length-1);const l=o[i+r];return l?l.from+Math.min(6*(1===r?0:(Math.ceil(l.items.length/6)||1)-1)+c,l.items.length-1):e}renderArea(){const{h:o,s:e,v:r}=this.hsv,t="s"===this.areaAxis;return i("div",{class:"co-color-picker__area",role:"group","aria-label":this.strings.area,ref:o=>this.areaEl=o,style:{"--co-color-picker-hue":""+o},onPointerDown:this.handleAreaPointerDown,onPointerMove:this.handleAreaPointerMove,onPointerUp:this.handleAreaPointerUp,onPointerCancel:this.handleAreaPointerCancel},i("span",{class:"co-color-picker__area-thumb",role:"presentation",style:{left:e+"%",top:100-r+"%",background:this.value}}),i("input",{type:"range",min:"0",max:"100",step:"1",class:"co-color-picker__channel","data-channel":"s",value:Math.round(e),ref:o=>this.satEl=o,tabIndex:t?0:-1,"aria-hidden":t?void 0:"true","aria-label":this.strings.saturation,"aria-roledescription":this.strings.area2D,"aria-valuetext":d(this.strings.satValue,{n:Math.round(e)}),"aria-orientation":"horizontal",disabled:this.disabled,onFocus:()=>this.areaAxis="s",onInput:o=>this.previewHsv({s:+o.target.value}),onChange:()=>this.commit(c(this.hsv)),onKeyDown:this.handleAreaKeyDown}),i("input",{type:"range",min:"0",max:"100",step:"1",class:"co-color-picker__channel","data-channel":"v",value:Math.round(r),ref:o=>this.valEl=o,tabIndex:t?-1:0,"aria-hidden":t?"true":void 0,"aria-label":this.strings.brightness,"aria-roledescription":this.strings.area2D,"aria-valuetext":d(this.strings.briValue,{n:Math.round(r)}),"aria-orientation":"vertical",disabled:this.disabled,onFocus:()=>this.areaAxis="v",onInput:o=>this.previewHsv({v:+o.target.value}),onChange:()=>this.commit(c(this.hsv)),onKeyDown:this.handleAreaKeyDown}))}renderHue(){return i("input",{type:"range",min:"0",max:"360",step:"1",class:"co-color-picker__hue-input",value:Math.round(this.hsv.h),"aria-label":this.strings.hue,"aria-valuetext":d(this.strings.hueValue,{n:Math.round(this.hsv.h)}),disabled:this.disabled,onInput:o=>this.previewHsv({h:+o.target.value}),onChange:()=>this.commit(c(this.hsv)),onKeyDown:this.handleHueKeyDown})}renderSwatches(){return i("div",{class:"co-color-picker__grid",role:"listbox","aria-label":this.strings.swatches,ref:o=>this.gridEl=o,onKeyDown:this.handleGridKeyDown},this.presetGroups.map((o=>i("div",{class:"co-color-picker__grid-group",key:o.from,role:o.label?"group":"presentation","aria-label":o.label},o.items.map(((e,r)=>{const t=o.from+r,s=e.value.toUpperCase()===(this.value||"").toUpperCase();return i("div",{key:e.value,role:"option","aria-selected":s?"true":"false","aria-label":e.name,title:e.name,tabIndex:t===this.focusedIndex?0:-1,class:{"co-color-picker__grid-item":!0,"co-color-picker__grid-item--selected":s,"co-color-picker__grid-item--light":h(e.value)},style:{background:e.value},onFocus:()=>this.focusedIndex=t,onClick:()=>this.handleSwatchClick(e.value)},s&&i("co-icon",{name:"check",size:16,weight:"bold",class:"co-color-picker__grid-check"}))}))))))}get statusIcon(){return{error:"warning-circle",success:"check-circle",warning:"warning"}[this.status]||null}escapeHex(o){return(o||"").replace(/[^0-9a-f]/gi,"").substring(0,6).toUpperCase()}expandHex(o){const e=o.replace("#","");return"#"+(3===e.length?e[0]+e[0]+e[1]+e[1]+e[2]+e[2]:e).toUpperCase()}resetHexDraft(){this.hexEditing=!1,this.syncHexDraft(this.value)}syncHexDraft(o){this.hexEditing||o&&!a(o)||(this.hexDraft=this.escapeHex(o))}finishHexEdit(){const o=this.hexEditing;if(this.hexEditing=!1,!this.disabled){if(o&&a(this.hexDraft)){const o=this.expandHex(this.hexDraft);return this.commit(o),void this.syncHexDraft(o)}this.revertToCommitted()}}revertToCommitted(){const o=this.committed;this.syncHexDraft(o),o||(this.hsv=w),(this.value||"").toUpperCase()!==(o||"").toUpperCase()&&(this.value=o,this.coInput.emit(o))}get hasEyeDropper(){return"undefined"!=typeof window&&"EyeDropper"in window}renderHexRow(){const o=!!this.value;return i("div",{class:"co-color-picker__hex-row"},i("span",{class:"co-color-picker__hex-prefix"},"#"),i("input",{type:"text",class:"co-color-picker__hex-input",value:this.hexDraft,spellcheck:!1,autocomplete:"off",maxLength:6,"aria-label":this.strings.hexField,disabled:this.disabled,onInput:this.handleHexInput,onBlur:this.handleHexBlur,onKeyDown:this.handleHexKeyDown,onPaste:this.handleHexPaste}),this.hasEyeDropper&&i("button",{type:"button",class:"co-color-picker__eyedropper",title:this.strings.eyedropper,"aria-label":this.strings.eyedropper,disabled:this.disabled,onClick:this.handleEyeDropper},i("co-icon",{name:"eyedropper",size:16})),i("button",{type:"button",class:"co-color-picker__copy-btn "+(this.copied?"co-color-picker__copy-btn--copied":""),title:this.strings.copy,"aria-label":this.strings.copy,disabled:this.disabled||!o,onClick:()=>this.handleCopy()},i("co-icon",{name:this.copied?"check":"copy",size:16})))}async handleCopy(){if(this.value)try{await navigator.clipboard.writeText(this.value),this.copied=!0,setTimeout((()=>{this.copied=!1}),1500)}catch(o){}}render(){const e=!!this.value,r="default"!==this.status?"co-color-picker--"+this.status:"";return this.inline?i("div",{class:`co-color-picker co-color-picker--${this.size} co-color-picker--inline ${r} ${this.disabled?"co-color-picker--disabled":""}`},this.label&&i("span",{class:"co-color-picker__label"},this.label,i(s,{required:this.required})),i("div",{class:"co-color-picker__panel",id:o.PANEL_ID,role:"group","aria-label":this.label||this.placeholder},this.renderArea(),this.renderHue(),this.renderSwatches(),this.renderHexRow()),this.helperText&&i("div",{class:"co-color-picker__helper"},this.statusIcon&&i("co-icon",{name:this.statusIcon,size:14,weight:"fill",class:"co-color-picker__helper-icon"}),i("span",{class:"co-color-picker__helper-text"},this.helperText))):i("div",{class:`co-color-picker co-color-picker--${this.size} ${r} ${this.isOpen?"co-color-picker--open":""} ${this.disabled?"co-color-picker--disabled":""}`},this.label&&i("label",{class:"co-color-picker__label"},this.label,i(s,{required:this.required})),i("co-popover",{open:this.isOpen,placement:"bottom-start",offset:4,onCoOpen:this.handlePopoverOpen,onCoClose:this.handlePopoverClose},i("div",{slot:"trigger",class:"co-color-picker__trigger",role:"combobox","aria-expanded":this.isOpen?"true":"false","aria-haspopup":"dialog","aria-controls":this.isOpen?o.PANEL_ID:void 0,"aria-label":this.label||void 0,"aria-disabled":this.disabled?"true":void 0,tabIndex:this.disabled?-1:0,ref:o=>this.triggerEl=o,onKeyDown:this.handleTriggerKeyDown},i("span",{class:"co-color-picker__swatch",style:{background:e?this.value:"transparent"}}),i("span",{class:"co-color-picker__value "+(e?"":"co-color-picker__value--empty")},e?this.value:this.placeholder)),this.isOpen&&i("div",{class:"co-color-picker__panel",id:o.PANEL_ID,role:"dialog","aria-label":this.label||this.placeholder},this.renderArea(),this.renderHue(),this.renderSwatches(),this.renderHexRow())),this.helperText&&i("div",{class:"co-color-picker__helper"},this.statusIcon&&i("co-icon",{name:this.statusIcon,size:14,weight:"fill",class:"co-color-picker__helper-icon"}),i("span",{class:"co-color-picker__helper-text"},this.helperText)))}get el(){return this}static get watchers(){return{value:[{syncFromValue:0}]}}static get style(){return":host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-color-picker{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-color-picker--disabled{opacity:0.5;pointer-events:none}.co-color-picker__label{font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-secondary);padding:0 var(--co-spacing-xs)}.co-field-required{margin-left:2px;color:var(--co-semantic-text-error, var(--co-color-status-error))}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}.co-color-picker co-popover{display:block;width:100%}.co-color-picker__trigger{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-field);border-radius:var(--co-border-radius-xs);min-height:40px;box-sizing:border-box;cursor:pointer;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-color-picker--s .co-color-picker__trigger{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-color-picker--sm .co-color-picker__trigger{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-14)}.co-color-picker--lg .co-color-picker__trigger{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-color-picker--s .co-color-picker__swatch,.co-color-picker--sm .co-color-picker__swatch{width:18px;height:18px}.co-color-picker__trigger:hover{border-color:var(--co-semantic-border-default)}.co-color-picker--open .co-color-picker__trigger{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px color-mix(in srgb, var(--co-semantic-border-focus) 15%, transparent)}.co-color-picker__trigger:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px color-mix(in srgb, var(--co-semantic-border-focus) 15%, transparent)}.co-color-picker--error .co-color-picker__trigger{border-color:var(--co-semantic-border-error, var(--co-color-status-error))}.co-color-picker__swatch{width:22px;height:22px;box-sizing:border-box;border-radius:var(--co-border-radius-full);border:1px solid var(--co-semantic-border-subtle);flex-shrink:0}.co-color-picker__value{flex:1;font-size:inherit;font-family:inherit;color:var(--co-semantic-text-default);font-weight:500;text-transform:uppercase}.co-color-picker__value--empty{color:var(--co-semantic-text-muted);font-weight:400}.co-color-picker__panel{padding:var(--co-spacing-md);display:flex;flex-direction:column;gap:var(--co-spacing-md)}.co-color-picker--inline .co-color-picker__panel{padding:0}.co-color-picker__area{position:relative;height:132px;border-radius:var(--co-border-radius-xxs);cursor:crosshair;touch-action:none;background:linear-gradient(to top, black, transparent), linear-gradient(to right, white, transparent), hsl(var(--co-color-picker-hue, 0) 100% 50%)}.co-color-picker__area-thumb{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:var(--co-border-radius-full);border:2px solid var(--co-semantic-surface-page);box-shadow:0 0 0 1px var(--co-semantic-border-default);box-sizing:border-box;pointer-events:none}.co-color-picker__channel{position:absolute;inset:0;opacity:0;pointer-events:none;margin:0}.co-color-picker__area:focus-within{outline:2px solid var(--co-semantic-border-focus);outline-offset:2px}.co-color-picker__hue-input{width:100%;height:12px;margin:0;appearance:none;-webkit-appearance:none;border-radius:var(--co-border-radius-full);background:linear-gradient(to right, hsl(0 100% 50%), hsl(60 100% 50%), hsl(120 100% 50%), hsl(180 100% 50%), hsl(240 100% 50%), hsl(300 100% 50%), hsl(360 100% 50%));cursor:pointer}.co-color-picker__hue-input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:16px;height:16px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-page);box-shadow:0 0 0 1px var(--co-semantic-border-default);cursor:grab}.co-color-picker__hue-input::-moz-range-thumb{width:16px;height:16px;border:none;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-page);box-shadow:0 0 0 1px var(--co-semantic-border-default)}.co-color-picker__hue-input:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:2px}.co-color-picker__grid{display:flex;flex-direction:column;gap:var(--co-spacing-md)}.co-color-picker__grid-group{display:grid;grid-template-columns:repeat(6, 32px);gap:var(--co-spacing-sm2)}.co-color-picker__grid-item{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--co-border-radius-xxs);border:2px solid transparent;cursor:pointer;box-sizing:border-box;transition:transform var(--co-motion-duration-fast) var(--co-motion-ease-out), border-color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-color-picker__grid-item:hover{transform:scale(1.1)}.co-color-picker__grid-item--selected{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px color-mix(in srgb, var(--co-semantic-border-focus) 25%, transparent)}.co-color-picker__grid-item--light{box-shadow:inset 0 0 0 1px var(--co-semantic-border-default)}.co-color-picker__grid-item--light.co-color-picker__grid-item--selected{box-shadow:inset 0 0 0 1px var(--co-semantic-border-default), 0 0 0 2px color-mix(in srgb, var(--co-semantic-border-focus) 25%, transparent)}.co-color-picker__grid-item:focus-visible{outline:none;box-shadow:0 0 0 2px var(--co-semantic-surface-page), 0 0 0 4px var(--co-semantic-border-focus)}.co-color-picker__grid-item--light:focus-visible{box-shadow:inset 0 0 0 1px var(--co-semantic-border-default), 0 0 0 2px var(--co-semantic-surface-page), 0 0 0 4px var(--co-semantic-border-focus)}.co-color-picker__grid-check{color:var(--co-color-base-blanco)}.co-color-picker__grid-item--light .co-color-picker__grid-check{color:var(--co-color-base-negro)}.co-color-picker__hex-row{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-xs) var(--co-spacing-sm);background:var(--co-semantic-surface-secondary);border:1px solid var(--co-semantic-border-subtle);border-radius:var(--co-border-radius-xxs)}.co-color-picker__hex-prefix{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:500}.co-color-picker__hex-row:has(>.co-color-picker__hex-input:focus){border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-color-picker__hex-input{flex:1;min-width:0;box-sizing:border-box;border:none;background:transparent;padding:0;font-size:var(--co-font-size-14);font-family:var(--co-font-family-mono, monospace);color:var(--co-semantic-text-default);text-transform:uppercase}.co-color-picker__hex-input:focus,.co-color-picker__hex-input:focus-visible{outline:none}.co-color-picker__hex-input:disabled{color:var(--co-semantic-text-muted);cursor:not-allowed;opacity:1;-webkit-text-fill-color:var(--co-semantic-text-muted)}.co-color-picker__eyedropper{display:flex;align-items:center;justify-content:center;padding:var(--co-spacing-xs);border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);border-radius:var(--co-border-radius-xxs);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-color-picker__eyedropper:hover:not(:disabled){color:var(--co-semantic-text-default);background:var(--co-semantic-surface-hover)}.co-color-picker__eyedropper:focus-visible{outline:none;box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-color-picker__eyedropper:disabled{cursor:not-allowed;opacity:0.5}.co-color-picker__copy-btn{display:flex;align-items:center;justify-content:center;padding:var(--co-spacing-xs);border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);border-radius:var(--co-border-radius-xxs);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-color-picker__copy-btn:hover:not(:disabled){color:var(--co-semantic-text-default);background:var(--co-semantic-surface-hover)}.co-color-picker__copy-btn:focus-visible{outline:none;box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-color-picker__copy-btn:disabled{cursor:not-allowed;opacity:0.5}.co-color-picker__copy-btn--copied{color:var(--co-semantic-text-success, var(--co-color-status-success))}.co-color-picker__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted);padding:0 var(--co-spacing-xs)}.co-color-picker__helper-icon{flex-shrink:0;display:flex;align-items:center}.co-color-picker--error .co-color-picker__helper{color:var(--co-semantic-text-error, var(--co-semantic-status-error))}:host([layout='horizontal']) .co-color-picker{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-color-picker__label{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-color-picker__label{white-space:normal}:host([layout='horizontal']) .co-color-picker>:not(.co-color-picker__label){grid-column:2;min-width:0}"}},[1,"co-color-picker",{inline:[516],value:[1025],label:[1],placeholder:[1],disabled:[4],required:[4],status:[1],helperText:[1,"helper-text"],layout:[513],size:[513],name:[1],presets:[1],locale:[1],isOpen:[32],copied:[32],hsv:[32],hexDraft:[32],areaAxis:[32],focusedIndex:[32]},void 0,{value:[{syncFromValue:0}]}]);function A(){"undefined"!=typeof customElements&&["co-color-picker","co-icon","co-popover"].forEach((o=>{switch(o){case"co-color-picker":customElements.get(t(o))||customElements.define(t(o),C);break;case"co-icon":customElements.get(t(o))||u();break;case"co-popover":customElements.get(t(o))||v()}}))}C.PANEL_ID="co-color-picker-panel",C.AREA_KEYS={ArrowRight:{axis:"s",dir:1},ArrowLeft:{axis:"s",dir:-1},ArrowUp:{axis:"v",dir:1},ArrowDown:{axis:"v",dir:-1}},A();const E=C,M=A;export{E as CoColorPicker,M as defineCustomElement}
1
+ import{p as o,H as e,c as r,h as i,t}from"./index.js";import{R as s}from"./p-CWneqh4n.js";import{h as c,a,b as n,c as l,i as h}from"./p-BzxEh7sq.js";import{l as p,f as d}from"./p-z0tbse7d.js";import{d as u}from"./p-qMNHMnvI.js";import{d as v}from"./p-xA7AfoIW.js";const m={en:{swatches:"Color presets",groupNeutrals:"Neutrals",groupBrand:"Brand colors",area:"Saturation and brightness",hue:"Hue",hueValue:"{n} degrees",saturation:"Saturation",satValue:"Saturation {n}%",brightness:"Brightness",briValue:"Brightness {n}%",area2D:"2D slider",hexField:"Hex code",eyedropper:"Pick a color from the screen",copy:"Copy"},es:{swatches:"Colores predefinidos",groupNeutrals:"Neutros",groupBrand:"Colores de marca",area:"Saturación y brillo",hue:"Matiz",hueValue:"{n} grados",saturation:"Saturación",satValue:"Saturación {n} %",brightness:"Brillo",briValue:"Brillo {n} %",area2D:"Control 2D",hexField:"Código hexadecimal",eyedropper:"Elegir un color de la pantalla",copy:"Copiar"},pt:{swatches:"Cores predefinidas",groupNeutrals:"Neutros",groupBrand:"Cores da marca",area:"Saturação e brilho",hue:"Matiz",hueValue:"{n} graus",saturation:"Saturação",satValue:"Saturação {n} %",brightness:"Brilho",briValue:"Brilho {n} %",area2D:"Controle 2D",hexField:"Código hexadecimal",eyedropper:"Escolher uma cor da tela",copy:"Copiar"}},g=o=>{var e;return"string"==typeof o?{key:o,name:o,value:o,synthesizedKey:!0}:null!=o.key?{key:o.key,name:o.name,value:o.value}:{key:null!==(e=o.name)&&void 0!==e?e:o.value,name:o.name,value:o.value,synthesizedKey:!0}},b=[{key:"black",name:"Black",value:"#1F1C1B"},{key:"gray",name:"Gray",value:"#585858"},{key:"silver",name:"Silver",value:"#C4C4C4"},{key:"smoke",name:"Smoke",value:"#E3E3E3"},{key:"bone",name:"Bone",value:"#F7F6F0"},{key:"green",name:"Green",value:"#02A270"},{key:"olive",name:"Olive",value:"#AAB43C"},{key:"yellow",name:"Yellow",value:"#FDBF00"},{key:"orange",name:"Orange",value:"#F0821E"},{key:"red",name:"Red",value:"#EB1E1E"},{key:"pink",name:"Pink",value:"#F32A73"},{key:"burgundy",name:"Burgundy",value:"#811137"},{key:"violet",name:"Violet",value:"#5F4BD7"},{key:"electricBlue",name:"Electric blue",value:"#000AFF"},{key:"blue",name:"Blue",value:"#2563EB"},{key:"lightBlue",name:"Light blue",value:"#00BEE6"},{key:"teal",name:"Teal",value:"#00AFAF"}],f=["black","gray","silver","smoke","bone"],x=b.filter((o=>!f.includes(o.key))).map((o=>o.key)),k=new Set(f),_=new Set(x),y=/^#?[0-9a-f]*$/i,w=Object.freeze({h:0,s:100,v:100}),z=o=>o.reduce(((o,e)=>o.concat(e.items)),[]),C=o(class o extends e{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.coChange=r(this,"coChange",7),this.coInput=r(this,"coInput",7),this.inline=!1,this.value="",this.placeholder="Select color",this.disabled=!1,this.required=!1,this.status="default",this.layout="vertical",this.size="md",this.presets="",this.locale="en",this.isOpen=!1,this.copied=!1,this.hsv=w,this.hexDraft="",this.hexEditing=!1,this.areaAxis="s",this.emitted="",this.committed="",this.focusedIndex=0,this.areaDragging=!1,this.handlePopoverOpen=()=>{this.isOpen=!0,this.areaDragging=!1,this.resetHexDraft();const o=this.flatPresets.findIndex((o=>o.value.toUpperCase()===(this.value||"").toUpperCase()));this.focusedIndex=o>=0?o:0},this.handlePopoverClose=()=>{this.isOpen=!1,this.finishHexEdit(),this.restoreTriggerFocus()},this.handleTriggerKeyDown=o=>{this.disabled||("Enter"===o.key||" "===o.key?(o.preventDefault(),this.isOpen=!this.isOpen):"ArrowDown"!==o.key||this.isOpen||(o.preventDefault(),this.isOpen=!0))},this.pointerToHsv=o=>{var e;const r=null===(e=this.areaEl)||void 0===e?void 0:e.getBoundingClientRect();return!!(r&&r.width>0&&r.height>0)&&(this.previewHsv({s:100*Math.min(Math.max((o.clientX-r.left)/r.width,0),1),v:100*(1-Math.min(Math.max((o.clientY-r.top)/r.height,0),1))}),!0)},this.handleAreaPointerDown=o=>{var e,r;this.disabled||0!==o.button||(null===(r=null===(e=this.areaEl)||void 0===e?void 0:e.setPointerCapture)||void 0===r||r.call(e,o.pointerId),this.areaDragging=this.pointerToHsv(o))},this.handleAreaPointerMove=o=>{!this.disabled&&this.areaDragging&&1===o.buttons&&this.pointerToHsv(o)},this.handleAreaPointerCancel=()=>{this.areaDragging=!1},this.handleAreaPointerUp=o=>{this.areaDragging&&0===o.button&&(this.areaDragging=!1,this.disabled||this.commit(c(this.hsv)))},this.handleAreaKeyDown=e=>{if(this.disabled)return;const r=o.AREA_KEYS[e.key];if(!r)return;e.preventDefault();const i=Math.min(100,Math.max(0,this.hsv[r.axis]+r.dir*(e.shiftKey?10:1)));this.focusAxis(r.axis),this.previewHsv({[r.axis]:i}),this.commit(c(this.hsv))},this.handleHueKeyDown=o=>{if(this.disabled||!o.shiftKey)return;const e="ArrowRight"===o.key||"ArrowUp"===o.key?1:"ArrowLeft"===o.key||"ArrowDown"===o.key?-1:0;e&&(o.preventDefault(),this.previewHsv({h:Math.min(360,Math.max(0,this.hsv.h+10*e))}),this.commit(c(this.hsv)))},this.handleGridKeyDown=o=>{var e;if(this.disabled)return;const r=this.presetGroups,i=z(r),t=i.length;if(!t)return;const s=Math.min(Math.max(this.focusedIndex,0),t-1);let c=s;switch(o.key){case"ArrowRight":c=(s+1)%t;break;case"ArrowLeft":c=(s-1+t)%t;break;case"ArrowDown":c=this.verticalNeighbor(r,s,1);break;case"ArrowUp":c=this.verticalNeighbor(r,s,-1);break;case"Home":c=0;break;case"End":c=t-1;break;case"Enter":case" ":return o.preventDefault(),void this.handleSwatchClick(i[s].value);default:return}o.preventDefault(),this.focusedIndex=c,null===(e=this.optionEls()[c])||void 0===e||e.focus()},this.handleHexInput=o=>{var e,r;if(this.disabled)return;const i=o.target,t=this.escapeHex(i.value);if(i.value!==t){const o=null!==(e=i.selectionStart)&&void 0!==e?e:i.value.length,s=Math.min(this.escapeHex(i.value.slice(0,o)).length,t.length);i.value=t,null===(r=i.setSelectionRange)||void 0===r||r.call(i,s,s)}this.hexEditing=!0,this.hexDraft=t,a(t)&&this.previewHex(this.expandHex(t))},this.handleHexBlur=()=>{this.finishHexEdit()},this.handleHexKeyDown=o=>{"Enter"===o.key&&(o.preventDefault(),this.finishHexEdit())},this.handleHexPaste=o=>{var e,r;if(this.disabled)return;const i=(null!==(r=null===(e=o.clipboardData)||void 0===e?void 0:e.getData("text"))&&void 0!==r?r:"").trim(),t=n(i);if(t)return o.preventDefault(),this.hexEditing=!1,this.hexDraft=this.escapeHex(t),void this.commit(t);y.test(i)||o.preventDefault()},this.handleEyeDropper=async()=>{if(this.finishHexEdit(),this.hasEyeDropper)try{const o=window.EyeDropper,{sRGBHex:e}=await(new o).open(),r=n(e);r&&this.commit(r)}catch(o){}}}syncFromValue(o){if(this.syncHexDraft(o),(o||"").toUpperCase()===(this.emitted||"").toUpperCase())return;this.committed=o,this.emitted=o;const e=l(o||"");e&&(this.hsv=e)}componentWillLoad(){this.inline&&this.handlePopoverOpen();const o=l(this.value||"");this.hsv=null!=o?o:w,this.areaAxis="s",this.resetHexDraft(),this.committed=this.value,this.emitted=this.value}previewHsv(o){this.hsv=Object.assign(Object.assign({},this.hsv),o),this.emitPreview(c(this.hsv))}previewHex(o){const e=l(o);e&&(this.hsv=e),this.emitPreview(o)}emitPreview(o){this.emitted=o,this.value=o,this.coInput.emit(o)}commit(o){if(c(this.hsv)!==o){const e=l(o);e&&(this.hsv=e)}this.emitted=o,this.committed=o,this.value=o,this.coChange.emit(o)}get strings(){return function(o){return m[p(o)]}(this.locale)}get parsedPresets(){if(Array.isArray(this.presets))return this.presets.map(g);if("string"==typeof this.presets&&this.presets.trim())try{const o=JSON.parse(this.presets);if(Array.isArray(o))return o.map((o=>g(o)))}catch(o){}return b}get presetGroups(){const o=this.parsedPresets,e=function(o){const e=[],r=[];for(const i of o){if(i.synthesizedKey)return null;if(k.has(i.key))e.push(i);else{if(!_.has(i.key))return null;r.push(i)}}return e.length&&r.length?{neutrals:e,brand:r}:null}(o);return e?[{label:this.strings.groupNeutrals,items:e.neutrals,from:0},{label:this.strings.groupBrand,items:e.brand,from:e.neutrals.length}]:[{label:void 0,items:o,from:0}]}get flatPresets(){return z(this.presetGroups)}restoreTriggerFocus(){var o;const e=document.activeElement;(e===this.el||this.el.contains(e))&&(null===(o=this.triggerEl)||void 0===o||o.focus({preventScroll:!0}))}handleSwatchClick(o){this.disabled||(this.commit(o),this.inline||(this.isOpen=!1,this.restoreTriggerFocus()))}focusAxis(o){this.areaAxis=o;const e="s"===o?this.satEl:this.valEl;e&&(e.removeAttribute("aria-hidden"),e.focus())}optionEls(){var o,e;return Array.from(null!==(e=null===(o=this.gridEl)||void 0===o?void 0:o.querySelectorAll('[role="option"]'))&&void 0!==e?e:[])}verticalNeighbor(o,e,r){const i=o.findIndex((o=>e>=o.from&&e<o.from+o.items.length));if(i<0)return e;const t=o[i],s=e-t.from,c=s%6,a=Math.ceil(t.items.length/6),n=Math.floor(s/6)+r;if(n>=0&&n<a)return t.from+Math.min(6*n+c,t.items.length-1);const l=o[i+r];return l?l.from+Math.min(6*(1===r?0:(Math.ceil(l.items.length/6)||1)-1)+c,l.items.length-1):e}renderArea(){const{h:o,s:e,v:r}=this.hsv,t="s"===this.areaAxis;return i("div",{class:"co-color-picker__area",role:"group","aria-label":this.strings.area,ref:o=>this.areaEl=o,style:{"--co-color-picker-hue":""+o},onPointerDown:this.handleAreaPointerDown,onPointerMove:this.handleAreaPointerMove,onPointerUp:this.handleAreaPointerUp,onPointerCancel:this.handleAreaPointerCancel},i("span",{class:"co-color-picker__area-thumb",role:"presentation",style:{left:e+"%",top:100-r+"%",background:this.value}}),i("input",{type:"range",min:"0",max:"100",step:"1",class:"co-color-picker__channel","data-channel":"s",value:Math.round(e),ref:o=>this.satEl=o,tabIndex:t?0:-1,"aria-hidden":t?void 0:"true","aria-label":this.strings.saturation,"aria-roledescription":this.strings.area2D,"aria-valuetext":d(this.strings.satValue,{n:Math.round(e)}),"aria-orientation":"horizontal",disabled:this.disabled,onFocus:()=>this.areaAxis="s",onInput:o=>this.previewHsv({s:+o.target.value}),onChange:()=>this.commit(c(this.hsv)),onKeyDown:this.handleAreaKeyDown}),i("input",{type:"range",min:"0",max:"100",step:"1",class:"co-color-picker__channel","data-channel":"v",value:Math.round(r),ref:o=>this.valEl=o,tabIndex:t?-1:0,"aria-hidden":t?"true":void 0,"aria-label":this.strings.brightness,"aria-roledescription":this.strings.area2D,"aria-valuetext":d(this.strings.briValue,{n:Math.round(r)}),"aria-orientation":"vertical",disabled:this.disabled,onFocus:()=>this.areaAxis="v",onInput:o=>this.previewHsv({v:+o.target.value}),onChange:()=>this.commit(c(this.hsv)),onKeyDown:this.handleAreaKeyDown}))}renderHue(){return i("input",{type:"range",min:"0",max:"360",step:"1",class:"co-color-picker__hue-input",value:Math.round(this.hsv.h),"aria-label":this.strings.hue,"aria-valuetext":d(this.strings.hueValue,{n:Math.round(this.hsv.h)}),disabled:this.disabled,onInput:o=>this.previewHsv({h:+o.target.value}),onChange:()=>this.commit(c(this.hsv)),onKeyDown:this.handleHueKeyDown})}renderSwatches(){return i("div",{class:"co-color-picker__grid",role:"listbox","aria-label":this.strings.swatches,ref:o=>this.gridEl=o,onKeyDown:this.handleGridKeyDown},this.presetGroups.map((o=>i("div",{class:"co-color-picker__grid-group",key:o.from,role:o.label?"group":"presentation","aria-label":o.label},o.items.map(((e,r)=>{const t=o.from+r,s=e.value.toUpperCase()===(this.value||"").toUpperCase();return i("div",{key:e.value,role:"option","aria-selected":s?"true":"false","aria-label":e.name,title:e.name,tabIndex:t===this.focusedIndex?0:-1,class:{"co-color-picker__grid-item":!0,"co-color-picker__grid-item--selected":s,"co-color-picker__grid-item--light":h(e.value)},style:{background:e.value},onFocus:()=>this.focusedIndex=t,onClick:()=>this.handleSwatchClick(e.value)},s&&i("co-icon",{name:"check",size:16,weight:"bold",class:"co-color-picker__grid-check"}))}))))))}get statusIcon(){return{error:"warning-circle",success:"check-circle",warning:"warning"}[this.status]||null}escapeHex(o){return(o||"").replace(/[^0-9a-f]/gi,"").substring(0,6).toUpperCase()}expandHex(o){const e=o.replace("#","");return"#"+(3===e.length?e[0]+e[0]+e[1]+e[1]+e[2]+e[2]:e).toUpperCase()}resetHexDraft(){this.hexEditing=!1,this.syncHexDraft(this.value)}syncHexDraft(o){this.hexEditing||o&&!a(o)||(this.hexDraft=this.escapeHex(o))}finishHexEdit(){const o=this.hexEditing;if(this.hexEditing=!1,!this.disabled){if(o&&a(this.hexDraft)){const o=this.expandHex(this.hexDraft);return this.commit(o),void this.syncHexDraft(o)}this.revertToCommitted()}}revertToCommitted(){const o=this.committed;this.syncHexDraft(o),o||(this.hsv=w),(this.value||"").toUpperCase()!==(o||"").toUpperCase()&&(this.value=o,this.coInput.emit(o))}get hasEyeDropper(){return"undefined"!=typeof window&&"EyeDropper"in window}renderHexRow(){const o=!!this.value;return i("div",{class:"co-color-picker__hex-row"},i("span",{class:"co-color-picker__hex-prefix"},"#"),i("input",{type:"text",class:"co-color-picker__hex-input",value:this.hexDraft,spellcheck:!1,autocomplete:"off",maxLength:6,"aria-label":this.strings.hexField,disabled:this.disabled,onInput:this.handleHexInput,onBlur:this.handleHexBlur,onKeyDown:this.handleHexKeyDown,onPaste:this.handleHexPaste}),this.hasEyeDropper&&i("button",{type:"button",class:"co-color-picker__eyedropper",title:this.strings.eyedropper,"aria-label":this.strings.eyedropper,disabled:this.disabled,onClick:this.handleEyeDropper},i("co-icon",{name:"eyedropper",size:16})),i("button",{type:"button",class:"co-color-picker__copy-btn "+(this.copied?"co-color-picker__copy-btn--copied":""),title:this.strings.copy,"aria-label":this.strings.copy,disabled:this.disabled||!o,onClick:()=>this.handleCopy()},i("co-icon",{name:this.copied?"check":"copy",size:16})))}async handleCopy(){if(this.value)try{await navigator.clipboard.writeText(this.value),this.copied=!0,setTimeout((()=>{this.copied=!1}),1500)}catch(o){}}render(){const e=!!this.value,r="default"!==this.status?"co-color-picker--"+this.status:"";return this.inline?i("div",{class:`co-color-picker co-color-picker--${this.size} co-color-picker--inline ${r} ${this.disabled?"co-color-picker--disabled":""}`},this.label&&i("span",{class:"co-color-picker__label"},this.label,i(s,{required:this.required})),i("div",{class:"co-color-picker__panel",id:o.PANEL_ID,role:"group","aria-label":this.label||this.placeholder},this.renderArea(),this.renderHue(),this.renderSwatches(),this.renderHexRow()),this.helperText&&i("div",{class:"co-color-picker__helper"},this.statusIcon&&i("co-icon",{name:this.statusIcon,size:14,weight:"fill",class:"co-color-picker__helper-icon"}),i("span",{class:"co-color-picker__helper-text"},this.helperText))):i("div",{class:`co-color-picker co-color-picker--${this.size} ${r} ${this.isOpen?"co-color-picker--open":""} ${this.disabled?"co-color-picker--disabled":""}`},this.label&&i("label",{class:"co-color-picker__label"},this.label,i(s,{required:this.required})),i("co-popover",{open:this.isOpen,placement:"bottom-start",offset:4,onCoOpen:this.handlePopoverOpen,onCoClose:this.handlePopoverClose},i("div",{slot:"trigger",class:"co-color-picker__trigger",role:"combobox","aria-expanded":this.isOpen?"true":"false","aria-haspopup":"dialog","aria-controls":this.isOpen?o.PANEL_ID:void 0,"aria-label":this.label||void 0,"aria-disabled":this.disabled?"true":void 0,tabIndex:this.disabled?-1:0,ref:o=>this.triggerEl=o,onKeyDown:this.handleTriggerKeyDown},i("span",{class:"co-color-picker__swatch",style:{background:e?this.value:"transparent"}}),i("span",{class:"co-color-picker__value "+(e?"":"co-color-picker__value--empty")},e?this.value:this.placeholder)),this.isOpen&&i("div",{class:"co-color-picker__panel",id:o.PANEL_ID,role:"dialog","aria-label":this.label||this.placeholder},this.renderArea(),this.renderHue(),this.renderSwatches(),this.renderHexRow())),this.helperText&&i("div",{class:"co-color-picker__helper"},this.statusIcon&&i("co-icon",{name:this.statusIcon,size:14,weight:"fill",class:"co-color-picker__helper-icon"}),i("span",{class:"co-color-picker__helper-text"},this.helperText)))}get el(){return this}static get watchers(){return{value:[{syncFromValue:0}]}}static get style(){return":host{display:block;font-family:var(--co-font-family-primary);font-size:var(--co-font-size-14);letter-spacing:var(--co-font-letter-spacing-body);line-height:1}.co-color-picker{display:flex;flex-direction:column;gap:var(--co-spacing-sm2)}.co-color-picker--disabled{opacity:0.5;pointer-events:none}.co-color-picker__label{font-size:var(--co-font-size-14);font-weight:400;color:var(--co-semantic-text-secondary);padding:0 var(--co-spacing-xs)}.co-field-required{margin-left:2px;color:var(--co-semantic-text-error, var(--co-color-status-error))}.co-field-required__caption{margin-left:4px;color:var(--co-semantic-text-muted);font-size:var(--co-font-size-12);font-weight:400}.co-field-required__caption::before{content:var(--co-field-required-text, ' (required)')}.co-color-picker co-popover{display:block;width:100%}.co-color-picker__trigger{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-sm2) var(--co-spacing-md);background:var(--co-semantic-surface-page);border:1px solid var(--co-semantic-border-field);border-radius:var(--co-border-radius-xs);min-height:40px;box-sizing:border-box;cursor:pointer;transition:border-color var(--co-motion-duration-fast) var(--co-motion-ease-out), box-shadow var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-color-picker--s .co-color-picker__trigger{min-height:28px;padding:var(--co-spacing-xxs) var(--co-spacing-sm);font-size:var(--co-font-size-12)}.co-color-picker--sm .co-color-picker__trigger{min-height:32px;padding:var(--co-spacing-xs) var(--co-spacing-sm);font-size:var(--co-font-size-14)}.co-color-picker--lg .co-color-picker__trigger{min-height:48px;padding:var(--co-spacing-sm) var(--co-spacing-lg);font-size:var(--co-font-size-16)}.co-color-picker--s .co-color-picker__swatch,.co-color-picker--sm .co-color-picker__swatch{width:18px;height:18px}.co-color-picker__trigger:hover{border-color:var(--co-semantic-border-default)}.co-color-picker--open .co-color-picker__trigger{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px color-mix(in srgb, var(--co-semantic-border-focus) 15%, transparent)}.co-color-picker__trigger:focus-visible{outline:none;border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px color-mix(in srgb, var(--co-semantic-border-focus) 15%, transparent)}.co-color-picker--error .co-color-picker__trigger{border-color:var(--co-semantic-border-error, var(--co-color-status-error))}.co-color-picker__swatch{width:22px;height:22px;box-sizing:border-box;border-radius:var(--co-border-radius-full);border:1px solid var(--co-semantic-border-subtle);flex-shrink:0}.co-color-picker__value{flex:1;font-size:inherit;font-family:inherit;color:var(--co-semantic-text-default);font-weight:500;text-transform:uppercase}.co-color-picker__value--empty{color:var(--co-semantic-text-muted);font-weight:400}.co-color-picker__panel{padding:var(--co-spacing-md);display:flex;flex-direction:column;gap:var(--co-spacing-md)}.co-color-picker--inline .co-color-picker__panel{padding:0}.co-color-picker__area{position:relative;height:132px;border-radius:var(--co-border-radius-xxs);cursor:crosshair;touch-action:none;background:linear-gradient(to top, black, transparent), linear-gradient(to right, white, transparent), hsl(var(--co-color-picker-hue, 0) 100% 50%)}.co-color-picker__area-thumb{position:absolute;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:var(--co-border-radius-full);border:2px solid var(--co-semantic-surface-page);box-shadow:0 0 0 1px var(--co-semantic-border-default);box-sizing:border-box;pointer-events:none}.co-color-picker__channel{position:absolute;inset:0;opacity:0;pointer-events:none;margin:0}.co-color-picker__area:focus-within{outline:2px solid var(--co-semantic-border-focus);outline-offset:2px}.co-color-picker__hue-input{width:100%;height:12px;margin:0;appearance:none;-webkit-appearance:none;border-radius:var(--co-border-radius-full);background:linear-gradient(to right, hsl(0 100% 50%), hsl(60 100% 50%), hsl(120 100% 50%), hsl(180 100% 50%), hsl(240 100% 50%), hsl(300 100% 50%), hsl(360 100% 50%));cursor:pointer}.co-color-picker__hue-input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:16px;height:16px;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-page);box-shadow:0 0 0 1px var(--co-semantic-border-default);cursor:grab}.co-color-picker__hue-input::-moz-range-thumb{width:16px;height:16px;border:none;border-radius:var(--co-border-radius-full);background:var(--co-semantic-surface-page);box-shadow:0 0 0 1px var(--co-semantic-border-default)}.co-color-picker__hue-input:focus-visible{outline:2px solid var(--co-semantic-border-focus);outline-offset:2px}.co-color-picker__grid{display:flex;flex-direction:column;gap:var(--co-spacing-md)}.co-color-picker__grid-group{display:grid;grid-template-columns:repeat(6, 32px);gap:var(--co-spacing-sm2)}.co-color-picker__grid-item{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:var(--co-border-radius-xxs);border:2px solid transparent;cursor:pointer;box-sizing:border-box;transition:transform var(--co-motion-duration-fast) var(--co-motion-ease-out), border-color var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-color-picker__grid-item:hover{transform:scale(1.1)}.co-color-picker__grid-item--selected{border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px color-mix(in srgb, var(--co-semantic-border-focus) 25%, transparent)}.co-color-picker__grid-item--light{box-shadow:inset 0 0 0 1px var(--co-semantic-border-default)}.co-color-picker__grid-item--light.co-color-picker__grid-item--selected{box-shadow:inset 0 0 0 1px var(--co-semantic-border-default), 0 0 0 2px color-mix(in srgb, var(--co-semantic-border-focus) 25%, transparent)}.co-color-picker__grid-item:focus-visible{outline:none;box-shadow:0 0 0 2px var(--co-semantic-surface-page), 0 0 0 4px var(--co-semantic-border-focus)}.co-color-picker__grid-item--light:focus-visible{box-shadow:inset 0 0 0 1px var(--co-semantic-border-default), 0 0 0 2px var(--co-semantic-surface-page), 0 0 0 4px var(--co-semantic-border-focus)}.co-color-picker__grid-check{color:var(--co-color-base-blanco)}.co-color-picker__grid-item--light .co-color-picker__grid-check{color:var(--co-color-base-negro)}.co-color-picker__hex-row{display:flex;align-items:center;gap:var(--co-spacing-sm2);padding:var(--co-spacing-xs) var(--co-spacing-sm);background:var(--co-semantic-surface-secondary);border:1px solid var(--co-semantic-border-subtle);border-radius:var(--co-border-radius-xxs)}.co-color-picker__hex-prefix{color:var(--co-semantic-text-muted);font-size:var(--co-font-size-14);font-weight:500}.co-color-picker__hex-row:has(>.co-color-picker__hex-input:focus){border-color:var(--co-semantic-border-focus);box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-color-picker__hex-input{flex:1;min-width:0;box-sizing:border-box;border:none;background:transparent;padding:0;font-size:var(--co-font-size-14);font-family:var(--co-font-family-mono, monospace);color:var(--co-semantic-text-default);text-transform:uppercase}.co-color-picker__hex-input:focus,.co-color-picker__hex-input:focus-visible{outline:none}.co-color-picker__hex-input:disabled{color:var(--co-semantic-text-muted);cursor:not-allowed;opacity:1;-webkit-text-fill-color:var(--co-semantic-text-muted)}.co-color-picker__eyedropper{display:flex;align-items:center;justify-content:center;padding:var(--co-spacing-xs);border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);border-radius:var(--co-border-radius-xxs);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-color-picker__eyedropper:hover:not(:disabled){color:var(--co-semantic-text-default);background:var(--co-semantic-surface-hover)}.co-color-picker__eyedropper:focus-visible{outline:none;box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-color-picker__eyedropper:disabled{cursor:not-allowed;opacity:0.5}.co-color-picker__copy-btn{display:flex;align-items:center;justify-content:center;padding:var(--co-spacing-xs);border:none;background:transparent;cursor:pointer;color:var(--co-semantic-text-muted);border-radius:var(--co-border-radius-xxs);transition:color var(--co-motion-duration-fast) var(--co-motion-ease-out), background var(--co-motion-duration-fast) var(--co-motion-ease-out)}.co-color-picker__copy-btn:hover:not(:disabled){color:var(--co-semantic-text-default);background:var(--co-semantic-surface-hover)}.co-color-picker__copy-btn:focus-visible{outline:none;box-shadow:0 0 0 2px var(--co-semantic-border-focus-ring)}.co-color-picker__copy-btn:disabled{cursor:not-allowed;opacity:0.5}.co-color-picker__copy-btn--copied{color:var(--co-semantic-text-success, var(--co-color-status-success))}.co-color-picker__helper{display:flex;align-items:center;gap:var(--co-spacing-xs);font-size:var(--co-font-size-14);color:var(--co-semantic-text-muted);padding:0 var(--co-spacing-xs)}.co-color-picker__helper-icon{flex-shrink:0;display:flex;align-items:center}.co-color-picker--error .co-color-picker__helper{color:var(--co-semantic-text-error, var(--co-semantic-status-error))}:host([layout='horizontal']) .co-color-picker{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-color-picker__label{grid-column:1;grid-row:1;padding-top:var(--co-spacing-sm2);min-width:0}:host([layout='horizontal']) .co-color-picker__label{white-space:normal}:host([layout='horizontal']) .co-color-picker>:not(.co-color-picker__label){grid-column:2;min-width:0}"}},[1,"co-color-picker",{inline:[516],value:[1025],label:[1],placeholder:[1],disabled:[4],required:[4],status:[1],helperText:[1,"helper-text"],layout:[513],size:[513],name:[1],presets:[1],locale:[1],isOpen:[32],copied:[32],hsv:[32],hexDraft:[32],areaAxis:[32],focusedIndex:[32]},void 0,{value:[{syncFromValue:0}]}]);function A(){"undefined"!=typeof customElements&&["co-color-picker","co-icon","co-popover"].forEach((o=>{switch(o){case"co-color-picker":customElements.get(t(o))||customElements.define(t(o),C);break;case"co-icon":customElements.get(t(o))||u();break;case"co-popover":customElements.get(t(o))||v()}}))}C.PANEL_ID="co-color-picker-panel",C.AREA_KEYS={ArrowRight:{axis:"s",dir:1},ArrowLeft:{axis:"s",dir:-1},ArrowUp:{axis:"v",dir:1},ArrowDown:{axis:"v",dir:-1}},A();const E=C,M=A;export{E as CoColorPicker,M as defineCustomElement}