@mcp-b/web-components 0.2.22 → 0.3.0

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 (159) hide show
  1. package/README.md +93 -30
  2. package/dist/{alert-dialog-D25Oi_TS.js → alert-dialog-CGUwj_0U.js} +1 -1
  3. package/dist/{button-gg3JJxQZ.js → button-BbabhtKj.js} +121 -77
  4. package/dist/{button-BQofnUt4.d.ts → button-c5YKsC69.d.ts} +6 -3
  5. package/dist/{checkbox-DoFcDEKB.d.ts → checkbox-BtoypUxD.d.ts} +0 -6
  6. package/dist/{checkbox-C96lUDIM.js → checkbox-C97tlcf2.js} +11 -43
  7. package/dist/{color-input-Gae_-9w-.js → color-input-Dtp1v7A-.js} +14 -54
  8. package/dist/{color-input-Bky89xg_.d.ts → color-input-S29ZHwHE.d.ts} +0 -5
  9. package/dist/{color-picker-BYyZavkT.js → color-picker-Mnpc5u6E.js} +8 -4
  10. package/dist/{combobox-iERnTD3A.js → combobox-D4ji7M2B.js} +12 -33
  11. package/dist/{combobox-item-D2H1CMxC.d.ts → combobox-item-BnBtZyhw.d.ts} +3 -6
  12. package/dist/{comparison-B1-nMwmp.d.ts → comparison-CRvbwS7X.d.ts} +1 -0
  13. package/dist/{comparison-HJ1Zedhs.js → comparison-DQUpvkmg.js} +11 -3
  14. package/dist/components/alert-dialog/alert-dialog.js +1 -1
  15. package/dist/components/button/button.d.ts +1 -1
  16. package/dist/components/button/button.js +1 -1
  17. package/dist/components/carousel/carousel.js +1 -1
  18. package/dist/components/checkbox/checkbox.d.ts +1 -1
  19. package/dist/components/checkbox/checkbox.js +1 -1
  20. package/dist/components/color-input/color-input.d.ts +1 -1
  21. package/dist/components/color-input/color-input.js +1 -1
  22. package/dist/components/color-picker/color-picker.js +1 -1
  23. package/dist/components/combobox/combobox.d.ts +1 -1
  24. package/dist/components/combobox/combobox.js +1 -1
  25. package/dist/components/combobox-item/combobox-item.d.ts +1 -1
  26. package/dist/components/comparison/comparison.d.ts +1 -1
  27. package/dist/components/comparison/comparison.js +1 -1
  28. package/dist/components/copy/copy.js +4 -20
  29. package/dist/components/date/date.d.ts +1 -1
  30. package/dist/components/date/date.js +1 -1
  31. package/dist/components/dialog/dialog.js +1 -1
  32. package/dist/components/dropdown/dropdown.d.ts +1 -1
  33. package/dist/components/dropdown/dropdown.js +1 -1
  34. package/dist/components/expander/expander.js +1 -1
  35. package/dist/components/file-input/file-input.d.ts +1 -1
  36. package/dist/components/file-input/file-input.js +1 -1
  37. package/dist/components/filter-bar/filter-bar.js +1 -1
  38. package/dist/components/index.d.ts +24 -24
  39. package/dist/components/index.js +44 -44
  40. package/dist/components/infinite-scroller/infinite-scroller.js +1 -1
  41. package/dist/components/listbox/listbox.d.ts +1 -1
  42. package/dist/components/listbox/listbox.js +1 -1
  43. package/dist/components/navicon/navicon.js +1 -1
  44. package/dist/components/number/number.js +1 -1
  45. package/dist/components/number-field/number-field.d.ts +1 -1
  46. package/dist/components/number-field/number-field.js +1 -1
  47. package/dist/components/pagination/pagination.js +1 -1
  48. package/dist/components/popover/popover.js +1 -1
  49. package/dist/components/preview-card/preview-card.js +1 -1
  50. package/dist/components/radio/radio.d.ts +1 -1
  51. package/dist/components/radio/radio.js +1 -1
  52. package/dist/components/radio-item/radio-item.js +1 -1
  53. package/dist/components/rating/rating.d.ts +1 -1
  54. package/dist/components/rating/rating.js +1 -1
  55. package/dist/components/scroller/scroller.js +1 -1
  56. package/dist/components/search-list/search-list.d.ts +1 -1
  57. package/dist/components/search-list/search-list.js +1 -1
  58. package/dist/components/select/select.d.ts +1 -1
  59. package/dist/components/select/select.js +1 -1
  60. package/dist/components/share/share.js +1 -1
  61. package/dist/components/slide-activator/slide-activator.d.ts +1 -1
  62. package/dist/components/slide-activator/slide-activator.js +1 -1
  63. package/dist/components/slider/slider.d.ts +1 -1
  64. package/dist/components/slider/slider.js +1 -1
  65. package/dist/components/spinner/spinner.js +1 -1
  66. package/dist/components/splitter/splitter.d.ts +1 -1
  67. package/dist/components/splitter/splitter.js +1 -1
  68. package/dist/components/switch/switch.d.ts +1 -1
  69. package/dist/components/switch/switch.js +1 -1
  70. package/dist/components/tab-list/tab-list.js +1 -1
  71. package/dist/components/text-area/text-area.d.ts +1 -1
  72. package/dist/components/text-area/text-area.js +1 -1
  73. package/dist/components/text-field/text-field.d.ts +1 -1
  74. package/dist/components/text-field/text-field.js +1 -1
  75. package/dist/components/toast/toast.d.ts +1 -1
  76. package/dist/components/toast/toast.js +1 -1
  77. package/dist/components/toast-item/toast-item.js +1 -1
  78. package/dist/components/toggle-icon/toggle-icon.d.ts +1 -1
  79. package/dist/components/toggle-icon/toggle-icon.js +1 -1
  80. package/dist/components/toggle-tag/toggle-tag.d.ts +1 -1
  81. package/dist/components/toggle-tag/toggle-tag.js +1 -1
  82. package/dist/components/tooltip/tooltip.js +1 -1
  83. package/dist/components/transition-group/transition-group.d.ts +1 -1
  84. package/dist/components/transition-group/transition-group.js +1 -1
  85. package/dist/components/zoomable-frame/zoomable-frame.js +1 -1
  86. package/dist/{date-6M6wfa8L.d.ts → date-DtaTBM71.d.ts} +1 -1
  87. package/dist/docs/custom-elements.json +126 -171
  88. package/dist/{dropdown-DM4tlF_p.js → dropdown-BPOpCp59.js} +58 -34
  89. package/dist/{dropdown-Bo00Vlr5.d.ts → dropdown-C5ldJu4g.d.ts} +5 -1
  90. package/dist/{localize-322EtXNX.d.ts → en-ss05iPjS.d.ts} +4 -1
  91. package/dist/{file-input-vZFm22Lo.js → file-input-B4VfcfTD.js} +17 -33
  92. package/dist/{file-input-D2D6YC0B.d.ts → file-input-CgsTcC1R.d.ts} +0 -5
  93. package/dist/{filter-bar-DJuDlx5f.js → filter-bar-DhQSMr3S.js} +1 -1
  94. package/dist/index.d.ts +25 -27
  95. package/dist/index.js +45 -48
  96. package/dist/{infinite-scroller-BmmtnWNt.js → infinite-scroller-DjeMswwE.js} +2 -2
  97. package/dist/{listbox-B0geidHW.js → listbox-BGHw-rUd.js} +13 -28
  98. package/dist/{listbox-DD4ujIJe.d.ts → listbox-DKoMIQA6.d.ts} +3 -5
  99. package/dist/{number-field-odk4lKXM.d.ts → number-field-T0rzObq9.d.ts} +0 -5
  100. package/dist/{number-field-BGH7JtNf.js → number-field-yME3rRZT.js} +44 -55
  101. package/dist/{popover-DJBrJ0za.js → popover-lsI6gqNk.js} +9 -32
  102. package/dist/{preview-card-C7H1FPfd.js → preview-card-D1msvOWP.js} +1 -1
  103. package/dist/{radio-8UZAUYXt.js → radio-4Cok4gJI.js} +11 -28
  104. package/dist/{radio-CieMa4zU.d.ts → radio-B4fz924Q.d.ts} +1 -4
  105. package/dist/{radio-item-BlhFgXsU.js → radio-item-DpP3GBPV.js} +2 -3
  106. package/dist/{rating-4xNsWumY.d.ts → rating-8BLXhAVl.d.ts} +1 -3
  107. package/dist/{rating-C1BcJDIO.js → rating-CSn-nU2R.js} +24 -34
  108. package/dist/{search-list-Clmrg8EV.js → search-list-BffPIgnw.js} +19 -10
  109. package/dist/{search-list-n0GYO7rh.d.ts → search-list-Cd3--X7Q.d.ts} +11 -1
  110. package/dist/{select-CkZK2jJn.d.ts → select-6H_sN4A2.d.ts} +0 -5
  111. package/dist/{select-DLIaRnA4.js → select-B6nkY6E-.js} +7 -43
  112. package/dist/{share-bsgXZCl7.js → share-C7dB9NYf.js} +3 -19
  113. package/dist/{slide-activator-D7bBz69E.d.ts → slide-activator-CB0Ztk_u.d.ts} +1 -0
  114. package/dist/{slide-activator-Dm1EvZtL.js → slide-activator-Dkv5_KPl.js} +10 -3
  115. package/dist/{slider-B90Il7x3.js → slider-DY-GuC8T.js} +35 -46
  116. package/dist/{slider-B0FVsV1o.d.ts → slider-uQQ-T_kn.d.ts} +2 -3
  117. package/dist/{splitter-MnD4In9H.js → splitter-DzC0hXGN.js} +14 -3
  118. package/dist/{splitter-DBDJAzsp.d.ts → splitter-KQVgGdvP.d.ts} +1 -0
  119. package/dist/{switch-Cief9M59.d.ts → switch-BUfFo074.d.ts} +0 -6
  120. package/dist/{switch-D0hWr37A.js → switch-Chij-EaQ.js} +11 -43
  121. package/dist/{tab-list-B_Ye_Oj9.js → tab-list-CVOUSpAh.js} +2 -2
  122. package/dist/{text-area-B_mjCE9W.d.ts → text-area-DFMKyk8y.d.ts} +0 -3
  123. package/dist/{text-area-Czixaz-_.js → text-area-DZVghSkO.js} +14 -51
  124. package/dist/{text-field-BClWMp6q.d.ts → text-field-DepP1gei.d.ts} +0 -5
  125. package/dist/{text-field-Cznb4Afc.js → text-field-gX5RovkE.js} +11 -52
  126. package/dist/{toast-cEBVK9NQ.d.ts → toast-CpyA3GYM.d.ts} +1 -1
  127. package/dist/{toast-DgkBQzQC.js → toast-CxfaWFY_.js} +2 -2
  128. package/dist/{toggle-icon-4oLDeEt4.js → toggle-icon-B3fZuslO.js} +9 -31
  129. package/dist/{toggle-icon-DlwMMWZL.d.ts → toggle-icon-sTLCOruF.d.ts} +0 -5
  130. package/dist/{toggle-tag-1sfTFJtg.js → toggle-tag--Gkp-CJJ.js} +7 -35
  131. package/dist/{toggle-tag-IVvMGT4R.d.ts → toggle-tag-DDBa6hAg.d.ts} +0 -5
  132. package/dist/{tooltip-DbyoPFNe.js → tooltip-bSXNhG9l.js} +9 -32
  133. package/dist/{transition-group-3hnAnwSd.js → transition-group-8PmQx0A5.js} +23 -4
  134. package/dist/{transition-group-DD_CjSNC.d.ts → transition-group-D134iT1k.d.ts} +8 -0
  135. package/dist/translations/en.d.ts +1 -5
  136. package/dist/translations/en.js +3 -6
  137. package/dist/translations/es.d.ts +1 -1
  138. package/dist/translations/es.js +2 -5
  139. package/dist/types/custom-element-jsx.d.ts +26 -10
  140. package/dist/utilities/anchored-surface.d.ts +36 -0
  141. package/dist/utilities/anchored-surface.js +46 -0
  142. package/dist/utilities/copy-feedback.d.ts +16 -0
  143. package/dist/utilities/copy-feedback.js +33 -0
  144. package/dist/utilities/form-validity.d.ts +28 -0
  145. package/dist/utilities/form-validity.js +33 -0
  146. package/dist/utilities/localize.d.ts +1 -1
  147. package/dist/utilities/localize.js +1 -0
  148. package/package.json +3 -2
  149. package/dist/{carousel-XopKISBQ.js → carousel-DpIqPTuO.js} +1 -1
  150. package/dist/{date-CJPmOdi9.js → date-CFIR88pX.js} +1 -1
  151. package/dist/{dialog-Cx46HMaZ.js → dialog-Ddvyn2d_.js} +1 -1
  152. package/dist/{expander-Bwvxj6Oa.js → expander-CMV4QCha.js} +1 -1
  153. package/dist/{navicon-_yMHY27-.js → navicon-B-5pY9gq.js} +1 -1
  154. package/dist/{number-BNtNXNF3.js → number-BYBxfOGw.js} +1 -1
  155. package/dist/{pagination-CrTQnuNW.js → pagination-VOzVTV8p.js} +1 -1
  156. package/dist/{scroller-LYgBVyfY.js → scroller-DZATZlDa.js} +1 -1
  157. package/dist/{spinner-C04Dmc0H.js → spinner-C9lQARtQ.js} +1 -1
  158. package/dist/{toast-item-CGvz92Qk.js → toast-item-DzSPG25R.js} +1 -1
  159. package/dist/{zoomable-frame-DxcjLGcF.js → zoomable-frame-BrjVkNMX.js} +1 -1
