wilday_ui 0.6.0 → 0.7.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.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: '0928d2614b52a959cfdf1a406c10f1de6f291788965ddaba3f48a08fb22283e2'
4
- data.tar.gz: 977b7bf2c02855534294786824da27fdcd9fa1779f50eff26a8418af2998d938
3
+ metadata.gz: 50912590c0a438d5c271b389672df9d96c03ddf8001899804d072ddb9e18e925
4
+ data.tar.gz: 8924aaef953638212799214a462b906eb05c010a260670e78977e683200b9716
5
5
  SHA512:
6
- metadata.gz: 295649d8662a2057527c9a89e140a0a219f329d8133c8c25a843deb337a48b857c21a569ff0afca74ec2604e75f9c0ebbd7f4ba73cfc52700b64f4b4ee436b44
7
- data.tar.gz: d4b5d7f4194d2f925c2ea5fa5f48368d4049e5b45c2b88ea59d468d5a93a10c0ce1ea4df426b07765af3c78a842cd62b43d49ded19b18a6581ce7735efb29b27
6
+ metadata.gz: 6d58f3efc56e7e0e32330dd9f5fa5b7098271926a00eeca6c594afe1e496abba345438a82d654a5c0952847e5edc875ed754487135580bfc4e19879b6f801216
7
+ data.tar.gz: a771bc6e4cbd382061fa53349d9232cec601776158ff18160bb41132dad50bafaa84286a3c90993a91bc888beab239890ce2088a0ece112cd7abcc2d4404809c
@@ -2708,11 +2708,234 @@ var dropdown_controller_default = class extends Controller {
2708
2708
  }
2709
2709
  };
2710
2710
 
