katalyst-tables 3.3.1 → 3.3.3

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 (62) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +1 -1
  3. data/app/assets/builds/katalyst/tables.esm.js +332 -6
  4. data/app/assets/builds/katalyst/tables.js +332 -6
  5. data/app/assets/builds/katalyst/tables.min.js +1 -1
  6. data/app/assets/builds/katalyst/tables.min.js.map +1 -1
  7. data/app/assets/stylesheets/katalyst/tables/_index.scss +1 -1
  8. data/app/assets/stylesheets/katalyst/tables/_query.scss +109 -0
  9. data/app/assets/stylesheets/katalyst/tables/typed-columns/_date.scss +1 -1
  10. data/app/assets/stylesheets/katalyst/tables/typed-columns/_datetime.scss +1 -1
  11. data/app/components/katalyst/table_component.rb +13 -2
  12. data/app/components/katalyst/tables/cells/currency_component.rb +21 -2
  13. data/app/components/katalyst/tables/cells/number_component.rb +31 -1
  14. data/app/components/katalyst/tables/query/input_component.html.erb +13 -0
  15. data/app/components/katalyst/tables/query/input_component.rb +50 -0
  16. data/app/components/katalyst/tables/query/modal_component.html.erb +33 -0
  17. data/app/components/katalyst/tables/query/modal_component.rb +89 -0
  18. data/app/components/katalyst/tables/query_component.html.erb +8 -0
  19. data/app/components/katalyst/tables/{filter_component.rb → query_component.rb} +37 -30
  20. data/app/controllers/concerns/katalyst/tables/backend.rb +14 -0
  21. data/app/helpers/katalyst/tables/frontend.rb +14 -8
  22. data/app/javascript/tables/application.js +8 -3
  23. data/app/javascript/tables/query_controller.js +108 -0
  24. data/app/javascript/tables/query_input_controller.js +228 -0
  25. data/app/models/concerns/katalyst/tables/collection/core.rb +2 -2
  26. data/app/models/concerns/katalyst/tables/collection/query/array_value_parser.rb +13 -26
  27. data/app/models/concerns/katalyst/tables/collection/query/parser.rb +16 -13
  28. data/app/models/concerns/katalyst/tables/collection/query/single_value_parser.rb +11 -3
  29. data/app/models/concerns/katalyst/tables/collection/query/value_parser.rb +10 -5
  30. data/app/models/concerns/katalyst/tables/collection/query.rb +42 -5
  31. data/app/models/concerns/katalyst/tables/collection/sorting.rb +11 -1
  32. data/app/models/katalyst/tables/collection/base.rb +10 -0
  33. data/app/models/katalyst/tables/collection/filter.rb +10 -0
  34. data/config/locales/tables.en.yml +2 -0
  35. data/{app/models → lib}/katalyst/tables/collection/type/boolean.rb +11 -1
  36. data/lib/katalyst/tables/collection/type/date.rb +57 -0
  37. data/lib/katalyst/tables/collection/type/enum.rb +32 -0
  38. data/lib/katalyst/tables/collection/type/float.rb +21 -0
  39. data/lib/katalyst/tables/collection/type/helpers/delegate.rb +32 -0
  40. data/{app/models → lib}/katalyst/tables/collection/type/helpers/extensions.rb +14 -0
  41. data/lib/katalyst/tables/collection/type/helpers/multiple.rb +60 -0
  42. data/lib/katalyst/tables/collection/type/helpers/range.rb +59 -0
  43. data/lib/katalyst/tables/collection/type/integer.rb +21 -0
  44. data/{app/models → lib}/katalyst/tables/collection/type/value.rb +22 -2
  45. data/{app/models → lib}/katalyst/tables/collection/type.rb +16 -0
  46. data/lib/katalyst/tables/collection.rb +11 -0
  47. data/lib/katalyst/tables.rb +6 -0
  48. metadata +26 -21
  49. data/app/assets/stylesheets/katalyst/tables/_filter.scss +0 -43
  50. data/app/components/katalyst/tables/filter/modal_component.html.erb +0 -25
  51. data/app/components/katalyst/tables/filter/modal_component.rb +0 -112
  52. data/app/components/katalyst/tables/filter_component.html.erb +0 -18
  53. data/app/javascript/tables/filter/modal_controller.js +0 -13
  54. data/app/models/katalyst/tables/collection/type/date.rb +0 -60
  55. data/app/models/katalyst/tables/collection/type/enum.rb +0 -21
  56. data/app/models/katalyst/tables/collection/type/float.rb +0 -57
  57. data/app/models/katalyst/tables/collection/type/helpers/delegate.rb +0 -50
  58. data/app/models/katalyst/tables/collection/type/helpers/multiple.rb +0 -30
  59. data/app/models/katalyst/tables/collection/type/integer.rb +0 -57
  60. /data/{app/models → lib}/katalyst/tables/collection/type/query.rb +0 -0
  61. /data/{app/models → lib}/katalyst/tables/collection/type/search.rb +0 -0
  62. /data/{app/models → lib}/katalyst/tables/collection/type/string.rb +0 -0
@@ -533,15 +533,337 @@ class SelectionItemController extends Controller {
533
533
  }
534
534
  }
535
535
 