@@ -1,5 +1,5 @@
1
- import { Localize } from "./utilities/localize.js";
2
1
  import { t as __decorate } from "./decorate-DcF3lt7P.js";
2
+ import { Localize } from "./utilities/localize.js";
3
3
  import "./dropdown-item-D8cgfO7m.js";
4
4
  import { css, html } from "lit";
5
5
  import { property, query } from "lit/decorators.js";
@@ -554,6 +554,7 @@ const openDropdowns = /* @__PURE__ */ new Set();
554
554
  var SigveloDropdown = class SigveloDropdown extends SigveloElement {
555
555
  constructor(..._args) {
556
556
  super(..._args);
557
+ this.menuTransition = 0;
557
558
  this.submenuCleanups = /* @__PURE__ */ new Map();
558
559
  this.localize = new Localize(this);
559
560
  this.userTypedQuery = "";
@@ -726,10 +727,22 @@ var SigveloDropdown = class SigveloDropdown extends SigveloElement {
726
727
  static {
727
728
  this.styles = [hostStyles, dropdown_styles_default];
728
729
  }
730
+ connectedCallback() {
731
+ super.connectedCallback();
732
+ if (this.hasUpdated) this.updateContextMenu();
733
+ }
729
734
  disconnectedCallback() {
730
735
  super.disconnectedCallback();
736
+ this.menuTransition++;
737
+ this.open = false;
738
+ this.customStates.set("open", false);
739
+ this.cleanupMenu();
740
+ if (this.menu) this.menu.hidden = true;
741
+ this.contextMenuLongPress?.stop();
742
+ this.contextMenuElement?.removeEventListener("contextmenu", this.handleContextMenu);
743
+ this.contextMenuElement?.removeEventListener("sigvelo-long-press", this.handleContextMenu);
731
744
  clearInterval(this.userTypedTimeout);
732
- this.closeAllSubmenus();
745
+ if (this.hasUpdated) this.closeAllSubmenus();
733
746
  this.submenuCleanups.forEach((cleanup) => cleanup());
734
747
  this.submenuCleanups.clear();
735
748
  document.removeEventListener("mousemove", this.handleGlobalMouseMove);
@@ -746,24 +759,25 @@ var SigveloDropdown = class SigveloDropdown extends SigveloElement {
746
759
  this.hideMenu();
747
760
  }
748
761
  }
749
- if (changedProperties.has("contextMenu")) {
750
- const root = this.getRootNode();
751
- if (this.contextMenuElement) {
752
- this.contextMenuLongPress?.stop();
753
- this.contextMenuElement.removeEventListener("contextmenu", this.handleContextMenu);
754
- this.contextMenuElement.removeEventListener("sigvelo-long-press", this.handleContextMenu);
755
- }
756
- this.contextMenuElement = this.contextMenu ? root.getElementById(this.contextMenu) : null;
757
- if (this.contextMenuElement) {
758
- this.contextMenuLongPress = new LongPress(this.contextMenuElement, {
759
- eventName: "sigvelo-long-press",
760
- ignorePointerEvents: true
761
- });
762
- this.contextMenuLongPress.start();
763
- this.contextMenuElement.addEventListener("contextmenu", this.handleContextMenu);
764
- this.contextMenuElement.addEventListener("sigvelo-long-press", this.handleContextMenu);
765
- } else if (this.contextMenu) console.warn(`A dropdown was assigned as a context menu to an element with an ID of "${this.contextMenu}" but the element could not be found.`, this);
762
+ if (changedProperties.has("contextMenu") && this.isConnected) this.updateContextMenu();
763
+ }
764
+ updateContextMenu() {
765
+ const root = this.getRootNode();
766
+ if (this.contextMenuElement) {
767
+ this.contextMenuLongPress?.stop();
768
+ this.contextMenuElement.removeEventListener("contextmenu", this.handleContextMenu);
769
+ this.contextMenuElement.removeEventListener("sigvelo-long-press", this.handleContextMenu);
766
770
  }
771
+ this.contextMenuElement = this.contextMenu ? root.getElementById(this.contextMenu) : null;
772
+ if (this.contextMenuElement) {
773
+ this.contextMenuLongPress = new LongPress(this.contextMenuElement, {
774
+ eventName: "sigvelo-long-press",
775
+ ignorePointerEvents: true
776
+ });
777
+ this.contextMenuLongPress.start();
778
+ this.contextMenuElement.addEventListener("contextmenu", this.handleContextMenu);
779
+ this.contextMenuElement.addEventListener("sigvelo-long-press", this.handleContextMenu);
780
+ } else if (this.contextMenu) console.warn(`A dropdown was assigned as a context menu to an element with an ID of "${this.contextMenu}" but the element could not be found.`, this);
767
781
  }
768
782
  /** Gets all <sigvelo-dropdown-item> elements slotted in the menu that aren't disabled. */
769
783
  getItems(includeDisabled = false) {
@@ -815,15 +829,19 @@ var SigveloDropdown = class SigveloDropdown extends SigveloElement {
815
829
  }
816
830
  /** Shows the dropdown menu. This should only be called from within updated(). */
817
831
  async showMenu() {
832
+ if (!this.isConnected) return;
818
833
  const anchor = this.contextMenu ? this.contextMenuVirtualElement : this.getTrigger();
819
834
  if (!anchor) return;
820
835
  const openEvent = new SigveloBeforeOpenEvent();
821
836
  this.dispatchEvent(openEvent);
822
- if (openEvent.defaultPrevented) {
837
+ if (openEvent.defaultPrevented || !this.isConnected) {
823
838
  this.open = false;
824
839
  return;
825
840
  }
826
- openDropdowns.forEach((dropdown) => dropdown.open = false);
841
+ const transition = ++this.menuTransition;
842
+ openDropdowns.forEach((dropdown) => {
843
+ if (dropdown !== this) dropdown.open = false;
844
+ });
827
845
  this.menu.showPopover();
828
846
  this.open = true;
829
847
  if (this.contextMenu) lockScrolling(this);
@@ -834,8 +852,10 @@ var SigveloDropdown = class SigveloDropdown extends SigveloElement {
834
852
  document.addEventListener("focusin", this.handleDocumentFocusIn);
835
853
  document.addEventListener("mousemove", this.handleGlobalMouseMove);
836
854
  this.menu.hidden = false;
855
+ this.cleanup?.();
837
856
  this.cleanup = autoUpdate(anchor, this.menu, () => this.reposition());
838
857
  await animateWithClass(this.menu, "show");
858
+ if (!this.isConnected || !this.open || transition !== this.menuTransition) return;
839
859
  const items = this.getItems();
840
860
  if (items.length > 0) {
841
861
  items.forEach((item, index) => item.active = index === 0);
@@ -845,13 +865,26 @@ var SigveloDropdown = class SigveloDropdown extends SigveloElement {
845
865
  }
846
866
  /** Hides the dropdown menu. This should only be called from within updated(). */
847
867
  async hideMenu() {
868
+ if (!this.isConnected || this.menu.hidden) return;
848
869
  const closeEvent = new SigveloBeforeCloseEvent({ source: this });
849
870
  this.dispatchEvent(closeEvent);
871
+ if (!this.isConnected) return;
850
872
  if (closeEvent.defaultPrevented) {
851
873
  this.open = true;
852
874
  return;
853
875
  }
876
+ const transition = ++this.menuTransition;
854
877
  this.open = false;
878
+ this.cleanupMenu();
879
+ if (!this.menu.hidden) {
880
+ await animateWithClass(this.menu, "hide");
881
+ if (!this.isConnected || this.open || transition !== this.menuTransition) return;
882
+ this.menu.hidden = true;
883
+ this.menu.hidePopover();
884
+ this.dispatchEvent(new SigveloCloseEvent());
885
+ }
886
+ }
887
+ cleanupMenu() {
855
888
  unlockScrolling(this);
856
889
  openDropdowns.delete(this);
857
890
  this.syncAriaAttributes();
@@ -859,17 +892,9 @@ var SigveloDropdown = class SigveloDropdown extends SigveloElement {
859
892
  document.removeEventListener("pointerdown", this.handleDocumentPointerDown);
860
893
  document.removeEventListener("focusin", this.handleDocumentFocusIn);
861
894
  document.removeEventListener("mousemove", this.handleGlobalMouseMove);
862
- if (!this.menu.hidden) {
863
- await animateWithClass(this.menu, "hide");
864
- this.menu.hidden = true;
865
- this.menu.hidePopover();
866
- this.dispatchEvent(new SigveloCloseEvent());
867
- }
868
- if (this.cleanup) {
869
- this.cleanup();
870
- this.cleanup = void 0;
871
- this.removeAttribute("data-placement");
872
- }
895
+ this.cleanup?.();
896
+ this.cleanup = void 0;
897
+ this.removeAttribute("data-placement");
873
898
  }
874
899
  /** Repositions the dropdown menu */
875
900
  reposition() {
@@ -1069,7 +1094,7 @@ var SigveloDropdown = class SigveloDropdown extends SigveloElement {
1069
1094
  item.hiddenLink.dispatchEvent(clickEvent);
1070
1095
  }
1071
1096
  }
1072
- /** Syncs aria attributes on the slotted trigger element and the menu based on the dropdown's current state */
1097
+ /** Syncs aria attributes on the slotted trigger based on the dropdown's current state. */
1073
1098
  async syncAriaAttributes() {
1074
1099
  const trigger = this.getTrigger();
1075
1100
  let nativeButton;
@@ -1082,7 +1107,6 @@ var SigveloDropdown = class SigveloDropdown extends SigveloElement {
1082
1107
  if (!nativeButton.hasAttribute("id")) nativeButton.setAttribute("id", createId("sigvelo-dropdown-trigger-"));
1083
1108
  nativeButton.setAttribute("aria-haspopup", "menu");
1084
1109
  nativeButton.setAttribute("aria-expanded", this.open ? "true" : "false");
1085
- this.menu.setAttribute("aria-expanded", "false");
1086
1110
  }
1087
1111
  render() {
1088
1112
  return html`
@@ -444,6 +444,7 @@ import { SigveloElement } from "@mcp-b/wc-support/base/sigvelo-element";
444
444
  declare class SigveloDropdown extends SigveloElement {
445
445
  static styles: CSSResultGroup;
446
446
  private cleanup;
447
+ private menuTransition;
447
448
  private submenuCleanups;
448
449
  private contextMenuElement;
449
450
  private contextMenuLongPress;
@@ -467,9 +468,11 @@ declare class SigveloDropdown extends SigveloElement {
467
468
  distance: number;
468
469
  /** The offset of the dropdown menu along its trigger. */
469
470
  offset: number;
471
+ connectedCallback(): void;
470
472
  disconnectedCallback(): void;
471
473
  firstUpdated(): void;
472
474
  updated(changedProperties: PropertyValues): void;
475
+ private updateContextMenu;
473
476
  /** Gets all <sigvelo-dropdown-item> elements slotted in the menu that aren't disabled. */
474
477
  private getItems;
475
478
  /** Gets all dropdown items in a specific submenu. */
@@ -490,6 +493,7 @@ declare class SigveloDropdown extends SigveloElement {
490
493
  private showMenu;
491
494
  /** Hides the dropdown menu. This should only be called from within updated(). */
492
495
  private hideMenu;
496
+ private cleanupMenu;
493
497
  /** Repositions the dropdown menu */
494
498
  private reposition;
495
499
  /** If focus is set outside of the component, close the menu. */
@@ -524,7 +528,7 @@ declare class SigveloDropdown extends SigveloElement {
524
528
  private handleGlobalMouseMove;
525
529
  /** Makes a selection, emits the sigvelo-select event, and closes the dropdown. */
526
530
  private makeSelection;
527
- /** Syncs aria attributes on the slotted trigger element and the menu based on the dropdown's current state */
531
+ /** Syncs aria attributes on the slotted trigger based on the dropdown's current state. */
528
532
  private syncAriaAttributes;
529
533
  render(): import("lit-html").TemplateResult<1>;
530
534
  }
@@ -63,4 +63,7 @@ interface Translation extends BaseTranslation {
63
63
  /** `LocalizeController` pre-typed with the Sigvelo component library translations. */
64
64
  declare class Localize extends LocalizeController<Translation> {}
65
65
  //#endregion
66
- export { registerDefaultTranslation as a, Translation as i, Localize as n, registerTranslation as o, LocalizeController$1 as r, update as s, BaseTranslation$1 as t };
66
+ //#region src/translations/en.d.ts
67
+ declare const translation: Translation;
68
+ //#endregion
69
+ export { Translation as a, update as c, LocalizeController$1 as i, BaseTranslation$1 as n, registerDefaultTranslation as o, Localize as r, registerTranslation as s, translation as t };
@@ -1,7 +1,7 @@
1
- import { Localize } from "./utilities/localize.js";
2
1
  import "./icon-Df0H7LYB.js";
3
2
  import { t as __decorate } from "./decorate-DcF3lt7P.js";
4
- import "./button-gg3JJxQZ.js";
3
+ import { Localize } from "./utilities/localize.js";
4
+ import "./button-BbabhtKj.js";
5
5
  import { css, html, nothing } from "lit";
6
6
  import { property, query, state } from "lit/decorators.js";
7
7
  import hostStyles from "@mcp-b/wc-support/styles/host.styles";
@@ -512,14 +512,6 @@ var SigveloFileInput = class extends SigveloFormControlElement {
512
512
  get focusableAnchor() {
513
513
  return this.fileInput;
514
514
  }
515
- connectedCallback() {
516
- super.connectedCallback();
517
- this.addEventListener("invalid", this.handleHostInvalid);
518
- }
519
- disconnectedCallback() {
520
- super.disconnectedCallback();
521
- this.removeEventListener("invalid", this.handleHostInvalid);
522
- }
523
515
  updated(changedProperties) {
524
516
  this.updateValidity();
525
517
  if (changedProperties.has("files")) {
@@ -529,24 +521,11 @@ var SigveloFileInput = class extends SigveloFormControlElement {
529
521
  this.fileInput.removeAttribute("aria-hidden");
530
522
  this.updateFormValue();
531
523
  }
532
- if (changedProperties.has("disabled")) this.customStates.set("disabled", this.disabled);
533
- if (this.hadUserInteraction || this.wasSubmitted) {
534
- this.customStates.set("user-invalid", this.isInvalid);
535
- this.customStates.set("user-valid", !this.isInvalid);
536
- } else {
537
- this.customStates.set("user-invalid", false);
538
- this.customStates.set("user-valid", false);
539
- }
540
- }
541
- /** @internal Called when a containing fieldset is disabled. */
542
- formDisabledCallback(isDisabled) {
543
- this.disabled = isDisabled;
524
+ if (changedProperties.has("disabled")) this.customStates.set("disabled", this.effectiveDisabled);
544
525
  }
545
526
  /** @internal Called when the form is reset. */
546
527
  formResetCallback() {
547
- this.isInvalid = false;
548
- this.hadUserInteraction = false;
549
- this.wasSubmitted = false;
528
+ super.formResetCallback();
550
529
  this.files = [];
551
530
  }
552
531
  /** Converts the `this.files` array into a `FileList` object so the `<input type="file">` can be updated. */
@@ -561,6 +540,7 @@ var SigveloFileInput = class extends SigveloFormControlElement {
561
540
  }
562
541
  handleDragEnter(event) {
563
542
  event.preventDefault();
543
+ if (this.effectiveDisabled) return;
564
544
  this.isDragging = true;
565
545
  }
566
546
  handleDragLeave(event) {
@@ -573,10 +553,11 @@ var SigveloFileInput = class extends SigveloFormControlElement {
573
553
  }
574
554
  handleDragOver(event) {
575
555
  event.preventDefault();
576
- event.dataTransfer.dropEffect = "copy";
556
+ event.dataTransfer.dropEffect = this.effectiveDisabled ? "none" : "copy";
577
557
  }
578
558
  handleDrop(event) {
579
559
  event.preventDefault();
560
+ if (this.effectiveDisabled) return;
580
561
  this.isDragging = false;
581
562
  this.hadUserInteraction = true;
582
563
  const entryQueue = [];
@@ -608,6 +589,7 @@ var SigveloFileInput = class extends SigveloFormControlElement {
608
589
  } while (entries.length > 0);
609
590
  }
610
591
  }
592
+ if (this.effectiveDisabled) return;
611
593
  if (this.multiple) this.files = this.files.concat(filesToAdd);
612
594
  else if (filesToAdd.length > 0) this.files = [filesToAdd[0]];
613
595
  this.dispatchEvent(new SigveloInputEvent());
@@ -616,9 +598,11 @@ var SigveloFileInput = class extends SigveloFormControlElement {
616
598
  processQueue();
617
599
  }
618
600
  handleFileInput() {
601
+ if (this.effectiveDisabled) return;
619
602
  this.hadUserInteraction = true;
620
- if (this.fileInput.files) if (this.multiple) this.files = this.files.concat([...this.fileInput.files]);
621
- else this.files = [this.fileInput.files[0]];
603
+ const selected = this.fileInput.files;
604
+ if (selected && selected.length > 0) if (this.multiple) this.files = this.files.concat([...selected]);
605
+ else this.files = [selected[0]];
622
606
  this.dispatchEvent(new SigveloInputEvent());
623
607
  this.dispatchEvent(new SigveloChangeEvent());
624
608
  }
@@ -626,10 +610,8 @@ var SigveloFileInput = class extends SigveloFormControlElement {
626
610
  this.customStates.set("focused", true);
627
611
  this.dispatchEvent(new SigveloFocusEvent());
628
612
  }
629
- handleHostInvalid() {
630
- this.wasSubmitted = true;
631
- }
632
613
  handleRemoveClick(_, indexToRemove) {
614
+ if (this.effectiveDisabled) return;
633
615
  this.files = this.files.filter((__, index) => index !== indexToRemove);
634
616
  this.dispatchEvent(new SigveloInputEvent());
635
617
  this.dispatchEvent(new SigveloChangeEvent());
@@ -725,7 +707,7 @@ var SigveloFileInput = class extends SigveloFormControlElement {
725
707
  md: this.size === "md",
726
708
  lg: this.size === "lg",
727
709
  xl: this.size === "xl",
728
- disabled: this.disabled,
710
+ disabled: this.effectiveDisabled,
729
711
  dragging: this.isDragging
730
712
  })}"
731
713
  @focus=${this.handleFocus}
@@ -744,6 +726,7 @@ var SigveloFileInput = class extends SigveloFormControlElement {
744
726
  <input
745
727
  id="file-input"
746
728
  type="file"
729
+ ?disabled=${this.effectiveDisabled}
747
730
  accept=${ifDefined(this.accept)}
748
731
  ?multiple=${this.multiple}
749
732
  ?required=${this.required}
@@ -762,7 +745,7 @@ var SigveloFileInput = class extends SigveloFormControlElement {
762
745
  md: this.size === "md",
763
746
  lg: this.size === "lg",
764
747
  xl: this.size === "xl",
765
- disabled: this.disabled,
748
+ disabled: this.effectiveDisabled,
766
749
  dragging: this.isDragging
767
750
  })}"
768
751
  >
@@ -793,6 +776,7 @@ var SigveloFileInput = class extends SigveloFormControlElement {
793
776
  <div class="file-actions">
794
777
  <sigvelo-button
795
778
  part="file-remove-button"
779
+ ?disabled=${this.effectiveDisabled}
796
780
  exportparts="button:file-remove-button__button"
797
781
  class="file-remove"
798
782
  name="x"
@@ -341,11 +341,7 @@ declare class SigveloFileInput extends SigveloFormControlElement {
341
341
  * Makes the file input required. Form submission will not be allowed when this is set and no files are selected.
342
342
  */
343
343
  required: boolean;
344
- connectedCallback(): void;
345
- disconnectedCallback(): void;
346
344
  updated(changedProperties: PropertyValues<this>): void;
347
- /** @internal Called when a containing fieldset is disabled. */
348
- formDisabledCallback(isDisabled: boolean): void;
349
345
  /** @internal Called when the form is reset. */
350
346
  formResetCallback(): void;
351
347
  /** Converts the `this.files` array into a `FileList` object so the `<input type="file">` can be updated. */
@@ -357,7 +353,6 @@ declare class SigveloFileInput extends SigveloFormControlElement {
357
353
  private handleDrop;
358
354
  private handleFileInput;
359
355
  private handleFocus;
360
- private handleHostInvalid;
361
356
  private handleRemoveClick;
362
357
  /** Determines if a File object is an image type the browser can render. */
363
358
  private isImage;
@@ -1,5 +1,5 @@
1
1
  import { t as __decorate } from "./decorate-DcF3lt7P.js";
2
- import "./text-field-Cznb4Afc.js";
2
+ import "./text-field-gX5RovkE.js";
3
3
  import { css, html } from "lit";
4
4
  import { property } from "lit/decorators.js";
5
5
  import hostStyles from "@mcp-b/wc-support/styles/host.styles";
package/dist/index.d.ts CHANGED
@@ -9,39 +9,39 @@ import { t as SigveloBreadcrumbItem } from "./breadcrumb-item-BC454oQe.js";
9
9
  import { t as SigveloBreadcrumb } from "./breadcrumb-BxZ-nQE5.js";
10
10
  import { t as SigveloButtonGroup } from "./button-group-COodHeuB.js";
11
11
  import { t as SigveloSpinner } from "./spinner-CZ19x_dC.js";
12
- import { t as SigveloButton } from "./button-BQofnUt4.js";
12
+ import { t as SigveloButton } from "./button-c5YKsC69.js";
13
13
  import { t as SigveloCallout } from "./callout-DFwPao36.js";
14
14
  import { t as SigveloCard } from "./card-BYDzdMAU.js";
15
15
  import { t as SigveloCarouselItem } from "./carousel-item-BB3jL2tk.js";
16
16
  import { t as SigveloCarousel } from "./carousel-DQITCtEY.js";
17
17
  import { t as SigveloCheckboxGroup } from "./checkbox-group-Cnh8rAn4.js";
18
- import { t as SigveloCheckbox } from "./checkbox-DoFcDEKB.js";
18
+ import { t as SigveloCheckbox } from "./checkbox-BtoypUxD.js";
19
19
  import { t as SigveloCopy } from "./copy-CvC9vaGw.js";
20
20
  import { t as SigveloTooltip } from "./tooltip-ahFthek8.js";
21
- import { t as SigveloSlider } from "./slider-B0FVsV1o.js";
22
- import { t as SigveloTextField } from "./text-field-BClWMp6q.js";
21
+ import { t as SigveloSlider } from "./slider-uQQ-T_kn.js";
22
+ import { t as SigveloTextField } from "./text-field-DepP1gei.js";
23
23
  import { t as SigveloColorPicker } from "./color-picker-wQw8bPsq.js";
24
- import { t as SigveloColorInput } from "./color-input-Bky89xg_.js";
25
- import { n as SigveloCombobox, t as SigveloComboboxItem } from "./combobox-item-D2H1CMxC.js";
26
- import { t as SigveloComparison } from "./comparison-B1-nMwmp.js";
24
+ import { t as SigveloColorInput } from "./color-input-S29ZHwHE.js";
25
+ import { n as SigveloCombobox, t as SigveloComboboxItem } from "./combobox-item-BnBtZyhw.js";
26
+ import { t as SigveloComparison } from "./comparison-CRvbwS7X.js";
27
27
  import { a as SigveloDataTable, i as DataTableSelection, n as DataTablePrimitive, o as SigveloRowSelectEvent, r as DataTableRow, t as DataTableColumn } from "./data-table-DL5RhE0d.js";
28
- import { t as SigveloDate } from "./date-6M6wfa8L.js";
28
+ import { t as SigveloDate } from "./date-DtaTBM71.js";
29
29
  import { t as SigveloDialog } from "./dialog-N-v0woIy.js";
30
30
  import { t as SigveloDivider } from "./divider-DWuAxcXv.js";
31
31
  import { t as SigveloDropdownItem } from "./dropdown-item-_lIs-Tfd.js";
32
- import { t as SigveloDropdown } from "./dropdown-Bo00Vlr5.js";
32
+ import { t as SigveloDropdown } from "./dropdown-C5ldJu4g.js";
33
33
  import { t as SigveloEmptyState } from "./empty-state-SGKjpwp3.js";
34
34
  import { t as SigveloEmptyResult } from "./empty-result-B54x_Ab2.js";
35
35
  import { t as SigveloExpander } from "./expander-BUev0BmM.js";
36
36
  import { t as SigveloField } from "./field-ITx0jVw-.js";
37
- import { t as SigveloFileInput } from "./file-input-D2D6YC0B.js";
37
+ import { t as SigveloFileInput } from "./file-input-CgsTcC1R.js";
38
38
  import { n as SigveloFilterChangeEvent, t as SigveloFilterBar } from "./filter-bar-Bj2QzEn9.js";
39
39
  import { t as SigveloFormSection } from "./form-section-xFBTBULQ.js";
40
40
  import { t as SigveloInclude } from "./include-CQHVVtNs.js";
41
41
  import { t as SigveloInfiniteScroller } from "./infinite-scroller-CuUEAlB9.js";
42
42
  import { t as SigveloIntersectionObserver } from "./intersection-observer-B7nmP7Zz.js";
43
43
  import { t as SigveloListboxItem } from "./listbox-item-DQEJWp4Z.js";
44
- import { t as SigveloListbox } from "./listbox-DD4ujIJe.js";
44
+ import { t as SigveloListbox } from "./listbox-DKoMIQA6.js";
45
45
  import { t as SigveloLoremIpsum } from "./lorem-ipsum-CR82CSuJ.js";
46
46
  import { t as SigveloMeter } from "./meter-BC7uaJWf.js";
47
47
  import { n as SigveloMetric, t as MetricFormat } from "./metric-CjlLq_VA.js";
@@ -49,41 +49,39 @@ import { t as SigveloMetricGrid } from "./metric-grid-Zb941OFI.js";
49
49
  import { t as SigveloMutationObserver } from "./mutation-observer-BmrZ-GER.js";
50
50
  import { t as SigveloNavicon } from "./navicon-Dic5Qjzb.js";
51
51
  import { t as SigveloNumber } from "./number-BwbnErlB.js";
52
- import { t as SigveloNumberField } from "./number-field-odk4lKXM.js";
52
+ import { t as SigveloNumberField } from "./number-field-T0rzObq9.js";
53
53
  import { t as SigveloPagination } from "./pagination-6z2qcf3U.js";
54
54
  import { t as SigveloPopover } from "./popover-D0sxTU6o.js";
55
55
  import { t as SigveloPreviewCard } from "./preview-card-DitOCZTD.js";
56
56
  import { t as SigveloProgress } from "./progress-Db0_axHQ.js";
57
57
  import { t as SigveloRadioItem } from "./radio-item-Xq2U3cMu.js";
58
- import { t as SigveloRadio } from "./radio-CieMa4zU.js";
58
+ import { t as SigveloRadio } from "./radio-B4fz924Q.js";
59
59
  import { t as SigveloRandomContent } from "./random-content-BhSeJFKz.js";
60
- import { t as SigveloRating } from "./rating-4xNsWumY.js";
60
+ import { t as SigveloRating } from "./rating-8BLXhAVl.js";
61
61
  import { t as SigveloResizeObserver } from "./resize-observer-BseSbVWP.js";
62
62
  import { t as SigveloScrollArea } from "./scroll-area-CVYDf5qY.js";
63
63
  import { t as SigveloScroller } from "./scroller-bB2rGs7b.js";
64
- import { t as SigveloSearchList } from "./search-list-n0GYO7rh.js";
65
- import { t as SigveloSelect } from "./select-CkZK2jJn.js";
64
+ import { t as SigveloSearchList } from "./search-list-Cd3--X7Q.js";
65
+ import { t as SigveloSelect } from "./select-6H_sN4A2.js";
66
66
  import { t as SigveloSelectionSummary } from "./selection-summary-DmFkGyZI.js";
67
67
  import { t as SigveloShare } from "./share-DPlqP2dc.js";
68
- import { t as SigveloSlideActivator } from "./slide-activator-D7bBz69E.js";
68
+ import { t as SigveloSlideActivator } from "./slide-activator-CB0Ztk_u.js";
69
69
  import { t as SigveloSparkline } from "./sparkline-DlCIt81-.js";
70
- import { t as SigveloSplitter } from "./splitter-DBDJAzsp.js";
71
- import { t as SigveloSwitch } from "./switch-Cief9M59.js";
70
+ import { t as SigveloSplitter } from "./splitter-KQVgGdvP.js";
71
+ import { t as SigveloSwitch } from "./switch-BUfFo074.js";
72
72
  import { t as SigveloTab } from "./tab-BcqYGsuW.js";
73
73
  import { t as SigveloTabPanel } from "./tab-panel-BzSJlSfd.js";
74
74
  import { t as SigveloTabList } from "./tab-list-DDvS8qHr.js";
75
- import { t as SigveloTextArea } from "./text-area-B_mjCE9W.js";
75
+ import { t as SigveloTextArea } from "./text-area-DFMKyk8y.js";
76
76
  import { t as SigveloTextMask } from "./text-mask-CNKVKSFp.js";
77
77
  import { t as SigveloTimedContent } from "./timed-content-D2mGFamc.js";
78
78
  import { t as SigveloToastItem } from "./toast-item-BPpJT6vD.js";
79
- import { t as SigveloTransitionGroup } from "./transition-group-DD_CjSNC.js";
80
- import { n as SigveloToast, t as CreateOptions } from "./toast-cEBVK9NQ.js";
81
- import { t as SigveloToggleIcon } from "./toggle-icon-DlwMMWZL.js";
82
- import { t as SigveloToggleTag } from "./toggle-tag-IVvMGT4R.js";
79
+ import { t as SigveloTransitionGroup } from "./transition-group-D134iT1k.js";
80
+ import { n as SigveloToast, t as CreateOptions } from "./toast-CpyA3GYM.js";
81
+ import { t as SigveloToggleIcon } from "./toggle-icon-sTLCOruF.js";
82
+ import { t as SigveloToggleTag } from "./toggle-tag-DDBa6hAg.js";
83
83
  import { t as SigveloToolbar } from "./toolbar-CABq0ZL1.js";
84
84
  import { t as SigveloZoomableFrame } from "./zoomable-frame-r6S6587z.js";
85
85
  import { l as registerIconLibrary, u as unregisterIconLibrary } from "./icon-library-D_if7p2h.js";
86
- import { allDefined } from "@mcp-b/wc-support/utilities/defined";
87
- import { getLibraryPath, setLibraryPath } from "@mcp-b/wc-support/utilities/library";
88
- import { discoverElements, preventTurboFouce, startLoader, stopLoader } from "@mcp-b/wc-support/utilities/loader";
86
+ import { allDefined, discoverElements, getLibraryPath, preventTurboFouce, setLibraryPath, startLoader, stopLoader } from "./sigvelo.js";
89
87
  export { ActionBarAlignment, CreateOptions, DataTableColumn, DataTablePrimitive, DataTableRow, DataTableSelection, MetricFormat, SigveloAccordion, SigveloAccordionItem, SigveloActionBar, SigveloAlertDialog, SigveloAvatar, SigveloBadge, SigveloBreadcrumb, SigveloBreadcrumbItem, SigveloButton, SigveloButtonGroup, SigveloCallout, SigveloCard, SigveloCarousel, SigveloCarouselItem, SigveloCheckbox, SigveloCheckboxGroup, SigveloColorInput, SigveloColorPicker, SigveloCombobox, SigveloComboboxItem, SigveloComparison, SigveloCopy, SigveloDataTable, SigveloDate, SigveloDialog, SigveloDivider, SigveloDropdown, SigveloDropdownItem, SigveloEmptyResult, SigveloEmptyState, SigveloExpander, SigveloField, SigveloFileInput, SigveloFilterBar, SigveloFilterChangeEvent, SigveloFormSection, SigveloIcon, SigveloInclude, SigveloInfiniteScroller, SigveloIntersectionObserver, SigveloListbox, SigveloListboxItem, SigveloLoremIpsum, SigveloMeter, SigveloMetric, SigveloMetricGrid, SigveloMutationObserver, SigveloNavicon, SigveloNumber, SigveloNumberField, SigveloPagination, SigveloPopover, SigveloPreviewCard, SigveloProgress, SigveloRadio, SigveloRadioItem, SigveloRandomContent, SigveloRating, SigveloResizeObserver, SigveloRowSelectEvent, SigveloScrollArea, SigveloScroller, SigveloSearchList, SigveloSelect, SigveloSelectionSummary, SigveloShare, SigveloSlideActivator, SigveloSlider, SigveloSparkline, SigveloSpinner, SigveloSplitter, SigveloSwitch, SigveloTab, SigveloTabList, SigveloTabPanel, SigveloTextArea, SigveloTextField, SigveloTextMask, SigveloTimedContent, SigveloToast, SigveloToastItem, SigveloToggleIcon, SigveloToggleTag, SigveloToolbar, SigveloTooltip, SigveloTransitionGroup, SigveloZoomableFrame, allDefined, discoverElements, getLibraryPath, preventTurboFouce, registerIconLibrary, setLibraryPath, startLoader, stopLoader, unregisterIconLibrary };