katalyst-tables 3.3.0 → 3.3.2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +1 -1
- data/app/assets/builds/katalyst/tables.esm.js +332 -6
- data/app/assets/builds/katalyst/tables.js +332 -6
- data/app/assets/builds/katalyst/tables.min.js +1 -1
- data/app/assets/builds/katalyst/tables.min.js.map +1 -1
- data/app/assets/stylesheets/katalyst/tables/_index.scss +1 -1
- data/app/assets/stylesheets/katalyst/tables/_query.scss +109 -0
- data/app/assets/stylesheets/katalyst/tables/typed-columns/_date.scss +1 -1
- data/app/assets/stylesheets/katalyst/tables/typed-columns/_datetime.scss +1 -1
- data/app/components/katalyst/table_component.rb +13 -2
- data/app/components/katalyst/tables/cells/currency_component.rb +21 -2
- data/app/components/katalyst/tables/cells/number_component.rb +31 -1
- data/app/components/katalyst/tables/query/input_component.html.erb +12 -0
- data/app/components/katalyst/tables/query/input_component.rb +46 -0
- data/app/components/katalyst/tables/query/modal_component.html.erb +33 -0
- data/app/components/katalyst/tables/query/modal_component.rb +89 -0
- data/app/components/katalyst/tables/query_component.html.erb +8 -0
- data/app/components/katalyst/tables/{filter_component.rb → query_component.rb} +37 -30
- data/app/controllers/concerns/katalyst/tables/backend.rb +14 -0
- data/app/helpers/katalyst/tables/frontend.rb +14 -8
- data/app/javascript/tables/application.js +8 -3
- data/app/javascript/tables/query_controller.js +108 -0
- data/app/javascript/tables/query_input_controller.js +228 -0
- data/app/models/concerns/katalyst/tables/collection/core.rb +5 -3
- data/app/models/concerns/katalyst/tables/collection/query/array_value_parser.rb +13 -26
- data/app/models/concerns/katalyst/tables/collection/query/parser.rb +16 -13
- data/app/models/concerns/katalyst/tables/collection/query/single_value_parser.rb +11 -3
- data/app/models/concerns/katalyst/tables/collection/query/value_parser.rb +10 -5
- data/app/models/concerns/katalyst/tables/collection/query.rb +44 -6
- data/app/models/concerns/katalyst/tables/collection/sorting.rb +11 -1
- data/app/models/katalyst/tables/collection/base.rb +10 -0
- data/app/models/katalyst/tables/collection/filter.rb +10 -0
- data/app/models/katalyst/tables/collection/type/boolean.rb +11 -1
- data/app/models/katalyst/tables/collection/type/date.rb +19 -22
- data/app/models/katalyst/tables/collection/type/enum.rb +11 -0
- data/app/models/katalyst/tables/collection/type/float.rb +3 -39
- data/app/models/katalyst/tables/collection/type/helpers/delegate.rb +2 -22
- data/app/models/katalyst/tables/collection/type/helpers/extensions.rb +14 -0
- data/app/models/katalyst/tables/collection/type/helpers/multiple.rb +30 -0
- data/app/models/katalyst/tables/collection/type/helpers/range.rb +59 -0
- data/app/models/katalyst/tables/collection/type/integer.rb +3 -39
- data/app/models/katalyst/tables/collection/type/value.rb +22 -2
- metadata +12 -8
- data/app/assets/stylesheets/katalyst/tables/_filter.scss +0 -43
- data/app/components/katalyst/tables/filter/modal_component.html.erb +0 -25
- data/app/components/katalyst/tables/filter/modal_component.rb +0 -112
- data/app/components/katalyst/tables/filter_component.html.erb +0 -18
- data/app/javascript/tables/filter/modal_controller.js +0 -13
@@ -533,15 +533,337 @@ class SelectionItemController extends Controller {
|
|
533
533
|
}
|
534
534
|
}
|
535
535
|
|
536
|
-
class
|
536
|
+
class QueryController extends Controller {
|
537
537
|
static targets = ["modal"];
|
538
538
|
|
539
|
-
|
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
|
-
|
544
|
-
this.
|
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--
|
571
|
-
controllerConstructor:
|
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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"}
|
@@ -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
|
+
}
|