gantt-lib 0.6.2 → 0.7.1
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.
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +29 -2
- package/dist/index.d.ts +29 -2
- package/dist/index.js +311 -70
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +309 -70
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +112 -32
- package/package.json +1 -1
package/dist/styles.css
CHANGED
|
@@ -135,8 +135,8 @@
|
|
|
135
135
|
user-select: none;
|
|
136
136
|
}
|
|
137
137
|
.gantt-datepicker-trigger:hover {
|
|
138
|
-
background-color:
|
|
139
|
-
border-radius:
|
|
138
|
+
background-color: transparent;
|
|
139
|
+
border-radius: 0;
|
|
140
140
|
}
|
|
141
141
|
.gantt-datepicker-trigger:focus-visible {
|
|
142
142
|
outline: none;
|
|
@@ -277,7 +277,7 @@
|
|
|
277
277
|
--gantt-parent-bar-radius: 8px;
|
|
278
278
|
--gantt-parent-ear-depth: 6px;
|
|
279
279
|
--gantt-parent-ear-width: 8px;
|
|
280
|
-
--gantt-parent-row-bg:
|
|
280
|
+
--gantt-parent-row-bg: rgb(120 47 196 / 0.15);
|
|
281
281
|
}
|
|
282
282
|
|
|
283
283
|
/* src/components/TimeScaleHeader/TimeScaleHeader.css */
|
|
@@ -642,6 +642,9 @@
|
|
|
642
642
|
flex-shrink: 0;
|
|
643
643
|
pointer-events: auto;
|
|
644
644
|
}
|
|
645
|
+
.gantt-tl-overlay.gantt-tl-overlay-shadowed {
|
|
646
|
+
box-shadow: 10px 0 18px -14px rgba(15, 23, 42, 0.45);
|
|
647
|
+
}
|
|
645
648
|
.gantt-tl-overlay.gantt-tl-hidden {
|
|
646
649
|
display: none;
|
|
647
650
|
}
|
|
@@ -649,6 +652,7 @@
|
|
|
649
652
|
display: flex;
|
|
650
653
|
flex-direction: column;
|
|
651
654
|
height: 100%;
|
|
655
|
+
min-width: 640px;
|
|
652
656
|
}
|
|
653
657
|
.gantt-tl-header {
|
|
654
658
|
position: sticky;
|
|
@@ -684,34 +688,45 @@
|
|
|
684
688
|
position: relative;
|
|
685
689
|
}
|
|
686
690
|
.gantt-tl-row:hover {
|
|
687
|
-
|
|
691
|
+
box-shadow: inset 0 0 0 9999px rgba(17, 24, 39, 0.04);
|
|
688
692
|
}
|
|
689
693
|
.gantt-tl-row-selected {
|
|
690
|
-
|
|
694
|
+
box-shadow: inset 0 0 0 9999px rgba(17, 24, 39, 0.08);
|
|
691
695
|
}
|
|
692
696
|
.gantt-tl-row-child {
|
|
693
|
-
padding-left:
|
|
697
|
+
padding-left: 0;
|
|
694
698
|
}
|
|
695
699
|
.gantt-tl-row-parent {
|
|
696
700
|
font-weight: 600;
|
|
697
|
-
background-color: var(--gantt-parent-row-bg,
|
|
701
|
+
background-color: var(--gantt-parent-row-bg, rgb(120 47 196 / 0.15));
|
|
698
702
|
}
|
|
699
703
|
.gantt-tl-collapse-btn {
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
+
position: absolute;
|
|
705
|
+
left: 4px;
|
|
706
|
+
top: 50%;
|
|
707
|
+
transform: translateY(-50%);
|
|
708
|
+
z-index: 2;
|
|
709
|
+
width: 18px;
|
|
710
|
+
height: 18px;
|
|
711
|
+
border: none;
|
|
712
|
+
background: transparent;
|
|
704
713
|
border-radius: 4px;
|
|
705
714
|
cursor: pointer;
|
|
706
715
|
display: flex;
|
|
707
716
|
align-items: center;
|
|
708
717
|
justify-content: center;
|
|
709
|
-
font-size: 14px;
|
|
710
|
-
font-weight: bold;
|
|
711
718
|
color: var(--gantt-text-color, #374151);
|
|
719
|
+
padding: 0;
|
|
720
|
+
transition: background-color 0.15s ease;
|
|
712
721
|
}
|
|
713
722
|
.gantt-tl-collapse-btn:hover {
|
|
714
|
-
background-color:
|
|
723
|
+
background-color: transparent;
|
|
724
|
+
}
|
|
725
|
+
.gantt-tl-collapse-btn svg {
|
|
726
|
+
transition: transform 0.15s ease;
|
|
727
|
+
}
|
|
728
|
+
.gantt-tl-collapse-btn:not(.gantt-tl-collapse-btn-collapsed) svg {
|
|
729
|
+
transform: rotate(90deg);
|
|
715
730
|
}
|
|
716
731
|
.gantt-tl-cell {
|
|
717
732
|
display: flex;
|
|
@@ -726,12 +741,12 @@
|
|
|
726
741
|
border-right: none;
|
|
727
742
|
}
|
|
728
743
|
.gantt-tl-cell-number {
|
|
729
|
-
width:
|
|
744
|
+
width: 32px;
|
|
730
745
|
display: flex;
|
|
731
746
|
align-items: center;
|
|
732
747
|
justify-content: center;
|
|
733
748
|
gap: 0;
|
|
734
|
-
padding: 0
|
|
749
|
+
padding: 0 2px;
|
|
735
750
|
flex-shrink: 0;
|
|
736
751
|
cursor: pointer;
|
|
737
752
|
position: relative;
|
|
@@ -749,7 +764,7 @@
|
|
|
749
764
|
color: #9ca3af;
|
|
750
765
|
visibility: hidden;
|
|
751
766
|
user-select: none;
|
|
752
|
-
background:
|
|
767
|
+
background: transparent;
|
|
753
768
|
}
|
|
754
769
|
.gantt-tl-row:hover .gantt-tl-drag-handle,
|
|
755
770
|
.gantt-tl-row-dragging .gantt-tl-drag-handle {
|
|
@@ -758,6 +773,9 @@
|
|
|
758
773
|
.gantt-tl-row:hover .gantt-tl-num-label {
|
|
759
774
|
visibility: hidden;
|
|
760
775
|
}
|
|
776
|
+
.gantt-tl-num-label {
|
|
777
|
+
font-size: 0.75rem;
|
|
778
|
+
}
|
|
761
779
|
.gantt-tl-drag-handle:active {
|
|
762
780
|
cursor: grabbing;
|
|
763
781
|
}
|
|
@@ -787,7 +805,7 @@
|
|
|
787
805
|
}
|
|
788
806
|
.gantt-tl-cell-name {
|
|
789
807
|
flex: 1;
|
|
790
|
-
min-width:
|
|
808
|
+
min-width: 160px;
|
|
791
809
|
position: relative;
|
|
792
810
|
overflow: visible;
|
|
793
811
|
align-items: center;
|
|
@@ -800,25 +818,79 @@
|
|
|
800
818
|
position: relative;
|
|
801
819
|
padding: 0;
|
|
802
820
|
}
|
|
821
|
+
.gantt-tl-cell-duration {
|
|
822
|
+
width: 46px;
|
|
823
|
+
flex-shrink: 0;
|
|
824
|
+
justify-content: center;
|
|
825
|
+
padding: 0 4px;
|
|
826
|
+
cursor: pointer;
|
|
827
|
+
position: relative;
|
|
828
|
+
overflow: visible;
|
|
829
|
+
font-variant-numeric: tabular-nums;
|
|
830
|
+
}
|
|
803
831
|
.gantt-tl-cell-progress {
|
|
804
|
-
width:
|
|
832
|
+
width: 56px;
|
|
805
833
|
flex-shrink: 0;
|
|
806
|
-
justify-content:
|
|
807
|
-
padding
|
|
834
|
+
justify-content: center;
|
|
835
|
+
padding: 0 4px;
|
|
808
836
|
cursor: pointer;
|
|
809
837
|
position: relative;
|
|
810
838
|
overflow: visible;
|
|
839
|
+
font-variant-numeric: tabular-nums;
|
|
811
840
|
}
|
|
812
|
-
.gantt-tl-
|
|
841
|
+
.gantt-tl-number-editor {
|
|
813
842
|
position: absolute;
|
|
814
|
-
|
|
815
|
-
|
|
843
|
+
inset: 0;
|
|
844
|
+
}
|
|
845
|
+
.gantt-tl-number-input {
|
|
816
846
|
width: 100%;
|
|
817
847
|
height: 100%;
|
|
818
|
-
|
|
819
|
-
border-
|
|
820
|
-
|
|
821
|
-
|
|
848
|
+
padding: 0 18px 0 6px;
|
|
849
|
+
border-width: 1px;
|
|
850
|
+
border-color: #93c5fd;
|
|
851
|
+
border-radius: 8px;
|
|
852
|
+
text-align: left;
|
|
853
|
+
font-size: 0.8rem;
|
|
854
|
+
line-height: 1;
|
|
855
|
+
box-shadow: 0 0 0 1px rgba(147, 197, 253, 0.35);
|
|
856
|
+
}
|
|
857
|
+
.gantt-tl-number-input::-webkit-outer-spin-button,
|
|
858
|
+
.gantt-tl-number-input::-webkit-inner-spin-button {
|
|
859
|
+
-webkit-appearance: none;
|
|
860
|
+
margin: 0;
|
|
861
|
+
}
|
|
862
|
+
.gantt-tl-number-input[type=number] {
|
|
863
|
+
-moz-appearance: textfield;
|
|
864
|
+
}
|
|
865
|
+
.gantt-tl-number-steppers {
|
|
866
|
+
position: absolute;
|
|
867
|
+
top: 2px;
|
|
868
|
+
right: 2px;
|
|
869
|
+
bottom: 2px;
|
|
870
|
+
width: 14px;
|
|
871
|
+
display: flex;
|
|
872
|
+
flex-direction: column;
|
|
873
|
+
gap: 1px;
|
|
874
|
+
}
|
|
875
|
+
.gantt-tl-number-stepper {
|
|
876
|
+
flex: 1;
|
|
877
|
+
display: inline-flex;
|
|
878
|
+
align-items: center;
|
|
879
|
+
justify-content: center;
|
|
880
|
+
border: none;
|
|
881
|
+
border-radius: 5px;
|
|
882
|
+
background: rgba(248, 250, 252, 0.95);
|
|
883
|
+
color: #64748b;
|
|
884
|
+
padding: 0;
|
|
885
|
+
cursor: pointer;
|
|
886
|
+
transition: background-color 0.15s ease, color 0.15s ease;
|
|
887
|
+
}
|
|
888
|
+
.gantt-tl-number-stepper:hover {
|
|
889
|
+
background: #dbeafe;
|
|
890
|
+
color: #1d4ed8;
|
|
891
|
+
}
|
|
892
|
+
.gantt-tl-number-stepper:active {
|
|
893
|
+
background: #bfdbfe;
|
|
822
894
|
}
|
|
823
895
|
.gantt-tl-name-trigger {
|
|
824
896
|
display: -webkit-box;
|
|
@@ -831,6 +903,7 @@
|
|
|
831
903
|
font-size: 0.8rem;
|
|
832
904
|
line-height: 1.2;
|
|
833
905
|
font-family: inherit;
|
|
906
|
+
font-weight: inherit;
|
|
834
907
|
color: #374151;
|
|
835
908
|
background: transparent;
|
|
836
909
|
border: none;
|
|
@@ -841,11 +914,15 @@
|
|
|
841
914
|
word-break: break-word;
|
|
842
915
|
box-sizing: border-box;
|
|
843
916
|
}
|
|
844
|
-
.gantt-tl-name-trigger
|
|
845
|
-
|
|
917
|
+
.gantt-tl-name-trigger-parent {
|
|
918
|
+
padding-left: 26px;
|
|
919
|
+
}
|
|
920
|
+
.gantt-tl-name-trigger-child {
|
|
921
|
+
padding-left: 24px;
|
|
846
922
|
}
|
|
923
|
+
.gantt-tl-name-trigger:hover,
|
|
847
924
|
.gantt-tl-name-trigger:active {
|
|
848
|
-
background-color:
|
|
925
|
+
background-color: transparent;
|
|
849
926
|
}
|
|
850
927
|
.gantt-tl-name-input {
|
|
851
928
|
position: absolute;
|
|
@@ -853,13 +930,16 @@
|
|
|
853
930
|
left: 0;
|
|
854
931
|
z-index: 100;
|
|
855
932
|
height: 100%;
|
|
856
|
-
min-width:
|
|
933
|
+
min-width: 520px;
|
|
857
934
|
width: 100%;
|
|
858
935
|
border-width: 2px;
|
|
859
936
|
border-color: #3b82f6;
|
|
860
937
|
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
|
|
861
938
|
white-space: nowrap;
|
|
862
939
|
}
|
|
940
|
+
.gantt-tl-name-input-child {
|
|
941
|
+
padding-left: 24px;
|
|
942
|
+
}
|
|
863
943
|
.gantt-tl-name-input:focus {
|
|
864
944
|
box-shadow: 0 2px 10px rgba(59, 130, 246, 0.3);
|
|
865
945
|
}
|