536
- class FilterModalController extends Controller {
536
+ class QueryController extends Controller {
537
537
  static targets = ["modal"];
538
538
 
539
- close(e) {
539
+ disconnect() {
540
+ delete this.pending;
541
+
542
+ document.removeEventListener("selectionchange", this.selection);
543
+ }
544
+
545
+ focus() {
546
+ if (document.activeElement === this.query) return;
547
+
548
+ this.query.addEventListener(
549
+ "focusin",
550
+ (e) => {
551
+ e.target.setSelectionRange(-1, -1);
552
+ },
553
+ { once: true },
554
+ );
555
+
556
+ this.query.focus();
557
+ }
558
+
559
+ closeModal() {
540
560
  delete this.modalTarget.dataset.open;
561
+
562
+ if (document.activeElement === this.query) document.activeElement.blur();
563
+
564
+ document.removeEventListener("selectionchange", this.selection);
565
+ }
566
+
567
+ openModal() {
568
+ this.modalTarget.dataset.open = true;
569
+
570
+ document.addEventListener("selectionchange", this.selection);
571
+ }
572
+
573
+ clear() {
574
+ if (this.query.value === "") {
575
+ // if the user presses escape once, browser clears the input
576
+ // if the user presses escape again, get them out of here
577
+ this.closeModal();
578
+ }
579
+ }
580
+
581
+ submit() {
582
+ const hasFocus = this.isFocused;
583
+ const position = hasFocus && this.query.selectionStart;
584
+
585
+ if (this.pending) {
586
+ clearTimeout(this.pending);
587
+ delete this.pending;
588
+ }
589
+
590
+ // prevent an unnecessary `?q=` parameter from appearing in the URL
591
+ if (this.query.value === "") {
592
+ this.query.disabled = true;
593
+
594
+ // restore input and focus after form submission
595
+ setTimeout(() => {
596
+ this.query.disabled = false;
597
+ if (hasFocus) this.query.focus();
598
+ }, 0);
599
+ }
600
+
601
+ // add/remove current cursor position
602
+ if (hasFocus && position) {
603
+ this.position.value = position;
604
+ this.position.disabled = false;
605
+ } else {
606
+ this.position.value = "";
607
+ this.position.disabled = true;
608
+ }
609
+ }
610
+
611
+ update = () => {
612
+ if (this.pending) clearTimeout(this.pending);
613
+ this.pending = setTimeout(() => {
614
+ this.element.requestSubmit();
615
+ }, 300);
616
+ };
617
+
618
+ selection = () => {
619
+ if (this.isFocused) this.update();
620
+ };
621
+
622
+ beforeMorphAttribute(e) {
623
+ switch (e.detail.attributeName) {
624
+ case "data-open":
625
+ e.preventDefault();
626
+ break;
627
+ }
541
628
  }
542
629
 
543
- open(e) {
544
- this.modalTarget.dataset.open = "true";
630
+ get query() {
631
+ return this.element.querySelector("input[type=search]");
632
+ }
633
+
634
+ get position() {
635
+ return this.element.querySelector("input[name=p]");
636
+ }
637
+
638
+ get isFocused() {
639
+ return this.query === document.activeElement;
640
+ }
641
+ }
642
+
643
+ class QueryInputController extends Controller {
644
+ static targets = ["input", "highlight"];
645
+ static values = { query: String };
646
+
647
+ connect() {
648
+ this.queryValue = this.inputTarget.value;
649
+ }
650
+
651
+ update() {
652
+ this.queryValue = this.inputTarget.value;
653
+ }
654
+
655
+ queryValueChanged(query) {
656
+ this.highlightTarget.innerHTML = "";
657
+
658
+ new Parser().parse(query).tokens.forEach((token) => {
659
+ this.highlightTarget.appendChild(token.render());
660
+ });
661
+ }
662
+ }
663
+
664
+ class Parser {
665
+ constructor() {
666
+ this.tokens = [];
667
+ this.values = null;
668
+ }
669
+
670
+ parse(input) {
671
+ const query = new StringScanner(input);
672
+
673
+ while (!query.isEos()) {
674
+ this.push(this.skipWhitespace(query));
675
+
676
+ const value = this.takeTagged(query) || this.takeUntagged(query);
677
+
678
+ if (!this.push(value)) break;
679
+ }
680
+
681
+ return this;
682
+ }
683
+
684
+ push(token) {
685
+ if (token) {
686
+ this.values ? this.values.push(token) : this.tokens.push(token);
687
+ }
688
+
689
+ return !!token;
690
+ }
691
+
692
+ skipWhitespace(query) {
693
+ if (!query.scan(/\s+/)) return;
694
+
695
+ return new Token(query.matched());
696
+ }
697
+
698
+ takeUntagged(query) {
699
+ if (!query.scan(/\S+/)) return;
700
+
701
+ return new Untagged(query.matched());
702
+ }
703
+
704
+ takeTagged(query) {
705
+ if (!query.scan(/(\w+(?:\.\w+)?)(:\s*)/)) return;
706
+
707
+ const key = query.valueAt(1);
708
+ const separator = query.valueAt(2);
709
+
710
+ const value =
711
+ this.takeArrayValue(query) || this.takeSingleValue(query) || new Token();
712
+
713
+ return new Tagged(key, separator, value);
714
+ }
715
+
716
+ takeArrayValue(query) {
717
+ if (!query.scan(/\[\s*/)) return;
718
+
719
+ const start = new Token(query.matched());
720
+ const values = (this.values = []);
721
+
722
+ while (!query.isEos()) {
723
+ if (!this.push(this.takeSingleValue(query))) break;
724
+ if (!this.push(this.takeDelimiter(query))) break;
725
+ }
726
+
727
+ query.scan(/\s*]/);
728
+ const end = new Token(query.matched());
729
+
730
+ this.values = null;
731
+
732
+ return new Array$1(start, values, end);
733
+ }
734
+
735
+ takeDelimiter(query) {
736
+ if (!query.scan(/\s*,\s*/)) return;
737
+
738
+ return new Token(query.matched());
739
+ }
740
+
741
+ takeSingleValue(query) {
742
+ return this.takeQuotedValue(query) || this.takeUnquotedValue(query);
743
+ }
744
+
745
+ takeQuotedValue(query) {
746
+ if (!query.scan(/"([^"]*)"/)) return;
747
+
748
+ return new Value(query.matched());
749
+ }
750
+
751
+ takeUnquotedValue(query) {
752
+ if (!query.scan(/[^ \],]*/)) return;
753
+
754
+ return new Value(query.matched());
755
+ }
756
+ }
757
+
758
+ class Token {
759
+ constructor(value = "") {
760
+ this.value = value;
761
+ }
762
+
763
+ render() {
764
+ return document.createTextNode(this.value);
765
+ }
766
+ }
767
+
768
+ class Value extends Token {
769
+ render() {
770
+ const span = document.createElement("span");
771
+ span.className = "value";
772
+ span.innerText = this.value;
773
+
774
+ return span;
775
+ }
776
+ }
777
+
778
+ class Tagged extends Token {
779
+ constructor(key, separator, value) {
780
+ super();
781
+
782
+ this.key = key;
783
+ this.separator = separator;
784
+ this.value = value;
785
+ }
786
+
787
+ render() {
788
+ const span = document.createElement("span");
789
+ span.className = "tag";
790
+
791
+ const key = document.createElement("span");
792
+ key.className = "key";
793
+ key.innerText = this.key;
794
+
795
+ span.appendChild(key);
796
+ span.appendChild(document.createTextNode(this.separator));
797
+ span.appendChild(this.value.render());
798
+
799
+ return span;
800
+ }
801
+ }
802
+
803
+ class Untagged extends Token {
804
+ render() {
805
+ const span = document.createElement("span");
806
+ span.className = "untagged";
807
+ span.innerText = this.value;
808
+ return span;
809
+ }
810
+ }
811
+
812
+ let Array$1 = class Array extends Token {
813
+ constructor(start, values, end) {
814
+ super();
815
+
816
+ this.start = start;
817
+ this.values = values;
818
+ this.end = end;
819
+ }
820
+
821
+ render() {
822
+ const array = document.createElement("span");
823
+ array.className = "array-values";
824
+ array.appendChild(this.start.render());
825
+
826
+ this.values.forEach((value) => {
827
+ const span = document.createElement("span");
828
+ span.appendChild(value.render());
829
+ array.appendChild(span);
830
+ });
831
+
832
+ array.appendChild(this.end.render());
833
+
834
+ return array;
835
+ }
836
+ };
837
+
838
+ class StringScanner {
839
+ constructor(input) {
840
+ this.input = input;
841
+ this.position = 0;
842
+ this.last = null;
843
+ }
844
+
845
+ isEos() {
846
+ return this.position >= this.input.length;
847
+ }
848
+
849
+ scan(regex) {
850
+ const match = regex.exec(this.input.substring(this.position));
851
+ if (match?.index === 0) {
852
+ this.last = match;
853
+ this.position += match[0].length;
854
+ return true;
855
+ } else {
856
+ this.last = {};
857
+ return false;
858
+ }
859
+ }
860
+
861
+ matched() {
862
+ return this.last && this.last[0];
863
+ }
864
+
865
+ valueAt(index) {
866
+ return this.last && this.last[index];
545
867
  }
546
868
  }
547
869
 
@@ -567,8 +889,12 @@ const Definitions = [
567
889
  controllerConstructor: SelectionItemController,
568
890
  },
569
891
  {
570
- identifier: "tables--filter--modal",
571
- controllerConstructor: FilterModalController,
892
+ identifier: "tables--query",
893
+ controllerConstructor: QueryController,
894
+ },
895
+ {
896
+ identifier: "tables--query-input",
897
+ controllerConstructor: QueryInputController,
572
898
  },
573
899
  ];
574
900
 
@@ -1,2 +1,2 @@
1
- import{Controller as t}from"@hotwired/stimulus";class e{constructor(t,e,s){this.cursorOffset=e.offsetY,this.initialPosition=e.target.offsetTop-t.offsetTop,this.targetId=s}updateCursor(t,e,s,i){this.listOffset=t.getBoundingClientRect().top;let r=s.clientY-this.listOffset-this.cursorOffset;this.#t(t,e,r,i)}updateScroll(t,e,s){const i=this.listOffset;this.listOffset=t.getBoundingClientRect().top;const r=i-this.listOffset,a=this.position+r;this.#t(t,e,a,s)}#t(t,e,s,i){s=Math.max(s,0),s=Math.min(s,t.offsetHeight-e.offsetHeight),this.position=s;i(s-this.initialPosition)}}class s extends t{static outlets=["tables--selection--form"];static values={params:Object,checked:Boolean};tablesSelectionFormOutletConnected(t){this.checkedValue=t.isSelected(this.id)}change(t){t.preventDefault(),this.checkedValue=this.tablesSelectionFormOutlet.toggle(this.id)}get id(){return this.paramsValue.id}checkedValueChanged(t){this.element.querySelector("input").checked=t}}const i=[{identifier:"tables--orderable--item",controllerConstructor:class extends t{static values={params:Object};connect(){var t;this.index=(t=this.row,Array.from(t.parentElement.children).indexOf(t))}paramsValueChanged(t){this.id=t.id_value}dragUpdate(t){this.dragOffset=t,this.row.style.position="relative",this.row.style.top=t+"px",this.row.style.zIndex="1",this.row.toggleAttribute("dragging",!0)}updateVisually(t){this.row.style.position="relative",this.row.style.top=this.row.offsetHeight*(t-this.dragIndex)+"px"}updateIndex(t){this.index=t}params(t){const{id_name:e,id_value:s,index_name:i}=this.paramsValue;return[{name:`${t}[${s}][${e}]`,value:this.id},{name:`${t}[${s}][${i}]`,value:this.index}]}reset(){delete this.dragOffset,this.row.removeAttribute("style"),this.row.removeAttribute("dragging")}get hasChanges(){return this.paramsValue.index_value!==this.index}get dragIndex(){return this.dragOffset&&0!==this.dragOffset?this.index+Math.round(this.dragOffset/this.row.offsetHeight):this.index}get comparisonIndex(){return this.dragOffset?this.dragIndex+(this.dragOffset>0?.5:-.5):this.index}get row(){return this.element.parentElement}}},{identifier:"tables--orderable--list",controllerConstructor:class extends t{static outlets=["tables--orderable--item","tables--orderable--form"];startDragging(t){this.dragState=t,document.addEventListener("mousemove",this.mousemove),document.addEventListener("mouseup",this.mouseup),window.addEventListener("scroll",this.scroll,!0),this.element.style.position="relative"}stopDragging(){const t=this.dragState;return delete this.dragState,document.removeEventListener("mousemove",this.mousemove),document.removeEventListener("mouseup",this.mouseup),window.removeEventListener("scroll",this.scroll,!0),this.element.removeAttribute("style"),this.tablesOrderableItemOutlets.forEach((t=>t.reset())),t}drop(){const t=this.dragItem;if(!t)return;const e=t.dragIndex,s=this.tablesOrderableItemOutlets[e];s&&(e<t.index?s.row.insertAdjacentElement("beforebegin",t.row):e>t.index&&s.row.insertAdjacentElement("afterend",t.row),this.tablesOrderableItemOutlets.forEach(((t,e)=>t.updateIndex(e))),this.commitChanges())}commitChanges(){this.tablesOrderableFormOutlet.clear(),this.tablesOrderableItemOutlets.forEach((t=>{t.hasChanges&&this.tablesOrderableFormOutlet.add(t)})),this.tablesOrderableFormOutlet.submit()}mousedown(t){if(this.isDragging)return;const s=this.#e(t.target);s&&(t.preventDefault(),this.startDragging(new e(this.element,t,s.id)),this.dragState.updateCursor(this.element,s.row,t,this.animate))}mousemove=t=>{this.isDragging&&(t.preventDefault(),this.ticking||(this.ticking=!0,window.requestAnimationFrame((()=>{this.ticking=!1,this.dragState.updateCursor(this.element,this.dragItem.row,t,this.animate)}))))};scroll=t=>{this.isDragging&&!this.ticking&&(this.ticking=!0,window.requestAnimationFrame((()=>{this.ticking=!1,this.dragState.updateScroll(this.element,this.dragItem.row,this.animate)})))};mouseup=t=>{this.isDragging&&(this.drop(),this.stopDragging(),this.tablesOrderableFormOutlets.forEach((t=>delete t.dragState)))};tablesOrderableFormOutletConnected(t,e){t.dragState&&this.startDragging(t.dragState)}tablesOrderableFormOutletDisconnected(t,e){this.isDragging&&(t.dragState=this.stopDragging())}animate=t=>{const e=this.dragItem;e.dragUpdate(t),this.#s.forEach(((t,s)=>{t!==e&&t.updateVisually(s)}))};get isDragging(){return!!this.dragState}get dragItem(){return this.isDragging?this.tablesOrderableItemOutlets.find((t=>t.id===this.dragState.targetId)):null}get#s(){return this.tablesOrderableItemOutlets.toSorted(((t,e)=>t.comparisonIndex-e.comparisonIndex))}#e(t){return this.tablesOrderableItemOutlets.find((e=>e.element===t))}}},{identifier:"tables--orderable--form",controllerConstructor:class extends t{static values={scope:String};add(t){t.params(this.scopeValue).forEach((({name:t,value:e})=>{this.element.insertAdjacentHTML("beforeend",`<input type="hidden" name="${t}" value="${e}" data-generated>`)}))}submit(){0!==this.inputs.length&&this.element.requestSubmit()}clear(){this.inputs.forEach((t=>t.remove()))}get inputs(){return this.element.querySelectorAll("input[data-generated]")}}},{identifier:"tables--selection--form",controllerConstructor:class extends t{static values={count:Number,primaryKey:{type:String,default:"id"}};static targets=["count","singular","plural"];connect(){this.countValue=this.inputs.length}toggle(t){const e=this.input(t);return e?e.remove():this.element.insertAdjacentHTML("beforeend",`<input type="hidden" name="${this.primaryKeyValue}[]" value="${t}">`),this.countValue=this.inputs.length,!e}isSelected(t){return!!this.input(t)}get inputs(){return this.element.querySelectorAll(`input[name="${this.primaryKeyValue}[]"]`)}input(t){return this.element.querySelector(`input[name="${this.primaryKeyValue}[]"][value="${t}"]`)}countValueChanged(t){this.element.toggleAttribute("hidden",0===t),this.countTarget.textContent=t,this.singularTarget.toggleAttribute("hidden",1!==t),this.pluralTarget.toggleAttribute("hidden",1===t)}}},{identifier:"tables--selection--item",controllerConstructor:s},{identifier:"tables--filter--modal",controllerConstructor:class extends t{static targets=["modal"];close(t){delete this.modalTarget.dataset.open}open(t){this.modalTarget.dataset.open="true"}}}];export{i as default};
1
+ import{Controller as e}from"@hotwired/stimulus";class t{constructor(e,t,s){this.cursorOffset=t.offsetY,this.initialPosition=t.target.offsetTop-e.offsetTop,this.targetId=s}updateCursor(e,t,s,i){this.listOffset=e.getBoundingClientRect().top;let r=s.clientY-this.listOffset-this.cursorOffset;this.#e(e,t,r,i)}updateScroll(e,t,s){const i=this.listOffset;this.listOffset=e.getBoundingClientRect().top;const r=i-this.listOffset,n=this.position+r;this.#e(e,t,n,s)}#e(e,t,s,i){s=Math.max(s,0),s=Math.min(s,e.offsetHeight-t.offsetHeight),this.position=s;i(s-this.initialPosition)}}class s extends e{static outlets=["tables--selection--form"];static values={params:Object,checked:Boolean};tablesSelectionFormOutletConnected(e){this.checkedValue=e.isSelected(this.id)}change(e){e.preventDefault(),this.checkedValue=this.tablesSelectionFormOutlet.toggle(this.id)}get id(){return this.paramsValue.id}checkedValueChanged(e){this.element.querySelector("input").checked=e}}class i{constructor(){this.tokens=[],this.values=null}parse(e){const t=new u(e);for(;!t.isEos();){this.push(this.skipWhitespace(t));const e=this.takeTagged(t)||this.takeUntagged(t);if(!this.push(e))break}return this}push(e){return e&&(this.values?this.values.push(e):this.tokens.push(e)),!!e}skipWhitespace(e){if(e.scan(/\s+/))return new r(e.matched())}takeUntagged(e){if(e.scan(/\S+/))return new l(e.matched())}takeTagged(e){if(!e.scan(/(\w+(?:\.\w+)?)(:\s*)/))return;const t=e.valueAt(1),s=e.valueAt(2),i=this.takeArrayValue(e)||this.takeSingleValue(e)||new r;return new a(t,s,i)}takeArrayValue(e){if(!e.scan(/\[\s*/))return;const t=new r(e.matched()),s=this.values=[];for(;!e.isEos()&&this.push(this.takeSingleValue(e))&&this.push(this.takeDelimiter(e)););e.scan(/\s*]/);const i=new r(e.matched());return this.values=null,new o(t,s,i)}takeDelimiter(e){if(e.scan(/\s*,\s*/))return new r(e.matched())}takeSingleValue(e){return this.takeQuotedValue(e)||this.takeUnquotedValue(e)}takeQuotedValue(e){if(e.scan(/"([^"]*)"/))return new n(e.matched())}takeUnquotedValue(e){if(e.scan(/[^ \],]*/))return new n(e.matched())}}class r{constructor(e=""){this.value=e}render(){return document.createTextNode(this.value)}}class n extends r{render(){const e=document.createElement("span");return e.className="value",e.innerText=this.value,e}}class a extends r{constructor(e,t,s){super(),this.key=e,this.separator=t,this.value=s}render(){const e=document.createElement("span");e.className="tag";const t=document.createElement("span");return t.className="key",t.innerText=this.key,e.appendChild(t),e.appendChild(document.createTextNode(this.separator)),e.appendChild(this.value.render()),e}}class l extends r{render(){const e=document.createElement("span");return e.className="untagged",e.innerText=this.value,e}}let o=class extends r{constructor(e,t,s){super(),this.start=e,this.values=t,this.end=s}render(){const e=document.createElement("span");return e.className="array-values",e.appendChild(this.start.render()),this.values.forEach((t=>{const s=document.createElement("span");s.appendChild(t.render()),e.appendChild(s)})),e.appendChild(this.end.render()),e}};class u{constructor(e){this.input=e,this.position=0,this.last=null}isEos(){return this.position>=this.input.length}scan(e){const t=e.exec(this.input.substring(this.position));return 0===t?.index?(this.last=t,this.position+=t[0].length,!0):(this.last={},!1)}matched(){return this.last&&this.last[0]}valueAt(e){return this.last&&this.last[e]}}const h=[{identifier:"tables--orderable--item",controllerConstructor:class extends e{static values={params:Object};connect(){var e;this.index=(e=this.row,Array.from(e.parentElement.children).indexOf(e))}paramsValueChanged(e){this.id=e.id_value}dragUpdate(e){this.dragOffset=e,this.row.style.position="relative",this.row.style.top=e+"px",this.row.style.zIndex="1",this.row.toggleAttribute("dragging",!0)}updateVisually(e){this.row.style.position="relative",this.row.style.top=this.row.offsetHeight*(e-this.dragIndex)+"px"}updateIndex(e){this.index=e}params(e){const{id_name:t,id_value:s,index_name:i}=this.paramsValue;return[{name:`${e}[${s}][${t}]`,value:this.id},{name:`${e}[${s}][${i}]`,value:this.index}]}reset(){delete this.dragOffset,this.row.removeAttribute("style"),this.row.removeAttribute("dragging")}get hasChanges(){return this.paramsValue.index_value!==this.index}get dragIndex(){return this.dragOffset&&0!==this.dragOffset?this.index+Math.round(this.dragOffset/this.row.offsetHeight):this.index}get comparisonIndex(){return this.dragOffset?this.dragIndex+(this.dragOffset>0?.5:-.5):this.index}get row(){return this.element.parentElement}}},{identifier:"tables--orderable--list",controllerConstructor:class extends e{static outlets=["tables--orderable--item","tables--orderable--form"];startDragging(e){this.dragState=e,document.addEventListener("mousemove",this.mousemove),document.addEventListener("mouseup",this.mouseup),window.addEventListener("scroll",this.scroll,!0),this.element.style.position="relative"}stopDragging(){const e=this.dragState;return delete this.dragState,document.removeEventListener("mousemove",this.mousemove),document.removeEventListener("mouseup",this.mouseup),window.removeEventListener("scroll",this.scroll,!0),this.element.removeAttribute("style"),this.tablesOrderableItemOutlets.forEach((e=>e.reset())),e}drop(){const e=this.dragItem;if(!e)return;const t=e.dragIndex,s=this.tablesOrderableItemOutlets[t];s&&(t<e.index?s.row.insertAdjacentElement("beforebegin",e.row):t>e.index&&s.row.insertAdjacentElement("afterend",e.row),this.tablesOrderableItemOutlets.forEach(((e,t)=>e.updateIndex(t))),this.commitChanges())}commitChanges(){this.tablesOrderableFormOutlet.clear(),this.tablesOrderableItemOutlets.forEach((e=>{e.hasChanges&&this.tablesOrderableFormOutlet.add(e)})),this.tablesOrderableFormOutlet.submit()}mousedown(e){if(this.isDragging)return;const s=this.#t(e.target);s&&(e.preventDefault(),this.startDragging(new t(this.element,e,s.id)),this.dragState.updateCursor(this.element,s.row,e,this.animate))}mousemove=e=>{this.isDragging&&(e.preventDefault(),this.ticking||(this.ticking=!0,window.requestAnimationFrame((()=>{this.ticking=!1,this.dragState.updateCursor(this.element,this.dragItem.row,e,this.animate)}))))};scroll=e=>{this.isDragging&&!this.ticking&&(this.ticking=!0,window.requestAnimationFrame((()=>{this.ticking=!1,this.dragState.updateScroll(this.element,this.dragItem.row,this.animate)})))};mouseup=e=>{this.isDragging&&(this.drop(),this.stopDragging(),this.tablesOrderableFormOutlets.forEach((e=>delete e.dragState)))};tablesOrderableFormOutletConnected(e,t){e.dragState&&this.startDragging(e.dragState)}tablesOrderableFormOutletDisconnected(e,t){this.isDragging&&(e.dragState=this.stopDragging())}animate=e=>{const t=this.dragItem;t.dragUpdate(e),this.#s.forEach(((e,s)=>{e!==t&&e.updateVisually(s)}))};get isDragging(){return!!this.dragState}get dragItem(){return this.isDragging?this.tablesOrderableItemOutlets.find((e=>e.id===this.dragState.targetId)):null}get#s(){return this.tablesOrderableItemOutlets.toSorted(((e,t)=>e.comparisonIndex-t.comparisonIndex))}#t(e){return this.tablesOrderableItemOutlets.find((t=>t.element===e))}}},{identifier:"tables--orderable--form",controllerConstructor:class extends e{static values={scope:String};add(e){e.params(this.scopeValue).forEach((({name:e,value:t})=>{this.element.insertAdjacentHTML("beforeend",`<input type="hidden" name="${e}" value="${t}" data-generated>`)}))}submit(){0!==this.inputs.length&&this.element.requestSubmit()}clear(){this.inputs.forEach((e=>e.remove()))}get inputs(){return this.element.querySelectorAll("input[data-generated]")}}},{identifier:"tables--selection--form",controllerConstructor:class extends e{static values={count:Number,primaryKey:{type:String,default:"id"}};static targets=["count","singular","plural"];connect(){this.countValue=this.inputs.length}toggle(e){const t=this.input(e);return t?t.remove():this.element.insertAdjacentHTML("beforeend",`<input type="hidden" name="${this.primaryKeyValue}[]" value="${e}">`),this.countValue=this.inputs.length,!t}isSelected(e){return!!this.input(e)}get inputs(){return this.element.querySelectorAll(`input[name="${this.primaryKeyValue}[]"]`)}input(e){return this.element.querySelector(`input[name="${this.primaryKeyValue}[]"][value="${e}"]`)}countValueChanged(e){this.element.toggleAttribute("hidden",0===e),this.countTarget.textContent=e,this.singularTarget.toggleAttribute("hidden",1!==e),this.pluralTarget.toggleAttribute("hidden",1===e)}}},{identifier:"tables--selection--item",controllerConstructor:s},{identifier:"tables--query",controllerConstructor:class extends e{static targets=["modal"];disconnect(){delete this.pending,document.removeEventListener("selectionchange",this.selection)}focus(){document.activeElement!==this.query&&(this.query.addEventListener("focusin",(e=>{e.target.setSelectionRange(-1,-1)}),{once:!0}),this.query.focus())}closeModal(){delete this.modalTarget.dataset.open,document.activeElement===this.query&&document.activeElement.blur(),document.removeEventListener("selectionchange",this.selection)}openModal(){this.modalTarget.dataset.open=!0,document.addEventListener("selectionchange",this.selection)}clear(){""===this.query.value&&this.closeModal()}submit(){const e=this.isFocused,t=e&&this.query.selectionStart;this.pending&&(clearTimeout(this.pending),delete this.pending),""===this.query.value&&(this.query.disabled=!0,setTimeout((()=>{this.query.disabled=!1,e&&this.query.focus()}),0)),e&&t?(this.position.value=t,this.position.disabled=!1):(this.position.value="",this.position.disabled=!0)}update=()=>{this.pending&&clearTimeout(this.pending),this.pending=setTimeout((()=>{this.element.requestSubmit()}),300)};selection=()=>{this.isFocused&&this.update()};beforeMorphAttribute(e){if("data-open"===e.detail.attributeName)e.preventDefault()}get query(){return this.element.querySelector("input[type=search]")}get position(){return this.element.querySelector("input[name=p]")}get isFocused(){return this.query===document.activeElement}}},{identifier:"tables--query-input",controllerConstructor:class extends e{static targets=["input","highlight"];static values={query:String};connect(){this.queryValue=this.inputTarget.value}update(){this.queryValue=this.inputTarget.value}queryValueChanged(e){this.highlightTarget.innerHTML="",(new i).parse(e).tokens.forEach((e=>{this.highlightTarget.appendChild(e.render())}))}}}];export{h as default};
2
2
  //# sourceMappingURL=tables.min.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tables.min.js","sources":["../../../javascript/tables/orderable/list_controller.js","../../../javascript/tables/selection/item_controller.js","../../../javascript/tables/application.js","../../../javascript/tables/orderable/item_controller.js","../../../javascript/tables/orderable/form_controller.js","../../../javascript/tables/selection/form_controller.js","../../../javascript/tables/filter/modal_controller.js"],"sourcesContent":["import { Controller } from \"@hotwired/stimulus\";\n\nexport default class OrderableListController extends Controller {\n static outlets = [\"tables--orderable--item\", \"tables--orderable--form\"];\n\n //region State transitions\n\n startDragging(dragState) {\n this.dragState = dragState;\n\n document.addEventListener(\"mousemove\", this.mousemove);\n document.addEventListener(\"mouseup\", this.mouseup);\n window.addEventListener(\"scroll\", this.scroll, true);\n\n this.element.style.position = \"relative\";\n }\n\n stopDragging() {\n const dragState = this.dragState;\n delete this.dragState;\n\n document.removeEventListener(\"mousemove\", this.mousemove);\n document.removeEventListener(\"mouseup\", this.mouseup);\n window.removeEventListener(\"scroll\", this.scroll, true);\n\n this.element.removeAttribute(\"style\");\n this.tablesOrderableItemOutlets.forEach((item) => item.reset());\n\n return dragState;\n }\n\n drop() {\n // note: early returns guard against turbo updates that prevent us finding\n // the right item to drop on. In this situation it's better to discard the\n // drop than to drop in the wrong place.\n\n const dragItem = this.dragItem;\n\n if (!dragItem) return;\n\n const newIndex = dragItem.dragIndex;\n const targetItem = this.tablesOrderableItemOutlets[newIndex];\n\n if (!targetItem) return;\n\n // swap the dragged item into the correct position for its current offset\n if (newIndex < dragItem.index) {\n targetItem.row.insertAdjacentElement(\"beforebegin\", dragItem.row);\n } else if (newIndex > dragItem.index) {\n targetItem.row.insertAdjacentElement(\"afterend\", dragItem.row);\n }\n\n // reindex all items based on their new positions\n this.tablesOrderableItemOutlets.forEach((item, index) =>\n item.updateIndex(index),\n );\n\n // save the changes\n this.commitChanges();\n }\n\n commitChanges() {\n // clear any existing inputs to prevent duplicates\n this.tablesOrderableFormOutlet.clear();\n\n // insert any items that have changed position\n this.tablesOrderableItemOutlets.forEach((item) => {\n if (item.hasChanges) this.tablesOrderableFormOutlet.add(item);\n });\n\n this.tablesOrderableFormOutlet.submit();\n }\n\n //endregion\n\n //region Events\n\n mousedown(event) {\n if (this.isDragging) return;\n\n const target = this.#targetItem(event.target);\n\n if (!target) return;\n\n event.preventDefault(); // prevent built-in drag\n\n this.startDragging(new DragState(this.element, event, target.id));\n\n this.dragState.updateCursor(this.element, target.row, event, this.animate);\n }\n\n mousemove = (event) => {\n if (!this.isDragging) return;\n\n event.preventDefault(); // prevent build-in drag\n\n if (this.ticking) return;\n\n this.ticking = true;\n\n window.requestAnimationFrame(() => {\n this.ticking = false;\n this.dragState.updateCursor(\n this.element,\n this.dragItem.row,\n event,\n this.animate,\n );\n });\n };\n\n scroll = (event) => {\n if (!this.isDragging || this.ticking) return;\n\n this.ticking = true;\n\n window.requestAnimationFrame(() => {\n this.ticking = false;\n this.dragState.updateScroll(\n this.element,\n this.dragItem.row,\n this.animate,\n );\n });\n };\n\n mouseup = (event) => {\n if (!this.isDragging) return;\n\n this.drop();\n this.stopDragging();\n this.tablesOrderableFormOutlets.forEach((form) => delete form.dragState);\n };\n\n tablesOrderableFormOutletConnected(form, element) {\n if (form.dragState) {\n // restore the previous controller's state\n this.startDragging(form.dragState);\n }\n }\n\n tablesOrderableFormOutletDisconnected(form, element) {\n if (this.isDragging) {\n // cache drag state in the form\n form.dragState = this.stopDragging();\n }\n }\n\n //endregion\n\n //region Helpers\n\n /**\n * Updates the position of the drag item with a relative offset. Updates\n * other items relative to the new position of the drag item, as required.\n *\n * @callback {OrderableListController~animate}\n * @param {number} offset\n */\n animate = (offset) => {\n const dragItem = this.dragItem;\n\n // Visually update the dragItem so it follows the cursor\n dragItem.dragUpdate(offset);\n\n // Visually updates the position of all items in the list relative to the\n // dragged item. No actual changes to orderings at this stage.\n this.#currentItems.forEach((item, index) => {\n if (item === dragItem) return;\n item.updateVisually(index);\n });\n };\n\n get isDragging() {\n return !!this.dragState;\n }\n\n get dragItem() {\n if (!this.isDragging) return null;\n\n return this.tablesOrderableItemOutlets.find(\n (item) => item.id === this.dragState.targetId,\n );\n }\n\n /**\n * Returns the current items in the list, sorted by their current index.\n * Current uses the drag index if the item is being dragged, if set.\n *\n * @returns {Array[OrderableRowController]}\n */\n get #currentItems() {\n return this.tablesOrderableItemOutlets.toSorted(\n (a, b) => a.comparisonIndex - b.comparisonIndex,\n );\n }\n\n /**\n * Returns the item outlet that was clicked on, if any.\n *\n * @param element {HTMLElement} the clicked ordinal cell\n * @returns {OrderableRowController}\n */\n #targetItem(element) {\n return this.tablesOrderableItemOutlets.find(\n (item) => item.element === element,\n );\n }\n\n //endregion\n}\n\n/**\n * During drag we want to be able to translate a document-relative coordinate\n * into a coordinate relative to the list element. This state object calculates\n * and stores internal state so that we can translate absolute page coordinates\n * from mouse events into relative offsets for the list items within the list\n * element.\n *\n * We also keep track of the drag target so that if the controller is attached\n * to a new element during the drag we can continue after the turbo update.\n */\nclass DragState {\n /**\n * @param list {HTMLElement} the list controller's element (tbody)\n * @param event {MouseEvent} the initial event\n * @param id {String} the id of the element being dragged\n */\n constructor(list, event, id) {\n // cursor offset is the offset of the cursor relative to the drag item\n this.cursorOffset = event.offsetY;\n\n // initial offset is the offset position of the drag item at drag start\n this.initialPosition = event.target.offsetTop - list.offsetTop;\n\n // id of the item being dragged\n this.targetId = id;\n }\n\n /**\n * Calculates the offset of the drag item relative to its initial position.\n *\n * @param list {HTMLElement} the list controller's element (tbody)\n * @param row {HTMLElement} the row being dragged\n * @param event {MouseEvent} the current event\n * @param callback {OrderableListController~animate} updates the drag item with a relative offset\n */\n updateCursor(list, row, event, callback) {\n // Calculate and store the list offset relative to the viewport\n // This value is cached so we can calculate the outcome of any scroll events\n this.listOffset = list.getBoundingClientRect().top;\n\n // Calculate the position of the cursor relative to the list.\n // Accounts for scroll offsets by using the item's bounding client rect.\n const cursorPosition = event.clientY - this.listOffset;\n\n // intended item position relative to the list, from cursor position\n let itemPosition = cursorPosition - this.cursorOffset;\n\n this.#updateItemPosition(list, row, itemPosition, callback);\n }\n\n /**\n * Animates the item's position as the list scrolls. Requires a previous call\n * to set the scroll offset.\n *\n * @param list {HTMLElement} the list controller's element (tbody)\n * @param row {HTMLElement} the row being dragged\n * @param callback {OrderableListController~animate} updates the drag item with a relative offset\n */\n updateScroll(list, row, callback) {\n const previousScrollOffset = this.listOffset;\n\n // Calculate and store the list offset relative to the viewport\n // This value is cached so we can calculate the outcome of any scroll events\n this.listOffset = list.getBoundingClientRect().top;\n\n // Calculate the change in scroll offset since the last update\n const scrollDelta = previousScrollOffset - this.listOffset;\n\n // intended item position relative to the list, from cursor position\n const position = this.position + scrollDelta;\n\n this.#updateItemPosition(list, row, position, callback);\n }\n\n #updateItemPosition(list, row, position, callback) {\n // ensure itemPosition is within the bounds of the list (tbody)\n position = Math.max(position, 0);\n position = Math.min(position, list.offsetHeight - row.offsetHeight);\n\n // cache the item's position relative to the list for use in scroll events\n this.position = position;\n\n // Item has position: relative, so we want to calculate the amount to move\n // the item relative to it's DOM position to represent how much it has been\n // dragged by.\n const offset = position - this.initialPosition;\n\n // Convert itemPosition from offset relative to list to offset relative to\n // its position within the DOM (if it hadn't moved).\n callback(offset);\n }\n}\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class SelectionItemController extends Controller {\n static outlets = [\"tables--selection--form\"];\n static values = {\n params: Object,\n checked: Boolean,\n };\n\n tablesSelectionFormOutletConnected(form) {\n this.checkedValue = form.isSelected(this.id);\n }\n\n change(e) {\n e.preventDefault();\n\n this.checkedValue = this.tablesSelectionFormOutlet.toggle(this.id);\n }\n\n get id() {\n return this.paramsValue.id;\n }\n\n checkedValueChanged(checked) {\n this.element.querySelector(\"input\").checked = checked;\n }\n}\n","import OrderableItemController from \"./orderable/item_controller\";\nimport OrderableListController from \"./orderable/list_controller\";\nimport OrderableFormController from \"./orderable/form_controller\";\nimport SelectionFormController from \"./selection/form_controller\";\nimport SelectionItemController from \"./selection/item_controller\";\nimport FilterModalController from \"./filter/modal_controller\";\n\nconst Definitions = [\n {\n identifier: \"tables--orderable--item\",\n controllerConstructor: OrderableItemController,\n },\n {\n identifier: \"tables--orderable--list\",\n controllerConstructor: OrderableListController,\n },\n {\n identifier: \"tables--orderable--form\",\n controllerConstructor: OrderableFormController,\n },\n {\n identifier: \"tables--selection--form\",\n controllerConstructor: SelectionFormController,\n },\n {\n identifier: \"tables--selection--item\",\n controllerConstructor: SelectionItemController,\n },\n {\n identifier: \"tables--filter--modal\",\n controllerConstructor: FilterModalController,\n },\n];\n\nexport { Definitions as default };\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class OrderableRowController extends Controller {\n static values = {\n params: Object,\n };\n\n connect() {\n // index from server may be inconsistent with the visual ordering,\n // especially if this is a new node. Use positional indexes instead,\n // as these are the values we will send on save.\n this.index = domIndex(this.row);\n }\n\n paramsValueChanged(params) {\n this.id = params.id_value;\n }\n\n dragUpdate(offset) {\n this.dragOffset = offset;\n this.row.style.position = \"relative\";\n this.row.style.top = offset + \"px\";\n this.row.style.zIndex = \"1\";\n this.row.toggleAttribute(\"dragging\", true);\n }\n\n /**\n * Called on items that are not the dragged item during drag. Updates the\n * visual position of the item relative to the dragged item.\n *\n * @param index {number} intended index of the item during drag\n */\n updateVisually(index) {\n this.row.style.position = \"relative\";\n this.row.style.top = `${\n this.row.offsetHeight * (index - this.dragIndex)\n }px`;\n }\n\n /**\n * Set the index value of the item. This is called on all items after a drop\n * event. If the index is different to the params index then this item has\n * changed.\n *\n * @param index {number} the new index value\n */\n updateIndex(index) {\n this.index = index;\n }\n\n /** Retrieve params for use in the form */\n params(scope) {\n const { id_name, id_value, index_name } = this.paramsValue;\n return [\n { name: `${scope}[${id_value}][${id_name}]`, value: this.id },\n { name: `${scope}[${id_value}][${index_name}]`, value: this.index },\n ];\n }\n\n /**\n * Restore any visual changes made during drag and remove the drag state.\n */\n reset() {\n delete this.dragOffset;\n this.row.removeAttribute(\"style\");\n this.row.removeAttribute(\"dragging\");\n }\n\n /**\n * @returns {boolean} true when the item has a change to its index value\n */\n get hasChanges() {\n return this.paramsValue.index_value !== this.index;\n }\n\n /**\n * Calculate the relative index of the item during drag. This is used to\n * sort items during drag as it takes into account any uncommitted changes\n * to index caused by the drag offset.\n *\n * @returns {number} index for the purposes of drag and drop ordering\n */\n get dragIndex() {\n if (this.dragOffset && this.dragOffset !== 0) {\n return this.index + Math.round(this.dragOffset / this.row.offsetHeight);\n } else {\n return this.index;\n }\n }\n\n /**\n * Index value for use in comparisons during drag. This is used to determine\n * whether the dragged item is above or below another item. If this item is\n * being dragged then we offset the index by 0.5 to ensure that it jumps up\n * or down when it reaches the midpoint of the item above or below it.\n *\n * @returns {number}\n */\n get comparisonIndex() {\n if (this.dragOffset) {\n return this.dragIndex + (this.dragOffset > 0 ? 0.5 : -0.5);\n } else {\n return this.index;\n }\n }\n\n /**\n * The containing row element.\n *\n * @returns {HTMLElement}\n */\n get row() {\n return this.element.parentElement;\n }\n}\n\nfunction domIndex(element) {\n return Array.from(element.parentElement.children).indexOf(element);\n}\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class OrderableFormController extends Controller {\n static values = { scope: String };\n\n add(item) {\n item.params(this.scopeValue).forEach(({ name, value }) => {\n this.element.insertAdjacentHTML(\n \"beforeend\",\n `<input type=\"hidden\" name=\"${name}\" value=\"${value}\" data-generated>`,\n );\n });\n }\n\n submit() {\n if (this.inputs.length === 0) return;\n\n this.element.requestSubmit();\n }\n\n clear() {\n this.inputs.forEach((input) => input.remove());\n }\n\n get inputs() {\n return this.element.querySelectorAll(\"input[data-generated]\");\n }\n}\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class SelectionFormController extends Controller {\n static values = {\n count: Number,\n primaryKey: { type: String, default: \"id\" },\n };\n static targets = [\"count\", \"singular\", \"plural\"];\n\n connect() {\n this.countValue = this.inputs.length;\n }\n\n /**\n * @param id to toggle\n * @return {boolean} true if selected, false if unselected\n */\n toggle(id) {\n const input = this.input(id);\n\n if (input) {\n input.remove();\n } else {\n this.element.insertAdjacentHTML(\n \"beforeend\",\n `<input type=\"hidden\" name=\"${this.primaryKeyValue}[]\" value=\"${id}\">`,\n );\n }\n\n this.countValue = this.inputs.length;\n\n return !input;\n }\n\n /**\n * @returns {boolean} true if the given id is currently selected\n */\n isSelected(id) {\n return !!this.input(id);\n }\n\n get inputs() {\n return this.element.querySelectorAll(\n `input[name=\"${this.primaryKeyValue}[]\"]`,\n );\n }\n\n input(id) {\n return this.element.querySelector(\n `input[name=\"${this.primaryKeyValue}[]\"][value=\"${id}\"]`,\n );\n }\n\n countValueChanged(count) {\n this.element.toggleAttribute(\"hidden\", count === 0);\n this.countTarget.textContent = count;\n this.singularTarget.toggleAttribute(\"hidden\", count !== 1);\n this.pluralTarget.toggleAttribute(\"hidden\", count === 1);\n }\n}\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class FilterModalController extends Controller {\n static targets = [\"modal\"];\n\n close(e) {\n delete this.modalTarget.dataset.open;\n }\n\n open(e) {\n this.modalTarget.dataset.open = \"true\";\n }\n}\n"],"names":["DragState","constructor","list","event","id","this","cursorOffset","offsetY","initialPosition","target","offsetTop","targetId","updateCursor","row","callback","listOffset","getBoundingClientRect","top","itemPosition","clientY","updateItemPosition","updateScroll","previousScrollOffset","scrollDelta","position","Math","max","min","offsetHeight","SelectionItemController","Controller","static","params","Object","checked","Boolean","tablesSelectionFormOutletConnected","form","checkedValue","isSelected","change","e","preventDefault","tablesSelectionFormOutlet","toggle","paramsValue","checkedValueChanged","element","querySelector","Definitions","identifier","controllerConstructor","connect","index","Array","from","parentElement","children","indexOf","paramsValueChanged","id_value","dragUpdate","offset","dragOffset","style","zIndex","toggleAttribute","updateVisually","dragIndex","updateIndex","scope","id_name","index_name","name","value","reset","removeAttribute","hasChanges","index_value","round","comparisonIndex","startDragging","dragState","document","addEventListener","mousemove","mouseup","window","scroll","stopDragging","removeEventListener","tablesOrderableItemOutlets","forEach","item","drop","dragItem","newIndex","targetItem","insertAdjacentElement","commitChanges","tablesOrderableFormOutlet","clear","add","submit","mousedown","isDragging","animate","ticking","requestAnimationFrame","tablesOrderableFormOutlets","tablesOrderableFormOutletConnected","tablesOrderableFormOutletDisconnected","currentItems","find","toSorted","a","b","String","scopeValue","insertAdjacentHTML","inputs","length","requestSubmit","input","remove","querySelectorAll","count","Number","primaryKey","type","default","countValue","primaryKeyValue","countValueChanged","countTarget","textContent","singularTarget","pluralTarget","close","modalTarget","dataset","open"],"mappings":"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"}
1
+ {"version":3,"file":"tables.min.js","sources":["../../../javascript/tables/orderable/list_controller.js","../../../javascript/tables/selection/item_controller.js","../../../javascript/tables/query_input_controller.js","../../../javascript/tables/application.js","../../../javascript/tables/orderable/item_controller.js","../../../javascript/tables/orderable/form_controller.js","../../../javascript/tables/selection/form_controller.js","../../../javascript/tables/query_controller.js"],"sourcesContent":["import { Controller } from \"@hotwired/stimulus\";\n\nexport default class OrderableListController extends Controller {\n static outlets = [\"tables--orderable--item\", \"tables--orderable--form\"];\n\n //region State transitions\n\n startDragging(dragState) {\n this.dragState = dragState;\n\n document.addEventListener(\"mousemove\", this.mousemove);\n document.addEventListener(\"mouseup\", this.mouseup);\n window.addEventListener(\"scroll\", this.scroll, true);\n\n this.element.style.position = \"relative\";\n }\n\n stopDragging() {\n const dragState = this.dragState;\n delete this.dragState;\n\n document.removeEventListener(\"mousemove\", this.mousemove);\n document.removeEventListener(\"mouseup\", this.mouseup);\n window.removeEventListener(\"scroll\", this.scroll, true);\n\n this.element.removeAttribute(\"style\");\n this.tablesOrderableItemOutlets.forEach((item) => item.reset());\n\n return dragState;\n }\n\n drop() {\n // note: early returns guard against turbo updates that prevent us finding\n // the right item to drop on. In this situation it's better to discard the\n // drop than to drop in the wrong place.\n\n const dragItem = this.dragItem;\n\n if (!dragItem) return;\n\n const newIndex = dragItem.dragIndex;\n const targetItem = this.tablesOrderableItemOutlets[newIndex];\n\n if (!targetItem) return;\n\n // swap the dragged item into the correct position for its current offset\n if (newIndex < dragItem.index) {\n targetItem.row.insertAdjacentElement(\"beforebegin\", dragItem.row);\n } else if (newIndex > dragItem.index) {\n targetItem.row.insertAdjacentElement(\"afterend\", dragItem.row);\n }\n\n // reindex all items based on their new positions\n this.tablesOrderableItemOutlets.forEach((item, index) =>\n item.updateIndex(index),\n );\n\n // save the changes\n this.commitChanges();\n }\n\n commitChanges() {\n // clear any existing inputs to prevent duplicates\n this.tablesOrderableFormOutlet.clear();\n\n // insert any items that have changed position\n this.tablesOrderableItemOutlets.forEach((item) => {\n if (item.hasChanges) this.tablesOrderableFormOutlet.add(item);\n });\n\n this.tablesOrderableFormOutlet.submit();\n }\n\n //endregion\n\n //region Events\n\n mousedown(event) {\n if (this.isDragging) return;\n\n const target = this.#targetItem(event.target);\n\n if (!target) return;\n\n event.preventDefault(); // prevent built-in drag\n\n this.startDragging(new DragState(this.element, event, target.id));\n\n this.dragState.updateCursor(this.element, target.row, event, this.animate);\n }\n\n mousemove = (event) => {\n if (!this.isDragging) return;\n\n event.preventDefault(); // prevent build-in drag\n\n if (this.ticking) return;\n\n this.ticking = true;\n\n window.requestAnimationFrame(() => {\n this.ticking = false;\n this.dragState.updateCursor(\n this.element,\n this.dragItem.row,\n event,\n this.animate,\n );\n });\n };\n\n scroll = (event) => {\n if (!this.isDragging || this.ticking) return;\n\n this.ticking = true;\n\n window.requestAnimationFrame(() => {\n this.ticking = false;\n this.dragState.updateScroll(\n this.element,\n this.dragItem.row,\n this.animate,\n );\n });\n };\n\n mouseup = (event) => {\n if (!this.isDragging) return;\n\n this.drop();\n this.stopDragging();\n this.tablesOrderableFormOutlets.forEach((form) => delete form.dragState);\n };\n\n tablesOrderableFormOutletConnected(form, element) {\n if (form.dragState) {\n // restore the previous controller's state\n this.startDragging(form.dragState);\n }\n }\n\n tablesOrderableFormOutletDisconnected(form, element) {\n if (this.isDragging) {\n // cache drag state in the form\n form.dragState = this.stopDragging();\n }\n }\n\n //endregion\n\n //region Helpers\n\n /**\n * Updates the position of the drag item with a relative offset. Updates\n * other items relative to the new position of the drag item, as required.\n *\n * @callback {OrderableListController~animate}\n * @param {number} offset\n */\n animate = (offset) => {\n const dragItem = this.dragItem;\n\n // Visually update the dragItem so it follows the cursor\n dragItem.dragUpdate(offset);\n\n // Visually updates the position of all items in the list relative to the\n // dragged item. No actual changes to orderings at this stage.\n this.#currentItems.forEach((item, index) => {\n if (item === dragItem) return;\n item.updateVisually(index);\n });\n };\n\n get isDragging() {\n return !!this.dragState;\n }\n\n get dragItem() {\n if (!this.isDragging) return null;\n\n return this.tablesOrderableItemOutlets.find(\n (item) => item.id === this.dragState.targetId,\n );\n }\n\n /**\n * Returns the current items in the list, sorted by their current index.\n * Current uses the drag index if the item is being dragged, if set.\n *\n * @returns {Array[OrderableRowController]}\n */\n get #currentItems() {\n return this.tablesOrderableItemOutlets.toSorted(\n (a, b) => a.comparisonIndex - b.comparisonIndex,\n );\n }\n\n /**\n * Returns the item outlet that was clicked on, if any.\n *\n * @param element {HTMLElement} the clicked ordinal cell\n * @returns {OrderableRowController}\n */\n #targetItem(element) {\n return this.tablesOrderableItemOutlets.find(\n (item) => item.element === element,\n );\n }\n\n //endregion\n}\n\n/**\n * During drag we want to be able to translate a document-relative coordinate\n * into a coordinate relative to the list element. This state object calculates\n * and stores internal state so that we can translate absolute page coordinates\n * from mouse events into relative offsets for the list items within the list\n * element.\n *\n * We also keep track of the drag target so that if the controller is attached\n * to a new element during the drag we can continue after the turbo update.\n */\nclass DragState {\n /**\n * @param list {HTMLElement} the list controller's element (tbody)\n * @param event {MouseEvent} the initial event\n * @param id {String} the id of the element being dragged\n */\n constructor(list, event, id) {\n // cursor offset is the offset of the cursor relative to the drag item\n this.cursorOffset = event.offsetY;\n\n // initial offset is the offset position of the drag item at drag start\n this.initialPosition = event.target.offsetTop - list.offsetTop;\n\n // id of the item being dragged\n this.targetId = id;\n }\n\n /**\n * Calculates the offset of the drag item relative to its initial position.\n *\n * @param list {HTMLElement} the list controller's element (tbody)\n * @param row {HTMLElement} the row being dragged\n * @param event {MouseEvent} the current event\n * @param callback {OrderableListController~animate} updates the drag item with a relative offset\n */\n updateCursor(list, row, event, callback) {\n // Calculate and store the list offset relative to the viewport\n // This value is cached so we can calculate the outcome of any scroll events\n this.listOffset = list.getBoundingClientRect().top;\n\n // Calculate the position of the cursor relative to the list.\n // Accounts for scroll offsets by using the item's bounding client rect.\n const cursorPosition = event.clientY - this.listOffset;\n\n // intended item position relative to the list, from cursor position\n let itemPosition = cursorPosition - this.cursorOffset;\n\n this.#updateItemPosition(list, row, itemPosition, callback);\n }\n\n /**\n * Animates the item's position as the list scrolls. Requires a previous call\n * to set the scroll offset.\n *\n * @param list {HTMLElement} the list controller's element (tbody)\n * @param row {HTMLElement} the row being dragged\n * @param callback {OrderableListController~animate} updates the drag item with a relative offset\n */\n updateScroll(list, row, callback) {\n const previousScrollOffset = this.listOffset;\n\n // Calculate and store the list offset relative to the viewport\n // This value is cached so we can calculate the outcome of any scroll events\n this.listOffset = list.getBoundingClientRect().top;\n\n // Calculate the change in scroll offset since the last update\n const scrollDelta = previousScrollOffset - this.listOffset;\n\n // intended item position relative to the list, from cursor position\n const position = this.position + scrollDelta;\n\n this.#updateItemPosition(list, row, position, callback);\n }\n\n #updateItemPosition(list, row, position, callback) {\n // ensure itemPosition is within the bounds of the list (tbody)\n position = Math.max(position, 0);\n position = Math.min(position, list.offsetHeight - row.offsetHeight);\n\n // cache the item's position relative to the list for use in scroll events\n this.position = position;\n\n // Item has position: relative, so we want to calculate the amount to move\n // the item relative to it's DOM position to represent how much it has been\n // dragged by.\n const offset = position - this.initialPosition;\n\n // Convert itemPosition from offset relative to list to offset relative to\n // its position within the DOM (if it hadn't moved).\n callback(offset);\n }\n}\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class SelectionItemController extends Controller {\n static outlets = [\"tables--selection--form\"];\n static values = {\n params: Object,\n checked: Boolean,\n };\n\n tablesSelectionFormOutletConnected(form) {\n this.checkedValue = form.isSelected(this.id);\n }\n\n change(e) {\n e.preventDefault();\n\n this.checkedValue = this.tablesSelectionFormOutlet.toggle(this.id);\n }\n\n get id() {\n return this.paramsValue.id;\n }\n\n checkedValueChanged(checked) {\n this.element.querySelector(\"input\").checked = checked;\n }\n}\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class QueryInputController extends Controller {\n static targets = [\"input\", \"highlight\"];\n static values = { query: String };\n\n connect() {\n this.queryValue = this.inputTarget.value;\n }\n\n update() {\n this.queryValue = this.inputTarget.value;\n }\n\n queryValueChanged(query) {\n this.highlightTarget.innerHTML = \"\";\n\n new Parser().parse(query).tokens.forEach((token) => {\n this.highlightTarget.appendChild(token.render());\n });\n }\n}\n\nclass Parser {\n constructor() {\n this.tokens = [];\n this.values = null;\n }\n\n parse(input) {\n const query = new StringScanner(input);\n\n while (!query.isEos()) {\n this.push(this.skipWhitespace(query));\n\n const value = this.takeTagged(query) || this.takeUntagged(query);\n\n if (!this.push(value)) break;\n }\n\n return this;\n }\n\n push(token) {\n if (token) {\n this.values ? this.values.push(token) : this.tokens.push(token);\n }\n\n return !!token;\n }\n\n skipWhitespace(query) {\n if (!query.scan(/\\s+/)) return;\n\n return new Token(query.matched());\n }\n\n takeUntagged(query) {\n if (!query.scan(/\\S+/)) return;\n\n return new Untagged(query.matched());\n }\n\n takeTagged(query) {\n if (!query.scan(/(\\w+(?:\\.\\w+)?)(:\\s*)/)) return;\n\n const key = query.valueAt(1);\n const separator = query.valueAt(2);\n\n const value =\n this.takeArrayValue(query) || this.takeSingleValue(query) || new Token();\n\n return new Tagged(key, separator, value);\n }\n\n takeArrayValue(query) {\n if (!query.scan(/\\[\\s*/)) return;\n\n const start = new Token(query.matched());\n const values = (this.values = []);\n\n while (!query.isEos()) {\n if (!this.push(this.takeSingleValue(query))) break;\n if (!this.push(this.takeDelimiter(query))) break;\n }\n\n query.scan(/\\s*]/);\n const end = new Token(query.matched());\n\n this.values = null;\n\n return new Array(start, values, end);\n }\n\n takeDelimiter(query) {\n if (!query.scan(/\\s*,\\s*/)) return;\n\n return new Token(query.matched());\n }\n\n takeSingleValue(query) {\n return this.takeQuotedValue(query) || this.takeUnquotedValue(query);\n }\n\n takeQuotedValue(query) {\n if (!query.scan(/\"([^\"]*)\"/)) return;\n\n return new Value(query.matched());\n }\n\n takeUnquotedValue(query) {\n if (!query.scan(/[^ \\],]*/)) return;\n\n return new Value(query.matched());\n }\n}\n\nclass Token {\n constructor(value = \"\") {\n this.value = value;\n }\n\n render() {\n return document.createTextNode(this.value);\n }\n}\n\nclass Value extends Token {\n render() {\n const span = document.createElement(\"span\");\n span.className = \"value\";\n span.innerText = this.value;\n\n return span;\n }\n}\n\nclass Tagged extends Token {\n constructor(key, separator, value) {\n super();\n\n this.key = key;\n this.separator = separator;\n this.value = value;\n }\n\n render() {\n const span = document.createElement(\"span\");\n span.className = \"tag\";\n\n const key = document.createElement(\"span\");\n key.className = \"key\";\n key.innerText = this.key;\n\n span.appendChild(key);\n span.appendChild(document.createTextNode(this.separator));\n span.appendChild(this.value.render());\n\n return span;\n }\n}\n\nclass Untagged extends Token {\n render() {\n const span = document.createElement(\"span\");\n span.className = \"untagged\";\n span.innerText = this.value;\n return span;\n }\n}\n\nclass Array extends Token {\n constructor(start, values, end) {\n super();\n\n this.start = start;\n this.values = values;\n this.end = end;\n }\n\n render() {\n const array = document.createElement(\"span\");\n array.className = \"array-values\";\n array.appendChild(this.start.render());\n\n this.values.forEach((value) => {\n const span = document.createElement(\"span\");\n span.appendChild(value.render());\n array.appendChild(span);\n });\n\n array.appendChild(this.end.render());\n\n return array;\n }\n}\n\nclass StringScanner {\n constructor(input) {\n this.input = input;\n this.position = 0;\n this.last = null;\n }\n\n isEos() {\n return this.position >= this.input.length;\n }\n\n scan(regex) {\n const match = regex.exec(this.input.substring(this.position));\n if (match?.index === 0) {\n this.last = match;\n this.position += match[0].length;\n return true;\n } else {\n this.last = {};\n return false;\n }\n }\n\n matched() {\n return this.last && this.last[0];\n }\n\n valueAt(index) {\n return this.last && this.last[index];\n }\n}\n","import OrderableItemController from \"./orderable/item_controller\";\nimport OrderableListController from \"./orderable/list_controller\";\nimport OrderableFormController from \"./orderable/form_controller\";\nimport SelectionFormController from \"./selection/form_controller\";\nimport SelectionItemController from \"./selection/item_controller\";\nimport QueryController from \"./query_controller\";\nimport QueryInputController from \"./query_input_controller\";\n\nconst Definitions = [\n {\n identifier: \"tables--orderable--item\",\n controllerConstructor: OrderableItemController,\n },\n {\n identifier: \"tables--orderable--list\",\n controllerConstructor: OrderableListController,\n },\n {\n identifier: \"tables--orderable--form\",\n controllerConstructor: OrderableFormController,\n },\n {\n identifier: \"tables--selection--form\",\n controllerConstructor: SelectionFormController,\n },\n {\n identifier: \"tables--selection--item\",\n controllerConstructor: SelectionItemController,\n },\n {\n identifier: \"tables--query\",\n controllerConstructor: QueryController,\n },\n {\n identifier: \"tables--query-input\",\n controllerConstructor: QueryInputController,\n },\n];\n\nexport { Definitions as default };\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class OrderableRowController extends Controller {\n static values = {\n params: Object,\n };\n\n connect() {\n // index from server may be inconsistent with the visual ordering,\n // especially if this is a new node. Use positional indexes instead,\n // as these are the values we will send on save.\n this.index = domIndex(this.row);\n }\n\n paramsValueChanged(params) {\n this.id = params.id_value;\n }\n\n dragUpdate(offset) {\n this.dragOffset = offset;\n this.row.style.position = \"relative\";\n this.row.style.top = offset + \"px\";\n this.row.style.zIndex = \"1\";\n this.row.toggleAttribute(\"dragging\", true);\n }\n\n /**\n * Called on items that are not the dragged item during drag. Updates the\n * visual position of the item relative to the dragged item.\n *\n * @param index {number} intended index of the item during drag\n */\n updateVisually(index) {\n this.row.style.position = \"relative\";\n this.row.style.top = `${\n this.row.offsetHeight * (index - this.dragIndex)\n }px`;\n }\n\n /**\n * Set the index value of the item. This is called on all items after a drop\n * event. If the index is different to the params index then this item has\n * changed.\n *\n * @param index {number} the new index value\n */\n updateIndex(index) {\n this.index = index;\n }\n\n /** Retrieve params for use in the form */\n params(scope) {\n const { id_name, id_value, index_name } = this.paramsValue;\n return [\n { name: `${scope}[${id_value}][${id_name}]`, value: this.id },\n { name: `${scope}[${id_value}][${index_name}]`, value: this.index },\n ];\n }\n\n /**\n * Restore any visual changes made during drag and remove the drag state.\n */\n reset() {\n delete this.dragOffset;\n this.row.removeAttribute(\"style\");\n this.row.removeAttribute(\"dragging\");\n }\n\n /**\n * @returns {boolean} true when the item has a change to its index value\n */\n get hasChanges() {\n return this.paramsValue.index_value !== this.index;\n }\n\n /**\n * Calculate the relative index of the item during drag. This is used to\n * sort items during drag as it takes into account any uncommitted changes\n * to index caused by the drag offset.\n *\n * @returns {number} index for the purposes of drag and drop ordering\n */\n get dragIndex() {\n if (this.dragOffset && this.dragOffset !== 0) {\n return this.index + Math.round(this.dragOffset / this.row.offsetHeight);\n } else {\n return this.index;\n }\n }\n\n /**\n * Index value for use in comparisons during drag. This is used to determine\n * whether the dragged item is above or below another item. If this item is\n * being dragged then we offset the index by 0.5 to ensure that it jumps up\n * or down when it reaches the midpoint of the item above or below it.\n *\n * @returns {number}\n */\n get comparisonIndex() {\n if (this.dragOffset) {\n return this.dragIndex + (this.dragOffset > 0 ? 0.5 : -0.5);\n } else {\n return this.index;\n }\n }\n\n /**\n * The containing row element.\n *\n * @returns {HTMLElement}\n */\n get row() {\n return this.element.parentElement;\n }\n}\n\nfunction domIndex(element) {\n return Array.from(element.parentElement.children).indexOf(element);\n}\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class OrderableFormController extends Controller {\n static values = { scope: String };\n\n add(item) {\n item.params(this.scopeValue).forEach(({ name, value }) => {\n this.element.insertAdjacentHTML(\n \"beforeend\",\n `<input type=\"hidden\" name=\"${name}\" value=\"${value}\" data-generated>`,\n );\n });\n }\n\n submit() {\n if (this.inputs.length === 0) return;\n\n this.element.requestSubmit();\n }\n\n clear() {\n this.inputs.forEach((input) => input.remove());\n }\n\n get inputs() {\n return this.element.querySelectorAll(\"input[data-generated]\");\n }\n}\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class SelectionFormController extends Controller {\n static values = {\n count: Number,\n primaryKey: { type: String, default: \"id\" },\n };\n static targets = [\"count\", \"singular\", \"plural\"];\n\n connect() {\n this.countValue = this.inputs.length;\n }\n\n /**\n * @param id to toggle\n * @return {boolean} true if selected, false if unselected\n */\n toggle(id) {\n const input = this.input(id);\n\n if (input) {\n input.remove();\n } else {\n this.element.insertAdjacentHTML(\n \"beforeend\",\n `<input type=\"hidden\" name=\"${this.primaryKeyValue}[]\" value=\"${id}\">`,\n );\n }\n\n this.countValue = this.inputs.length;\n\n return !input;\n }\n\n /**\n * @returns {boolean} true if the given id is currently selected\n */\n isSelected(id) {\n return !!this.input(id);\n }\n\n get inputs() {\n return this.element.querySelectorAll(\n `input[name=\"${this.primaryKeyValue}[]\"]`,\n );\n }\n\n input(id) {\n return this.element.querySelector(\n `input[name=\"${this.primaryKeyValue}[]\"][value=\"${id}\"]`,\n );\n }\n\n countValueChanged(count) {\n this.element.toggleAttribute(\"hidden\", count === 0);\n this.countTarget.textContent = count;\n this.singularTarget.toggleAttribute(\"hidden\", count !== 1);\n this.pluralTarget.toggleAttribute(\"hidden\", count === 1);\n }\n}\n","import { Controller } from \"@hotwired/stimulus\";\n\nexport default class QueryController extends Controller {\n static targets = [\"modal\"];\n\n disconnect() {\n delete this.pending;\n\n document.removeEventListener(\"selectionchange\", this.selection);\n }\n\n focus() {\n if (document.activeElement === this.query) return;\n\n this.query.addEventListener(\n \"focusin\",\n (e) => {\n e.target.setSelectionRange(-1, -1);\n },\n { once: true },\n );\n\n this.query.focus();\n }\n\n closeModal() {\n delete this.modalTarget.dataset.open;\n\n if (document.activeElement === this.query) document.activeElement.blur();\n\n document.removeEventListener(\"selectionchange\", this.selection);\n }\n\n openModal() {\n this.modalTarget.dataset.open = true;\n\n document.addEventListener(\"selectionchange\", this.selection);\n }\n\n clear() {\n if (this.query.value === \"\") {\n // if the user presses escape once, browser clears the input\n // if the user presses escape again, get them out of here\n this.closeModal();\n }\n }\n\n submit() {\n const hasFocus = this.isFocused;\n const position = hasFocus && this.query.selectionStart;\n\n if (this.pending) {\n clearTimeout(this.pending);\n delete this.pending;\n }\n\n // prevent an unnecessary `?q=` parameter from appearing in the URL\n if (this.query.value === \"\") {\n this.query.disabled = true;\n\n // restore input and focus after form submission\n setTimeout(() => {\n this.query.disabled = false;\n if (hasFocus) this.query.focus();\n }, 0);\n }\n\n // add/remove current cursor position\n if (hasFocus && position) {\n this.position.value = position;\n this.position.disabled = false;\n } else {\n this.position.value = \"\";\n this.position.disabled = true;\n }\n }\n\n update = () => {\n if (this.pending) clearTimeout(this.pending);\n this.pending = setTimeout(() => {\n this.element.requestSubmit();\n }, 300);\n };\n\n selection = () => {\n if (this.isFocused) this.update();\n };\n\n beforeMorphAttribute(e) {\n switch (e.detail.attributeName) {\n case \"data-open\":\n e.preventDefault();\n break;\n }\n }\n\n get query() {\n return this.element.querySelector(\"input[type=search]\");\n }\n\n get position() {\n return this.element.querySelector(\"input[name=p]\");\n }\n\n get isFocused() {\n return this.query === document.activeElement;\n }\n}\n"],"names":["DragState","constructor","list","event","id","this","cursorOffset","offsetY","initialPosition","target","offsetTop","targetId","updateCursor","row","callback","listOffset","getBoundingClientRect","top","itemPosition","clientY","updateItemPosition","updateScroll","previousScrollOffset","scrollDelta","position","Math","max","min","offsetHeight","SelectionItemController","Controller","static","params","Object","checked","Boolean","tablesSelectionFormOutletConnected","form","checkedValue","isSelected","change","e","preventDefault","tablesSelectionFormOutlet","toggle","paramsValue","checkedValueChanged","element","querySelector","Parser","tokens","values","parse","input","query","StringScanner","isEos","push","skipWhitespace","value","takeTagged","takeUntagged","token","scan","Token","matched","Untagged","key","valueAt","separator","takeArrayValue","takeSingleValue","Tagged","start","takeDelimiter","end","Array","takeQuotedValue","takeUnquotedValue","Value","render","document","createTextNode","span","createElement","className","innerText","super","appendChild","array","forEach","last","length","regex","match","exec","substring","index","Definitions","identifier","controllerConstructor","connect","from","parentElement","children","indexOf","paramsValueChanged","id_value","dragUpdate","offset","dragOffset","style","zIndex","toggleAttribute","updateVisually","dragIndex","updateIndex","scope","id_name","index_name","name","reset","removeAttribute","hasChanges","index_value","round","comparisonIndex","startDragging","dragState","addEventListener","mousemove","mouseup","window","scroll","stopDragging","removeEventListener","tablesOrderableItemOutlets","item","drop","dragItem","newIndex","targetItem","insertAdjacentElement","commitChanges","tablesOrderableFormOutlet","clear","add","submit","mousedown","isDragging","animate","ticking","requestAnimationFrame","tablesOrderableFormOutlets","tablesOrderableFormOutletConnected","tablesOrderableFormOutletDisconnected","currentItems","find","toSorted","a","b","String","scopeValue","insertAdjacentHTML","inputs","requestSubmit","remove","querySelectorAll","count","Number","primaryKey","type","default","countValue","primaryKeyValue","countValueChanged","countTarget","textContent","singularTarget","pluralTarget","disconnect","pending","selection","focus","activeElement","setSelectionRange","once","closeModal","modalTarget","dataset","open","blur","openModal","hasFocus","isFocused","selectionStart","clearTimeout","disabled","setTimeout","update","beforeMorphAttribute","detail","attributeName","queryValue","inputTarget","queryValueChanged","highlightTarget","innerHTML"],"mappings":"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"}
@@ -1,3 +1,3 @@
1
- @use "filter";
1
+ @use "query";
2
2
  @use "table";
3
3
  @use "summary";
@@ -0,0 +1,109 @@
1
+ [data-controller="tables--query"] {
2
+ position: relative;
3
+
4
+ .query-input {
5
+ display: grid;
6
+ grid-template-areas: "input button";
7
+ grid-template-columns: 1fr auto;
8
+
9
+ input[type="search"] {
10
+ grid-area: input;
11
+ background: transparent;
12
+ color: transparent;
13
+ caret-color: black;
14
+ }
15
+
16
+ button {
17
+ grid-area: button;
18
+ flex: 0;
19
+ }
20
+
21
+ .highlight {
22
+ grid-area: input;
23
+ border: 2px solid transparent;
24
+ color: black;
25
+ z-index: -1;
26
+ font-size: 1rem;
27
+ padding-block: 1px;
28
+ padding-inline: 2px;
29
+
30
+ .value {
31
+ color: #666666;
32
+ }
33
+ }
34
+ }
35
+ }
36
+
37
+ .query-modal {
38
+ position: absolute;
39
+ top: 100%;
40
+ left: 0;
41
+ right: 0;
42
+ border: 1px solid rgba(0, 0, 0, 0.16);
43
+ box-shadow:
44
+ 0 3px 6px rgba(0, 0, 0, 0.16),
45
+ 0 3px 6px rgba(0, 0, 0, 0.23);
46
+ margin-top: 0.5rem;
47
+ background: white;
48
+ border-radius: 4px;
49
+ z-index: 1;
50
+ opacity: 0;
51
+ transition: opacity 0.125s;
52
+ pointer-events: none;
53
+ display: grid;
54
+ grid-template-areas: "header" "content" "footer";
55
+ grid-template-rows: auto 1fr auto;
56
+
57
+ &[data-open] {
58
+ opacity: 1;
59
+ pointer-events: unset;
60
+ }
61
+
62
+ header {
63
+ grid-area: header;
64
+ }
65
+
66
+ .content {
67
+ grid-area: content;
68
+ padding-inline: 1rem;
69
+ padding-block: 0.5rem 0;
70
+ }
71
+
72
+ dl {
73
+ display: grid;
74
+ grid-auto-flow: row;
75
+ grid-auto-rows: 1fr;
76
+ grid-template-columns: 1fr 4fr;
77
+ }
78
+
79
+ dt {
80
+ grid-column-start: 1;
81
+ font-weight: bold;
82
+ }
83
+
84
+ dd {
85
+ color: #666;
86
+ }
87
+
88
+ ul {
89
+ list-style: none;
90
+ padding-left: 0;
91
+ }
92
+
93
+ .error {
94
+ background: #fff2f2;
95
+ border-bottom: 1px solid #fdd3d3;
96
+ padding: 0.5rem 1rem;
97
+
98
+ code {
99
+ font-weight: bold;
100
+ }
101
+ }
102
+
103
+ .footer {
104
+ grid-area: footer;
105
+ display: flex;
106
+ justify-content: flex-end;
107
+ padding-block: 1rem;
108
+ }
109
+ }