2711
+ // app/javascript/wilday_ui/controllers/clipboard_controller.js
2712
+ var clipboard_controller_default = class extends Controller {
2713
+ static targets = ["button", "feedback"];
2714
+ static values = {
2715
+ text: String,
2716
+ feedbackText: { type: String, default: "Copied!" },
2717
+ feedbackPosition: { type: String, default: "top" },
2718
+ feedbackDuration: { type: Number, default: 2e3 }
2719
+ };
2720
+ connect() {
2721
+ }
2722
+ async copy(event) {
2723
+ event.preventDefault();
2724
+ try {
2725
+ await navigator.clipboard.writeText(this.textValue);
2726
+ this.showFeedback();
2727
+ } catch (err) {
2728
+ console.error("Failed to copy text:", err);
2729
+ this.fallbackCopy();
2730
+ }
2731
+ }
2732
+ fallbackCopy() {
2733
+ const textArea = document.createElement("textarea");
2734
+ textArea.value = this.textValue;
2735
+ textArea.style.position = "fixed";
2736
+ textArea.style.left = "-9999px";
2737
+ document.body.appendChild(textArea);
2738
+ textArea.select();
2739
+ try {
2740
+ document.execCommand("copy");
2741
+ this.showFeedback();
2742
+ } catch (err) {
2743
+ console.error("Fallback: Oops, unable to copy", err);
2744
+ }
2745
+ document.body.removeChild(textArea);
2746
+ }
2747
+ showFeedback() {
2748
+ const feedback = this.hasFeedbackTarget ? this.feedbackTarget : this.createFeedbackElement();
2749
+ feedback.textContent = this.feedbackTextValue;
2750
+ feedback.className = "w-button-feedback";
2751
+ const positionClasses = this.feedbackPositionValue.split("-");
2752
+ positionClasses.forEach((pos) => {
2753
+ feedback.classList.add(`w-button-feedback-${pos}`);
2754
+ });
2755
+ feedback.classList.add("w-button-feedback-show");
2756
+ setTimeout(() => {
2757
+ feedback.classList.remove("w-button-feedback-show");
2758
+ }, this.feedbackDurationValue);
2759
+ }
2760
+ createFeedbackElement() {
2761
+ const feedback = document.createElement("div");
2762
+ feedback.classList.add("w-button-feedback");
2763
+ feedback.setAttribute("data-clipboard-target", "feedback");
2764
+ this.element.appendChild(feedback);
2765
+ return feedback;
2766
+ }
2767
+ };
2768
+
2769
+ // app/javascript/wilday_ui/controllers/confirmation_controller.js
2770
+ var confirmation_controller_default = class extends Controller {
2771
+ static targets = ["dialog", "confirmButton", "cancelButton"];
2772
+ static values = {
2773
+ title: String,
2774
+ message: String,
2775
+ iconColor: String,
2776
+ confirmText: String,
2777
+ cancelText: String,
2778
+ confirmStyles: String,
2779
+ cancelStyles: String
2780
+ };
2781
+ // Store the original event to be used later
2782
+ originalEvent = null;
2783
+ connect() {
2784
+ if (!this.hasDialogTarget) {
2785
+ this.element.insertAdjacentHTML("beforeend", this.dialogHTML);
2786
+ }
2787
+ }
2788
+ disconnect() {
2789
+ this.originalEvent = null;
2790
+ this.isConfirmed = false;
2791
+ }
2792
+ showDialog(event) {
2793
+ if (this.isConfirmed) {
2794
+ this.isConfirmed = false;
2795
+ return;
2796
+ }
2797
+ event.preventDefault();
2798
+ this.originalEvent = {
2799
+ type: event.type,
2800
+ element: event.currentTarget,
2801
+ ctrlKey: event.ctrlKey,
2802
+ metaKey: event.metaKey
2803
+ };
2804
+ this.dialogTarget.showModal();
2805
+ this.focusConfirmButton();
2806
+ }
2807
+ confirm(event) {
2808
+ event.preventDefault();
2809
+ this.dialogTarget.close();
2810
+ if (this.originalEvent?.element) {
2811
+ const element = this.originalEvent.element;
2812
+ if (this.hasTurbo && !element.hasAttribute("data-turbo") && !element.hasAttribute("data-turbo-method")) {
2813
+ this.resumeOriginalEvent();
2814
+ return;
2815
+ }
2816
+ const confirmEvent = new CustomEvent("confirm", {
2817
+ bubbles: true,
2818
+ cancelable: true,
2819
+ detail: {
2820
+ element,
2821
+ originalEvent: this.originalEvent
2822
+ }
2823
+ });
2824
+ const wasHandled = !element.dispatchEvent(confirmEvent);
2825
+ if (wasHandled) return;
2826
+ this.resumeOriginalEvent();
2827
+ }
2828
+ }
2829
+ resumeOriginalEvent() {
2830
+ if (!this.originalEvent) return;
2831
+ const element = this.originalEvent.element;
2832
+ this.isConfirmed = true;
2833
+ if (element.closest("form")) {
2834
+ const form = element.closest("form");
2835
+ const submitEvent = new Event("submit", {
2836
+ bubbles: true,
2837
+ cancelable: true
2838
+ });
2839
+ form.dispatchEvent(submitEvent);
2840
+ this.originalEvent = null;
2841
+ return;
2842
+ }
2843
+ if (element.tagName === "A" || element.hasAttribute("href")) {
2844
+ const click = new MouseEvent("click", {
2845
+ bubbles: true,
2846
+ cancelable: true,
2847
+ ctrlKey: this.originalEvent.ctrlKey,
2848
+ metaKey: this.originalEvent.metaKey
2849
+ });
2850
+ element.dispatchEvent(click);
2851
+ this.originalEvent = null;
2852
+ return;
2853
+ }
2854
+ if (!element.closest("form") && !(element.tagName === "A" || element.hasAttribute("href"))) {
2855
+ element.click();
2856
+ this.originalEvent = null;
2857
+ return;
2858
+ }
2859
+ }
2860
+ cancel(event) {
2861
+ event.preventDefault();
2862
+ this.closeDialog();
2863
+ }
2864
+ closeDialog() {
2865
+ this.dialogTarget.close();
2866
+ this.originalEvent = null;
2867
+ }
2868
+ handleKeydown(event) {
2869
+ if (event.key === "Escape") {
2870
+ this.cancel(event);
2871
+ }
2872
+ }
2873
+ handleClickOutside(event) {
2874
+ if (event.target === this.dialogTarget) {
2875
+ this.cancel(event);
2876
+ }
2877
+ }
2878
+ focusConfirmButton() {
2879
+ this.confirmButtonTarget.focus();
2880
+ }
2881
+ get hasTurbo() {
2882
+ return typeof Turbo !== "undefined";
2883
+ }
2884
+ get dialogHTML() {
2885
+ return `
2886
+ <dialog class="w-button-confirmation-dialog"
2887
+ data-confirmation-target="dialog"
2888
+ data-action="click->confirmation#handleClickOutside keydown->confirmation#handleKeydown">
2889
+ <div class="w-button-confirmation-dialog-content">
2890
+ <div class="w-button-confirmation-dialog-icon ${this.iconColorValue}">
2891
+ ${this.iconHTML}
2892
+ </div>
2893
+
2894
+ <h3 class="w-button-confirmation-dialog-title">
2895
+ ${this.titleValue}
2896
+ </h3>
2897
+
2898
+ <div class="w-button-confirmation-dialog-message">
2899
+ ${this.messageValue}
2900
+ </div>
2901
+
2902
+ <div class="w-button-confirmation-dialog-actions">
2903
+ <button data-confirmation-target="cancelButton"
2904
+ data-action="click->confirmation#cancel"
2905
+ class="w-button w-button-subtle w-button-medium w-button-rounded"
2906
+ style="${this.cancelStylesValue}">
2907
+ ${this.cancelTextValue}
2908
+ </button>
2909
+
2910
+ <button data-confirmation-target="confirmButton"
2911
+ data-action="click->confirmation#confirm"
2912
+ class="w-button w-button-solid w-button-medium w-button-rounded"
2913
+ style="${this.confirmStylesValue}">
2914
+ ${this.confirmTextValue}
2915
+ </button>
2916
+ </div>
2917
+ </div>
2918
+ </dialog>
2919
+ `;
2920
+ }
2921
+ get iconHTML() {
2922
+ const icons = {
2923
+ info: '<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>',
2924
+ success: '<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>',
2925
+ warning: '<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" /></svg>',
2926
+ danger: '<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg>'
2927
+ };
2928
+ return icons[this.iconColorValue] || icons.info;
2929
+ }
2930
+ };
2931
+
2711
2932
  // app/javascript/wilday_ui/controllers/index.js
2712
2933
  var application = Application.start();
2713
2934
  window.Stimulus = application;
2714
2935
  application.register("button", ButtonController);
2715
2936
  application.register("dropdown", dropdown_controller_default);
2937
+ application.register("clipboard", clipboard_controller_default);
2938
+ application.register("confirmation", confirmation_controller_default);
2716
2939
 
2717
2940
  // app/javascript/wilday_ui/components/button.js
2718
2941
  document.addEventListener("DOMContentLoaded", () => {