@ollap/gantt-vue3 0.3.3 → 0.3.5

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 (5) hide show
  1. package/dist/gantt-vue3.css +1 -1
  2. package/dist/gantt-vue3.d.ts +15 -1
  3. package/dist/gantt-vue3.js +210 -179
  4. package/dist/gantt-vue3.umd.cjs +1 -1
  5. package/package.json +7 -7
package/dist/gantt-vue3.css CHANGED
@@ -1 +1 @@
1
- /*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial}}}:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--color-orange-400:oklch(75% .183 55.934);--color-blue-400:oklch(70.7% .165 254.624);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wider:.05em;--radius-md:.375rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1)}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.-top-1{top:calc(var(--spacing)*-1)}.top-0{top:calc(var(--spacing)*0)}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing)*2)}.right-0{right:calc(var(--spacing)*0)}.right-4{right:calc(var(--spacing)*4)}.bottom-0{bottom:calc(var(--spacing)*0)}.bottom-2{bottom:calc(var(--spacing)*2)}.bottom-4{bottom:calc(var(--spacing)*4)}.-left-\[6px\]{left:-6px}.left-0{left:calc(var(--spacing)*0)}.left-2{left:calc(var(--spacing)*2)}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.mr-1\.5{margin-right:calc(var(--spacing)*1.5)}.mr-2{margin-right:calc(var(--spacing)*2)}.flex{display:flex}.inline-block{display:inline-block}.h-0{height:calc(var(--spacing)*0)}.h-3{height:calc(var(--spacing)*3)}.h-4{height:calc(var(--spacing)*4)}.h-12{height:calc(var(--spacing)*12)}.h-full{height:100%}.w-0{width:calc(var(--spacing)*0)}.w-1{width:calc(var(--spacing)*1)}.w-3{width:calc(var(--spacing)*3)}.w-4{width:calc(var(--spacing)*4)}.min-w-0{min-width:calc(var(--spacing)*0)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.-translate-y-1\/2{--tw-translate-y: -50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.rotate-90{rotate:90deg}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.cursor-col-resize{cursor:col-resize}.cursor-pointer{cursor:pointer}.resize{resize:both}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-md{border-radius:var(--radius-md)}.rounded-l{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.border{border-style:var(--tw-border-style);border-width:1px}.border-t-\[6px\]{border-top-style:var(--tw-border-style);border-top-width:6px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-r-\[5px\]{border-right-style:var(--tw-border-style);border-right-width:5px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-2{border-left-style:var(--tw-border-style);border-left-width:2px}.border-l-\[5px\]{border-left-style:var(--tw-border-style);border-left-width:5px}.border-\[\#e8e8e8\]{border-color:#e8e8e8}.border-orange-400{border-color:var(--color-orange-400)}.border-slate-50{border-color:var(--color-slate-50)}.border-slate-100{border-color:var(--color-slate-100)}.border-slate-100\/50{border-color:#f1f5f980}@supports (color:color-mix(in lab,red,red)){.border-slate-100\/50{border-color:color-mix(in oklab,var(--color-slate-100)50%,transparent)}}.border-slate-200{border-color:var(--color-slate-200)}.border-t-orange-400{border-top-color:var(--color-orange-400)}.border-r-transparent{border-right-color:#0000}.border-l-transparent{border-left-color:#0000}.bg-black\/80{background-color:#000c}@supports (color:color-mix(in lab,red,red)){.bg-black\/80{background-color:color-mix(in oklab,var(--color-black)80%,transparent)}}.bg-orange-400{background-color:var(--color-orange-400)}.bg-slate-50{background-color:var(--color-slate-50)}.bg-slate-50\/50{background-color:#f8fafc80}@supports (color:color-mix(in lab,red,red)){.bg-slate-50\/50{background-color:color-mix(in oklab,var(--color-slate-50)50%,transparent)}}.bg-slate-300{background-color:var(--color-slate-300)}.bg-slate-400{background-color:var(--color-slate-400)}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing)*2)}.px-1\.5{padding-inline:calc(var(--spacing)*1.5)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-0\.5{padding-block:calc(var(--spacing)*.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-4{padding-block:calc(var(--spacing)*4)}.pr-4{padding-right:calc(var(--spacing)*4)}.font-sans{font-family:var(--font-sans)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.whitespace-nowrap{white-space:nowrap}.text-slate-400{color:var(--color-slate-400)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-white{color:var(--color-white)}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-80{opacity:.8}.shadow-\[10px_0_15px_-3px_rgba\(0\,0\,0\,0\.1\)\]{--tw-shadow:10px 0 15px -3px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}@media(hover:hover){.group-hover\:bg-blue-400:is(:where(.group):hover *){background-color:var(--color-blue-400)}.hover\:-translate-y-0\.5:hover{--tw-translate-y:calc(var(--spacing)*-.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.hover\:bg-blue-400:hover{background-color:var(--color-blue-400)}.hover\:bg-slate-50:hover{background-color:var(--color-slate-50)}.hover\:bg-white:hover{background-color:var(--color-white)}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}.no-scrollbar[data-v-d9bcafb4]::-webkit-scrollbar{display:none}.no-scrollbar[data-v-d9bcafb4]{-ms-overflow-style:none;scrollbar-width:none}.overflow-auto[data-v-d9bcafb4]::-webkit-scrollbar{width:6px;height:6px}.overflow-auto[data-v-d9bcafb4]::-webkit-scrollbar-track{background:transparent}.overflow-auto[data-v-d9bcafb4]::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}.overflow-auto[data-v-d9bcafb4]::-webkit-scrollbar-thumb:hover{background:#94a3b8}
1
+ /*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-border-style:solid;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial}}}:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--color-orange-400:oklch(75% .183 55.934);--color-blue-400:oklch(70.7% .165 254.624);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wider:.05em;--radius-md:.375rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1)}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.-top-1{top:calc(var(--spacing)*-1)}.top-0{top:calc(var(--spacing)*0)}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing)*2)}.top-4{top:calc(var(--spacing)*4)}.right-0{right:calc(var(--spacing)*0)}.right-4{right:calc(var(--spacing)*4)}.bottom-0{bottom:calc(var(--spacing)*0)}.bottom-2{bottom:calc(var(--spacing)*2)}.bottom-4{bottom:calc(var(--spacing)*4)}.-left-\[6px\]{left:-6px}.left-0{left:calc(var(--spacing)*0)}.left-1{left:calc(var(--spacing)*1)}.left-2{left:calc(var(--spacing)*2)}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.mr-1\.5{margin-right:calc(var(--spacing)*1.5)}.mr-2{margin-right:calc(var(--spacing)*2)}.flex{display:flex}.inline-block{display:inline-block}.h-0{height:calc(var(--spacing)*0)}.h-3{height:calc(var(--spacing)*3)}.h-4{height:calc(var(--spacing)*4)}.h-12{height:calc(var(--spacing)*12)}.h-full{height:100%}.w-0{width:calc(var(--spacing)*0)}.w-1{width:calc(var(--spacing)*1)}.w-3{width:calc(var(--spacing)*3)}.w-4{width:calc(var(--spacing)*4)}.min-w-0{min-width:calc(var(--spacing)*0)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.-translate-y-1\/2{--tw-translate-y: -50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.rotate-90{rotate:90deg}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.cursor-col-resize{cursor:col-resize}.cursor-pointer{cursor:pointer}.resize{resize:both}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.gap-4{gap:calc(var(--spacing)*4)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-md{border-radius:var(--radius-md)}.rounded-l{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.border{border-style:var(--tw-border-style);border-width:1px}.border-t-\[6px\]{border-top-style:var(--tw-border-style);border-top-width:6px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-r-\[5px\]{border-right-style:var(--tw-border-style);border-right-width:5px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-2{border-left-style:var(--tw-border-style);border-left-width:2px}.border-l-\[5px\]{border-left-style:var(--tw-border-style);border-left-width:5px}.border-\[\#e8e8e8\]{border-color:#e8e8e8}.border-orange-400{border-color:var(--color-orange-400)}.border-slate-50{border-color:var(--color-slate-50)}.border-slate-100{border-color:var(--color-slate-100)}.border-slate-100\/50{border-color:#f1f5f980}@supports (color:color-mix(in lab,red,red)){.border-slate-100\/50{border-color:color-mix(in oklab,var(--color-slate-100)50%,transparent)}}.border-slate-200{border-color:var(--color-slate-200)}.border-t-orange-400{border-top-color:var(--color-orange-400)}.border-r-transparent{border-right-color:#0000}.border-l-transparent{border-left-color:#0000}.bg-black\/80{background-color:#000c}@supports (color:color-mix(in lab,red,red)){.bg-black\/80{background-color:color-mix(in oklab,var(--color-black)80%,transparent)}}.bg-orange-400{background-color:var(--color-orange-400)}.bg-slate-50{background-color:var(--color-slate-50)}.bg-slate-50\/50{background-color:#f8fafc80}@supports (color:color-mix(in lab,red,red)){.bg-slate-50\/50{background-color:color-mix(in oklab,var(--color-slate-50)50%,transparent)}}.bg-slate-300{background-color:var(--color-slate-300)}.bg-slate-400{background-color:var(--color-slate-400)}.bg-white{background-color:var(--color-white)}.p-2{padding:calc(var(--spacing)*2)}.px-1\.5{padding-inline:calc(var(--spacing)*1.5)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.py-0\.5{padding-block:calc(var(--spacing)*.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-4{padding-block:calc(var(--spacing)*4)}.pr-4{padding-right:calc(var(--spacing)*4)}.font-sans{font-family:var(--font-sans)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.whitespace-nowrap{white-space:nowrap}.text-slate-400{color:var(--color-slate-400)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-white{color:var(--color-white)}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-80{opacity:.8}.shadow-\[10px_0_15px_-3px_rgba\(0\,0\,0\,0\.1\)\]{--tw-shadow:10px 0 15px -3px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}@media(hover:hover){.group-hover\:bg-blue-400:is(:where(.group):hover *){background-color:var(--color-blue-400)}.hover\:-translate-y-0\.5:hover{--tw-translate-y:calc(var(--spacing)*-.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.hover\:bg-blue-400:hover{background-color:var(--color-blue-400)}.hover\:bg-slate-50:hover{background-color:var(--color-slate-50)}.hover\:bg-white:hover{background-color:var(--color-white)}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}.no-scrollbar[data-v-05d54120]::-webkit-scrollbar{display:none}.no-scrollbar[data-v-05d54120]{-ms-overflow-style:none;scrollbar-width:none}.overflow-auto[data-v-05d54120]::-webkit-scrollbar{width:6px;height:6px}.overflow-auto[data-v-05d54120]::-webkit-scrollbar-track{background:transparent}.overflow-auto[data-v-05d54120]::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:10px}.overflow-auto[data-v-05d54120]::-webkit-scrollbar-thumb:hover{background:#94a3b8}
package/dist/gantt-vue3.d.ts CHANGED
@@ -4,7 +4,9 @@ import { CSSProperties } from 'vue';
4
4
  import { DefineComponent } from 'vue';
5
5
  import { PublicProps } from 'vue';
6
6
 
7
- declare const __VLS_component: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
7
+ declare const __VLS_component: DefineComponent<__VLS_Props, {
8
+ getExpandedMapId: () => Map<any, any>;
9
+ }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
8
10
  "update:list": (args_0: GanttItem[]) => any;
9
11
  toggle: (args_0: string | number) => any;
10
12
  }, string, PublicProps, Readonly<__VLS_Props> & Readonly<{
@@ -35,6 +37,9 @@ declare function __VLS_template(): {
35
37
  leftPanelItem?(_: {
36
38
  item: any;
37
39
  }): any;
40
+ leftPanelItemTask?(_: {
41
+ item: any;
42
+ }): any;
38
43
  count?(_: {
39
44
  style: {
40
45
  left: string;
@@ -52,6 +57,7 @@ declare function __VLS_template(): {
52
57
  left: string;
53
58
  width: string;
54
59
  position: string;
60
+ getTimelinePos: (timeline: Timeline) => number | null;
55
61
  };
56
62
  }): any;
57
63
  };
@@ -93,6 +99,14 @@ export declare type Task = {
93
99
  color?: CSSProperties['color'];
94
100
  children?: Task[];
95
101
  expanded?: boolean;
102
+ timelines?: Timeline[];
103
+ };
104
+
105
+ export declare type Timeline = {
106
+ id?: string | number;
107
+ name: string;
108
+ time: Date;
109
+ color: CSSProperties['color'];
96
110
  };
97
111
 
98
112
  export { }
package/dist/gantt-vue3.js CHANGED
@@ -1,10 +1,10 @@
1
- import { defineComponent as ie, ref as f, watch as Q, computed as g, onMounted as de, onUnmounted as ce, createElementBlock as r, openBlock as i, createElementVNode as n, createCommentVNode as A, normalizeStyle as a, renderSlot as T, createTextVNode as ue, Fragment as S, renderList as $, toDisplayString as w, withDirectives as Z, normalizeClass as ee, vShow as te, withModifiers as ve, nextTick as se } from "vue";
2
- const pe = "0.3.3", he = {
3
- version: pe
4
- }, fe = { class: "bg-white border border-slate-200 overflow-hidden flex-1 flex flex-col" }, xe = { class: "flex border-b border-slate-200 bg-slate-50/50" }, ge = { class: "text-[10px] tracking-wider text-slate-400" }, ye = { class: "text-xs font-semibold text-slate-400" }, be = { class: "flex flex-1 overflow-hidden" }, me = ["onClick"], we = { class: "mr-2 w-4 h-4" }, _e = { class: "min-w-0" }, De = { class: "text-sm font-semibold text-slate-700 truncate" }, ke = ["onClick"], Te = {
1
+ import { defineComponent as ce, ref as f, watch as Z, computed as g, onMounted as ue, onUnmounted as pe, createElementBlock as r, openBlock as i, createElementVNode as a, createCommentVNode as A, normalizeStyle as l, renderSlot as _, createTextVNode as ve, Fragment as k, renderList as E, toDisplayString as y, withDirectives as ee, normalizeClass as te, vShow as se, withModifiers as he, nextTick as ae } from "vue";
2
+ const fe = "0.3.5", xe = {
3
+ version: fe
4
+ }, ge = { class: "bg-white border border-slate-200 overflow-hidden flex-1 flex flex-col" }, ye = { class: "flex border-b border-slate-200 bg-slate-50/50" }, be = { class: "text-[10px] tracking-wider text-slate-400" }, me = { class: "text-xs font-semibold text-slate-400" }, we = { class: "flex flex-1 overflow-hidden" }, _e = ["onClick"], ke = { class: "mr-2 w-4 h-4" }, De = { class: "min-w-0" }, Te = { class: "text-sm font-semibold text-slate-700 truncate" }, Se = ["onClick"], Ee = {
5
5
  key: 1,
6
6
  class: "mr-1.5 w-3 h-3 inline-block"
7
- }, Se = { class: "text-xs truncate select-none" }, Ee = { class: "truncate" }, c = 60, h = 52, Ce = 150, Re = 600, $e = 256, Le = /* @__PURE__ */ ie({
7
+ }, $e = { class: "text-xs truncate select-none flex gap-4" }, Ce = { class: "truncate" }, Ie = { class: "absolute top-0 bottom-2 left-0 right-0" }, Oe = { class: "absolute left-1 top-0 text-xs whitespace-nowrap" }, d = 60, h = 52, Re = 150, Le = 600, Me = 256, ze = /* @__PURE__ */ ce({
8
8
  __name: "GanttChart",
9
9
  props: {
10
10
  list: {},
@@ -14,54 +14,54 @@ const pe = "0.3.3", he = {
14
14
  defaultLeftPanelWidth: {}
15
15
  },
16
16
  emits: ["update:list", "toggle"],
17
- setup(_, { emit: L }) {
18
- const u = _, O = (t, s) => u.shouldCalculate ? u.shouldCalculate(t, s) : !0, I = L, p = f([]), M = f(JSON.parse(JSON.stringify(u.list)));
19
- Q(
20
- () => u.list,
17
+ setup(D, { expose: L, emit: $ }) {
18
+ const v = D, M = (t, s) => v.shouldCalculate ? v.shouldCalculate(t, s) : !0, ne = $, u = f([]), z = f(JSON.parse(JSON.stringify(v.list)));
19
+ Z(
20
+ () => v.list,
21
21
  () => {
22
- M.value = JSON.parse(JSON.stringify(u.list));
22
+ z.value = JSON.parse(JSON.stringify(v.list));
23
23
  }
24
24
  );
25
- const E = f(u.defaultLeftPanelWidth ?? $e), z = f(!1), ne = (t) => {
26
- z.value = !0;
27
- const s = t.clientX, e = E.value, l = (v) => {
28
- if (!z.value) return;
29
- const d = v.clientX - s, R = e + d;
30
- E.value = Math.max(Ce, Math.min(Re, R));
25
+ const C = f(v.defaultLeftPanelWidth ?? Me), P = f(!1), le = (t) => {
26
+ P.value = !0;
27
+ const s = t.clientX, e = C.value, n = (p) => {
28
+ if (!P.value) return;
29
+ const c = p.clientX - s, R = e + c;
30
+ C.value = Math.max(Re, Math.min(Le, R));
31
31
  }, o = () => {
32
- z.value = !1, document.removeEventListener("mousemove", l), document.removeEventListener("mouseup", o), document.body.style.cursor = "", document.body.style.userSelect = "";
32
+ P.value = !1, document.removeEventListener("mousemove", n), document.removeEventListener("mouseup", o), document.body.style.cursor = "", document.body.style.userSelect = "";
33
33
  };
34
- document.addEventListener("mousemove", l), document.addEventListener("mouseup", o), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", t.preventDefault();
35
- }, y = g(() => p.value.length * c), le = g(() => ({
36
- backgroundImage: `linear-gradient(to right, transparent ${c - 1}px, #e8e8e8 ${c - 1}px, #e8e8e8 ${c}px)`,
34
+ document.addEventListener("mousemove", n), document.addEventListener("mouseup", o), document.body.style.cursor = "col-resize", document.body.style.userSelect = "none", t.preventDefault();
35
+ }, b = g(() => u.value.length * d), oe = g(() => ({
36
+ backgroundImage: `linear-gradient(to right, transparent ${d - 1}px, #e8e8e8 ${d - 1}px, #e8e8e8 ${d}px)`,
37
37
  // backgroundImage: `linear-gradient(to right, #e8e8e8 1px, transparent 1px)`,
38
- backgroundSize: `${c}px 100%`,
38
+ backgroundSize: `${d}px 100%`,
39
39
  // backgroundRepeat: 'repeat-y',
40
40
  // backgroundPosition: `${CELL_WIDTH}px 0`,
41
- width: y.value + "px"
42
- })), ae = g(() => {
43
- const t = {}, s = (e, l) => {
44
- if (!l.startDate || !l.endDate || !O(e, l)) return;
45
- let o = new Date(l.startDate);
46
- const v = new Date(l.endDate);
47
- for (; o <= v; ) {
48
- const d = o.toISOString().split("T")[0];
49
- t[e.id][d] = (t[e.id][d] || 0) + 1, o.setDate(o.getDate() + 1);
41
+ width: b.value + "px"
42
+ })), re = g(() => {
43
+ const t = {}, s = (e, n) => {
44
+ if (!n.startDate || !n.endDate || !M(e, n)) return;
45
+ let o = new Date(n.startDate);
46
+ const p = new Date(n.endDate);
47
+ for (; o <= p; ) {
48
+ const c = o.toISOString().split("T")[0];
49
+ t[e.id][c] = (t[e.id][c] || 0) + 1, o.setDate(o.getDate() + 1);
50
50
  }
51
- l.children && l.children.forEach((d) => s(e, d));
51
+ n.children && n.children.forEach((c) => s(e, c));
52
52
  };
53
- return M.value.forEach((e) => {
54
- t[e.id] = {}, e.tasks.forEach((l) => {
55
- s(e, l);
53
+ return z.value.forEach((e) => {
54
+ t[e.id] = {}, e.tasks.forEach((n) => {
55
+ s(e, n);
56
56
  });
57
57
  }), t;
58
58
  }), F = () => {
59
59
  const t = [];
60
- let s = new Date(u.dateRange[0]);
61
- const e = new Date(u.dateRange[1]);
60
+ let s = new Date(v.dateRange[0]);
61
+ const e = new Date(v.dateRange[1]);
62
62
  for (; s <= e; )
63
63
  t.push(s.toISOString().split("T")[0]), s.setDate(s.getDate() + 1);
64
- p.value = t;
64
+ u.value = t;
65
65
  }, G = (t) => {
66
66
  const s = new Date(t), e = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
67
67
  return {
@@ -69,154 +69,165 @@ const pe = "0.3.3", he = {
69
69
  weekday: e[s.getDay()]
70
70
  };
71
71
  }, B = (t) => {
72
- const s = p.value.indexOf(t);
73
- return s > -1 ? s * c : -999;
74
- }, D = (t) => {
72
+ const s = u.value.indexOf(t);
73
+ return s > -1 ? s * d : -999;
74
+ }, T = (t) => {
75
75
  if (!t.startDate || !t.endDate) return null;
76
- const s = new Date(t.startDate), e = new Date(t.endDate), l = new Date(p.value[0]), o = new Date(p.value[p.value.length - 1]);
77
- if (s < l && e > o)
76
+ const s = new Date(t.startDate), e = new Date(t.endDate), n = new Date(u.value[0]), o = new Date(u.value[u.value.length - 1]);
77
+ if (s < n && e > o)
78
78
  return {
79
79
  left: -4,
80
- width: y.value + 8
80
+ width: b.value + 8
81
81
  };
82
- let v = p.value.indexOf(t.startDate), d = p.value.indexOf(t.endDate), R = 4, Y = -8;
83
- return v === -1 && d === -1 ? null : (v === -1 && (v = 0, R = -4), d === -1 && (d = p.value.length - 1, Y = 4), {
84
- left: v * c + R,
85
- width: (d - v + 1) * c + Y
82
+ let p = u.value.indexOf(t.startDate), c = u.value.indexOf(t.endDate), R = 4, Q = -8;
83
+ return p === -1 && c === -1 ? null : (p === -1 && (p = 0, R = -4), c === -1 && (c = u.value.length - 1, Q = 4), {
84
+ left: p * d + R,
85
+ width: (c - p + 1) * d + Q
86
86
  });
87
- }, b = f(), N = f(), x = f(), P = g(() => {
88
- const t = [], s = (e, l, o, v) => {
87
+ }, V = (t) => {
88
+ if (!t.time) return null;
89
+ const s = new Date(t.time), e = u.value.indexOf(s.toISOString().split("T")[0]);
90
+ return e > -1 ? e * d : -999;
91
+ }, m = f(), N = f(), x = f(), I = g(() => {
92
+ const t = [], s = (e, n, o, p) => {
89
93
  t.push({
90
94
  type: "task",
91
95
  data: e,
92
- uniqueKey: `t-${l}-${o}-${e.id}`,
96
+ uniqueKey: `t-${n}-${o}-${e.id}`,
93
97
  parentId: o,
94
- groupId: l,
95
- level: v
96
- }), e.expanded && e.children && e.children.forEach((d) => {
97
- s(d, l, e.id, v + 1);
98
+ groupId: n,
99
+ level: p
100
+ }), e.expanded && e.children && e.children.forEach((c) => {
101
+ s(c, n, e.id, p + 1);
98
102
  });
99
103
  };
100
- return M.value.forEach((e) => {
104
+ return z.value.forEach((e) => {
101
105
  t.push({
102
106
  type: "group",
103
107
  data: e,
104
108
  uniqueKey: `g-${e.id}`,
105
109
  groupId: e.id,
106
110
  level: 0
107
- }), e.expanded && e.tasks.forEach((l) => {
108
- s(l, e.id, e.id, 1);
111
+ }), e.expanded && e.tasks.forEach((n) => {
112
+ s(n, e.id, e.id, 1);
109
113
  });
110
114
  }), t;
111
- }), k = f(0), H = f(600), V = g(() => P.value.length * h), j = g(() => {
112
- const t = Math.floor(k.value / h), s = Math.ceil(H.value / h), e = 5;
115
+ }), S = f(0), H = f(600), j = g(() => I.value.length * h), q = g(() => {
116
+ const t = Math.floor(S.value / h), s = Math.ceil(H.value / h), e = 5;
113
117
  return {
114
118
  start: Math.max(0, t - e),
115
- end: Math.min(P.value.length, t + s + e)
119
+ end: Math.min(I.value.length, t + s + e)
116
120
  };
117
- }), q = g(() => j.value.start * h), J = g(() => {
118
- const { start: t, end: s } = j.value;
119
- return P.value.slice(t, s);
120
- }), K = () => {
121
+ }), J = g(() => q.value.start * h), K = g(() => {
122
+ const { start: t, end: s } = q.value;
123
+ return I.value.slice(t, s);
124
+ }), X = () => {
121
125
  x.value && (H.value = x.value.clientHeight - 1);
122
126
  };
123
- let m = !1;
124
- const oe = () => {
125
- m || !b.value || !x.value || (m = !0, k.value = b.value.scrollTop, x.value.scrollTop = b.value.scrollTop, se(() => m = !1));
126
- }, re = () => {
127
- m || !x.value || !b.value || (m = !0, k.value = x.value.scrollTop, b.value.scrollTop = x.value.scrollTop, N.value && (N.value.scrollLeft = x.value.scrollLeft), se(() => m = !1));
128
- }, X = (t) => {
129
- t.expanded = !t.expanded, I("toggle", t.id);
130
- }, U = g(() => {
131
- const t = (/* @__PURE__ */ new Date()).toISOString().split("T")[0], s = p.value.indexOf(t);
132
- return s === -1 ? null : s * c;
127
+ let w = !1;
128
+ const ie = () => {
129
+ w || !m.value || !x.value || (w = !0, S.value = m.value.scrollTop, x.value.scrollTop = m.value.scrollTop, ae(() => w = !1));
130
+ }, de = () => {
131
+ w || !x.value || !m.value || (w = !0, S.value = x.value.scrollTop, m.value.scrollTop = x.value.scrollTop, N.value && (N.value.scrollLeft = x.value.scrollLeft), ae(() => w = !1));
132
+ }, U = (t) => {
133
+ t.expanded = !t.expanded, ne("toggle", t.id);
134
+ }, Y = g(() => {
135
+ const t = (/* @__PURE__ */ new Date()).toISOString().split("T")[0], s = u.value.indexOf(t);
136
+ return s === -1 ? null : s * d;
133
137
  }), W = f();
134
- let C = null;
135
- return de(() => {
136
- F(), K(), W.value && (C = new ResizeObserver(() => {
137
- K();
138
- }), C.observe(W.value));
139
- }), Q(
140
- () => u.dateRange,
138
+ let O = null;
139
+ return ue(() => {
140
+ F(), X(), W.value && (O = new ResizeObserver(() => {
141
+ X();
142
+ }), O.observe(W.value));
143
+ }), Z(
144
+ () => v.dateRange,
141
145
  () => {
142
146
  F();
143
147
  }
144
- ), ce(() => {
145
- C && C.disconnect();
148
+ ), pe(() => {
149
+ O && O.disconnect();
150
+ }), L({
151
+ getExpandedMapId: () => {
152
+ const t = /* @__PURE__ */ new Map();
153
+ return I.value.forEach((s) => {
154
+ s.type === "group" && t.set(s.data.id, s.data.expanded), s.type === "task" && t.set(`${s.groupId}-${s.data.id}`, s.data.expanded);
155
+ }), t;
156
+ }
146
157
  }), (t, s) => (i(), r("div", {
147
158
  ref_key: "containerRef",
148
159
  ref: W,
149
160
  class: "flex flex-col h-full bg-slate-50 font-sans antialiased select-none"
150
161
  }, [
151
- n("div", fe, [
152
- n("div", xe, [
153
- n("div", {
162
+ a("div", ge, [
163
+ a("div", ye, [
164
+ a("div", {
154
165
  class: "shrink-0 px-6 py-4 border-r border-slate-200 font-bold text-slate-700 relative z-20 shadow-[10px_0_15px_-3px_rgba(0,0,0,0.1)]",
155
- style: a({ width: E.value + "px" })
166
+ style: l({ width: C.value + "px" })
156
167
  }, [
157
- T(t.$slots, "leftPanelHeader", {}, () => [
158
- s[0] || (s[0] = ue("项目成员 / 任务状态", -1))
168
+ _(t.$slots, "leftPanelHeader", {}, () => [
169
+ s[0] || (s[0] = ve("项目成员 / 任务状态", -1))
159
170
  ], !0),
160
- n("div", {
171
+ a("div", {
161
172
  class: "absolute top-0 right-0 bottom-0 w-1 cursor-col-resize hover:bg-blue-400 transition-colors z-20 group",
162
- onMousedown: ne
173
+ onMousedown: le
163
174
  }, null, 32)
164
175
  ], 4),
165
- n("div", {
176
+ a("div", {
166
177
  ref_key: "headerRef",
167
178
  ref: N,
168
179
  class: "flex-1 overflow-hidden pointer-events-none"
169
180
  }, [
170
- n("div", {
181
+ a("div", {
171
182
  class: "flex h-full",
172
- style: a({ width: y.value + "px" })
183
+ style: l({ width: b.value + "px" })
173
184
  }, [
174
- (i(!0), r(S, null, $(p.value, (e) => (i(), r("div", {
185
+ (i(!0), r(k, null, E(u.value, (e) => (i(), r("div", {
175
186
  key: e,
176
187
  class: "shrink-0 flex flex-col items-center justify-center border-r border-slate-100 py-2 transition-colors",
177
- style: a({ width: c + "px" })
188
+ style: l({ width: d + "px" })
178
189
  }, [
179
- T(t.$slots, "headerCell", { date: e }, () => [
180
- n("span", ge, w(G(e).weekday), 1),
181
- n("span", ye, w(G(e).monthDay), 1)
190
+ _(t.$slots, "headerCell", { date: e }, () => [
191
+ a("span", be, y(G(e).weekday), 1),
192
+ a("span", me, y(G(e).monthDay), 1)
182
193
  ], !0)
183
194
  ], 4))), 128))
184
195
  ], 4)
185
196
  ], 512)
186
197
  ]),
187
- n("div", be, [
188
- n("div", {
198
+ a("div", we, [
199
+ a("div", {
189
200
  ref_key: "leftPanelRef",
190
- ref: b,
201
+ ref: m,
191
202
  class: "shrink-0 border-r border-slate-200 overflow-y-auto overflow-x-hidden relative z-10 shadow-[10px_0_15px_-3px_rgba(0,0,0,0.1)] bg-white no-scrollbar",
192
- style: a({ width: E.value + "px" }),
193
- onScroll: oe
203
+ style: l({ width: C.value + "px" }),
204
+ onScroll: ie
194
205
  }, [
195
- n("div", {
196
- style: a({ height: V.value + "px", position: "relative" })
206
+ a("div", {
207
+ style: l({ height: j.value + "px", position: "relative" })
197
208
  }, [
198
- n("div", {
199
- style: a({ transform: `translateY(${q.value}px)` })
209
+ a("div", {
210
+ style: l({ transform: `translateY(${J.value}px)` })
200
211
  }, [
201
- (i(!0), r(S, null, $(J.value, (e) => (i(), r("div", {
212
+ (i(!0), r(k, null, E(K.value, (e) => (i(), r("div", {
202
213
  key: e.uniqueKey
203
214
  }, [
204
215
  e.type === "group" ? (i(), r("div", {
205
216
  key: 0,
206
217
  class: "flex items-center px-4 hover:bg-slate-50 cursor-pointer border-b border-slate-50 transition-colors",
207
- style: a({ height: h + "px" }),
208
- onClick: (l) => X(e.data)
218
+ style: l({ height: h + "px" }),
219
+ onClick: (n) => U(e.data)
209
220
  }, [
210
- Z(n("span", {
211
- class: ee(["transform transition-transform duration-200 mr-2", e.data.expanded ? "rotate-90" : ""])
221
+ ee(a("span", {
222
+ class: te(["transform transition-transform duration-200 mr-2", e.data.expanded ? "rotate-90" : ""])
212
223
  }, [...s[1] || (s[1] = [
213
- n("svg", {
224
+ a("svg", {
214
225
  class: "w-4 h-4 text-slate-400",
215
226
  fill: "none",
216
227
  stroke: "currentColor",
217
228
  viewBox: "0 0 24 24"
218
229
  }, [
219
- n("path", {
230
+ a("path", {
220
231
  "stroke-linecap": "round",
221
232
  "stroke-linejoin": "round",
222
233
  "stroke-width": "2",
@@ -224,137 +235,157 @@ const pe = "0.3.3", he = {
224
235
  })
225
236
  ], -1)
226
237
  ])], 2), [
227
- [te, e.data.tasks.length > 0]
238
+ [se, e.data.tasks.length > 0]
228
239
  ]),
229
- Z(n("span", we, null, 512), [
230
- [te, !e.data.tasks.length]
240
+ ee(a("span", ke, null, 512), [
241
+ [se, !e.data.tasks.length]
231
242
  ]),
232
- n("div", _e, [
233
- T(t.$slots, "leftPanelItem", {
243
+ a("div", De, [
244
+ _(t.$slots, "leftPanelItem", {
234
245
  item: e.data
235
246
  }, () => [
236
- n("div", De, w(e.data.name), 1)
247
+ a("div", Te, y(e.data.name), 1)
237
248
  ], !0)
238
249
  ])
239
- ], 12, me)) : (i(), r("div", {
250
+ ], 12, _e)) : (i(), r("div", {
240
251
  key: 1,
241
252
  class: "flex items-center pr-4 border-b border-slate-100/50 text-slate-600 hover:bg-white transition-colors cursor-pointer",
242
- style: a({ height: h + "px", paddingLeft: e.level * 20 + 12 + "px" }),
243
- onClick: ve((l) => X(e.data), ["stop"])
253
+ style: l({ height: h + "px", paddingLeft: e.level * 20 + 12 + "px" }),
254
+ onClick: he((n) => U(e.data), ["stop"])
244
255
  }, [
245
256
  e.data.children && e.data.children.length > 0 ? (i(), r("span", {
246
257
  key: 0,
247
- class: ee(["transform transition-transform duration-200 mr-1.5", e.data.expanded ? "rotate-90" : ""])
258
+ class: te(["transform transition-transform duration-200 mr-1.5", e.data.expanded ? "rotate-90" : ""])
248
259
  }, [...s[2] || (s[2] = [
249
- n("svg", {
260
+ a("svg", {
250
261
  class: "w-3 h-3 text-slate-400",
251
262
  fill: "none",
252
263
  stroke: "currentColor",
253
264
  viewBox: "0 0 24 24"
254
265
  }, [
255
- n("path", {
266
+ a("path", {
256
267
  "stroke-linecap": "round",
257
268
  "stroke-linejoin": "round",
258
269
  "stroke-width": "2",
259
270
  d: "M9 5l7 7-7 7"
260
271
  })
261
272
  ], -1)
262
- ])], 2)) : (i(), r("span", Te)),
263
- n("div", Se, w(e.data.name), 1)
264
- ], 12, ke))
273
+ ])], 2)) : (i(), r("span", Ee)),
274
+ _(t.$slots, "leftPanelItemTask", {
275
+ item: e.data
276
+ }, () => [
277
+ a("div", $e, y(e.data.name), 1)
278
+ ], !0)
279
+ ], 12, Se))
265
280
  ]))), 128))
266
281
  ], 4)
267
282
  ], 4)
268
283
  ], 36),
269
- n("div", {
284
+ a("div", {
270
285
  ref_key: "rightPanelRef",
271
286
  ref: x,
272
- onScroll: re,
287
+ onScroll: de,
273
288
  class: "flex-1 overflow-auto relative select-none"
274
289
  }, [
275
- U.value !== null && _.showToday ? (i(), r("div", {
290
+ Y.value !== null && D.showToday ? (i(), r("div", {
276
291
  key: 0,
277
292
  class: "absolute top-0 z-10 pointer-events-none border-l-2 border-orange-400",
278
- style: a({ left: U.value + "px", bottom: -k.value + "px" })
293
+ style: l({ left: Y.value + "px", bottom: -S.value + "px" })
279
294
  }, [...s[3] || (s[3] = [
280
- n("div", {
295
+ a("div", {
281
296
  class: "sticky top-0 z-20",
282
297
  style: { height: "0", overflow: "visible" }
283
298
  }, [
284
- n("div", { class: "absolute -top-1 -left-[6px] w-0 h-0 border-l-[5px] border-l-transparent border-r-[5px] border-r-transparent border-t-[6px] border-t-orange-400" }),
285
- n("div", { class: "absolute top-2 left-2 px-1.5 py-0.5 bg-orange-400 text-[10px] text-white rounded shadow-sm opacity-80 whitespace-nowrap" }, " 今天 ")
299
+ a("div", { class: "absolute -top-1 -left-[6px] w-0 h-0 border-l-[5px] border-l-transparent border-r-[5px] border-r-transparent border-t-[6px] border-t-orange-400" }),
300
+ a("div", { class: "absolute top-2 left-2 px-1.5 py-0.5 bg-orange-400 text-[10px] text-white rounded shadow-sm opacity-80 whitespace-nowrap" }, " 今天 ")
286
301
  ], -1)
287
302
  ])], 4)) : A("", !0),
288
- n("div", {
303
+ a("div", {
289
304
  class: "absolute left-0 pointer-events-none",
290
- style: a({
291
- ...le.value,
305
+ style: l({
306
+ ...oe.value,
292
307
  height: H.value + "px",
293
- top: k.value + "px",
294
- width: y.value + "px"
308
+ top: S.value + "px",
309
+ width: b.value + "px"
295
310
  })
296
311
  }, null, 4),
297
- n("div", {
298
- style: a({ height: V.value + "px", position: "relative" })
312
+ a("div", {
313
+ style: l({ height: j.value + "px", position: "relative" })
299
314
  }, [
300
- n("div", {
301
- style: a({ transform: `translateY(${q.value}px)` })
315
+ a("div", {
316
+ style: l({ transform: `translateY(${J.value}px)` })
302
317
  }, [
303
- (i(!0), r(S, null, $(J.value, (e) => (i(), r(S, {
318
+ (i(!0), r(k, null, E(K.value, (e) => (i(), r(k, {
304
319
  key: e.uniqueKey
305
320
  }, [
306
321
  e.type === "group" ? (i(), r("div", {
307
322
  key: 0,
308
323
  class: "relative border-b border-[#e8e8e8]",
309
- style: a({ height: h + "px", width: y.value + "px" })
324
+ style: l({ height: h + "px", width: b.value + "px" })
310
325
  }, [
311
- (i(!0), r(S, null, $(ae.value[e.data.id], (l, o) => T(t.$slots, "count", {
326
+ (i(!0), r(k, null, E(re.value[e.data.id], (n, o) => _(t.$slots, "count", {
312
327
  key: o,
313
328
  item: e.data,
314
329
  date: o,
315
- count: l,
316
- style: a({
330
+ count: n,
331
+ style: l({
317
332
  left: B(o) + "px",
318
- width: c + "px",
333
+ width: d + "px",
319
334
  height: h + "px"
320
335
  })
321
336
  }, () => [
322
- n("div", {
337
+ a("div", {
323
338
  class: "absolute top-0 flex items-center justify-center text-sm",
324
- style: a({
339
+ style: l({
325
340
  left: B(o) + "px",
326
- width: c + "px",
341
+ width: d + "px",
327
342
  height: h + "px",
328
343
  contentVisibility: "auto",
329
- containIntrinsicSize: `${c}px ${h}px`
344
+ containIntrinsicSize: `${d}px ${h}px`
330
345
  })
331
- }, w(l), 5)
346
+ }, y(n), 5)
332
347
  ], !0)), 128))
333
348
  ], 4)) : (i(), r("div", {
334
349
  key: 1,
335
350
  class: "relative border-b border-[#e8e8e8] overflow-hidden",
336
- style: a({ height: h + "px", width: y.value + "px" })
351
+ style: l({ height: h + "px", width: b.value + "px" })
337
352
  }, [
338
- D(e.data) ? T(t.$slots, "task", {
353
+ T(e.data) ? _(t.$slots, "task", {
339
354
  key: 0,
340
- style: a({
341
- left: D(e.data).left + "px",
342
- width: D(e.data).width + "px",
343
- position: "absolute"
355
+ style: l({
356
+ left: T(e.data).left + "px",
357
+ width: T(e.data).width + "px",
358
+ position: "absolute",
359
+ getTimelinePos: V
344
360
  }),
345
361
  task: e.data,
346
362
  ganttItemId: e.groupId
347
363
  }, () => [
348
- n("div", {
349
- class: "absolute bg-slate-400 top-2 bottom-2 rounded-md shadow-sm flex items-center px-3 text-[11px] text-white font-medium cursor-pointer hover:shadow-lg hover:-translate-y-0.5 transition-all duration-200",
350
- style: a({
351
- left: D(e.data).left + "px",
352
- width: D(e.data).width + "px",
364
+ a("div", {
365
+ class: "absolute bg-slate-400 top-4 bottom-2 rounded-md shadow-sm flex items-center px-3 text-[11px] text-white font-medium cursor-pointer hover:shadow-lg hover:-translate-y-0.5 transition-all duration-200",
366
+ style: l({
367
+ left: T(e.data).left + "px",
368
+ width: T(e.data).width + "px",
353
369
  backgroundColor: e.data.color
354
370
  })
355
371
  }, [
356
- n("span", Ee, w(e.data.name), 1)
357
- ], 4)
372
+ a("span", Ce, y(e.data.name), 1)
373
+ ], 4),
374
+ a("div", Ie, [
375
+ (i(!0), r(k, null, E(e.data.timelines, (n) => (i(), r("div", {
376
+ key: n.id,
377
+ style: l({
378
+ left: V(n) + "px",
379
+ width: "2px",
380
+ position: "absolute",
381
+ height: "100%",
382
+ backgroundColor: n.color,
383
+ color: n.color
384
+ })
385
+ }, [
386
+ a("span", Oe, y(n.name), 1)
387
+ ], 4))), 128))
388
+ ])
358
389
  ], !0) : A("", !0)
359
390
  ], 4))
360
391
  ], 64))), 128))
@@ -366,16 +397,16 @@ const pe = "0.3.3", he = {
366
397
  A("", !0)
367
398
  ], 512));
368
399
  }
369
- }), Oe = (_, L) => {
370
- const u = _.__vccOpts || _;
371
- for (const [O, I] of L)
372
- u[O] = I;
373
- return u;
374
- }, Me = /* @__PURE__ */ Oe(Le, [["__scopeId", "data-v-d9bcafb4"]]), ze = he.version, Ne = () => {
400
+ }), Pe = (D, L) => {
401
+ const $ = D.__vccOpts || D;
402
+ for (const [v, M] of L)
403
+ $[v] = M;
404
+ return $;
405
+ }, He = /* @__PURE__ */ Pe(ze, [["__scopeId", "data-v-05d54120"]]), We = xe.version, Ae = () => {
375
406
  console.log("Gantt Core Initialized");
376
407
  };
377
408
  export {
378
- ze as GANTT_VERSION,
379
- Me as GanttChart,
380
- Ne as setupGantt
409
+ We as GANTT_VERSION,
410
+ He as GanttChart,
411
+ Ae as setupGantt
381
412
  };
package/dist/gantt-vue3.umd.cjs CHANGED
@@ -1 +1 @@
1
- (function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f.GanttVue3={},f.Vue))})(this,(function(f,e){"use strict";const G={version:"0.3.3"},A={class:"bg-white border border-slate-200 overflow-hidden flex-1 flex flex-col"},j={class:"flex border-b border-slate-200 bg-slate-50/50"},q={class:"text-[10px] tracking-wider text-slate-400"},J={class:"text-xs font-semibold text-slate-400"},K={class:"flex flex-1 overflow-hidden"},X=["onClick"],U={class:"mr-2 w-4 h-4"},Y={class:"min-w-0"},Q={class:"text-sm font-semibold text-slate-700 truncate"},Z=["onClick"],ee={key:1,class:"mr-1.5 w-3 h-3 inline-block"},te={class:"text-xs truncate select-none"},le={class:"truncate"},r=60,c=52,ne=150,oe=600,ae=256,re=((u,w)=>{const i=u.__vccOpts||u;for(const[_,D]of w)i[_]=D;return i})(e.defineComponent({__name:"GanttChart",props:{list:{},dateRange:{},showToday:{type:Boolean},shouldCalculate:{type:Function},defaultLeftPanelWidth:{}},emits:["update:list","toggle"],setup(u,{emit:w}){const i=u,_=(l,n)=>i.shouldCalculate?i.shouldCalculate(l,n):!0,D=w,p=e.ref([]),N=e.ref(JSON.parse(JSON.stringify(i.list)));e.watch(()=>i.list,()=>{N.value=JSON.parse(JSON.stringify(i.list))});const k=e.ref(i.defaultLeftPanelWidth??ae),V=e.ref(!1),de=l=>{V.value=!0;const n=l.clientX,t=k.value,o=d=>{if(!V.value)return;const s=d.clientX-n,S=t+s;k.value=Math.max(ne,Math.min(oe,S))},a=()=>{V.value=!1,document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",a),document.body.style.cursor="",document.body.style.userSelect=""};document.addEventListener("mousemove",o),document.addEventListener("mouseup",a),document.body.style.cursor="col-resize",document.body.style.userSelect="none",l.preventDefault()},m=e.computed(()=>p.value.length*r),ce=e.computed(()=>({backgroundImage:`linear-gradient(to right, transparent ${r-1}px, #e8e8e8 ${r-1}px, #e8e8e8 ${r}px)`,backgroundSize:`${r}px 100%`,width:m.value+"px"})),pe=e.computed(()=>{const l={},n=(t,o)=>{if(!o.startDate||!o.endDate||!_(t,o))return;let a=new Date(o.startDate);const d=new Date(o.endDate);for(;a<=d;){const s=a.toISOString().split("T")[0];l[t.id][s]=(l[t.id][s]||0)+1,a.setDate(a.getDate()+1)}o.children&&o.children.forEach(s=>n(t,s))};return N.value.forEach(t=>{l[t.id]={},t.tasks.forEach(o=>{n(t,o)})}),l}),L=()=>{const l=[];let n=new Date(i.dateRange[0]);const t=new Date(i.dateRange[1]);for(;n<=t;)l.push(n.toISOString().split("T")[0]),n.setDate(n.getDate()+1);p.value=l},O=l=>{const n=new Date(l),t=["周日","周一","周二","周三","周四","周五","周六"];return{monthDay:`${String(n.getMonth()+1).padStart(2,"0")}/${n.getDate()}`,weekday:t[n.getDay()]}},R=l=>{const n=p.value.indexOf(l);return n>-1?n*r:-999},g=l=>{if(!l.startDate||!l.endDate)return null;const n=new Date(l.startDate),t=new Date(l.endDate),o=new Date(p.value[0]),a=new Date(p.value[p.value.length-1]);if(n<o&&t>a)return{left:-4,width:m.value+8};let d=p.value.indexOf(l.startDate),s=p.value.indexOf(l.endDate),S=4,F=-8;return d===-1&&s===-1?null:(d===-1&&(d=0,S=-4),s===-1&&(s=p.value.length-1,F=4),{left:d*r+S,width:(s-d+1)*r+F})},x=e.ref(),z=e.ref(),h=e.ref(),T=e.computed(()=>{const l=[],n=(t,o,a,d)=>{l.push({type:"task",data:t,uniqueKey:`t-${o}-${a}-${t.id}`,parentId:a,groupId:o,level:d}),t.expanded&&t.children&&t.children.forEach(s=>{n(s,o,t.id,d+1)})};return N.value.forEach(t=>{l.push({type:"group",data:t,uniqueKey:`g-${t.id}`,groupId:t.id,level:0}),t.expanded&&t.tasks.forEach(o=>{n(o,t.id,t.id,1)})}),l}),b=e.ref(0),B=e.ref(600),v=e.computed(()=>T.value.length*c),$=e.computed(()=>{const l=Math.floor(b.value/c),n=Math.ceil(B.value/c),t=5;return{start:Math.max(0,l-t),end:Math.min(T.value.length,l+n+t)}}),I=e.computed(()=>$.value.start*c),M=e.computed(()=>{const{start:l,end:n}=$.value;return T.value.slice(l,n)}),P=()=>{h.value&&(B.value=h.value.clientHeight-1)};let y=!1;const fe=()=>{y||!x.value||!h.value||(y=!0,b.value=x.value.scrollTop,h.value.scrollTop=x.value.scrollTop,e.nextTick(()=>y=!1))},he=()=>{y||!h.value||!x.value||(y=!0,b.value=h.value.scrollTop,x.value.scrollTop=h.value.scrollTop,z.value&&(z.value.scrollLeft=h.value.scrollLeft),e.nextTick(()=>y=!1))},H=l=>{l.expanded=!l.expanded,D("toggle",l.id)},W=e.computed(()=>{const l=new Date().toISOString().split("T")[0],n=p.value.indexOf(l);return n===-1?null:n*r}),C=e.ref();let E=null;return e.onMounted(()=>{L(),P(),C.value&&(E=new ResizeObserver(()=>{P()}),E.observe(C.value))}),e.watch(()=>i.dateRange,()=>{L()}),e.onUnmounted(()=>{E&&E.disconnect()}),(l,n)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerRef",ref:C,class:"flex flex-col h-full bg-slate-50 font-sans antialiased select-none"},[e.createElementVNode("div",A,[e.createElementVNode("div",j,[e.createElementVNode("div",{class:"shrink-0 px-6 py-4 border-r border-slate-200 font-bold text-slate-700 relative z-20 shadow-[10px_0_15px_-3px_rgba(0,0,0,0.1)]",style:e.normalizeStyle({width:k.value+"px"})},[e.renderSlot(l.$slots,"leftPanelHeader",{},()=>[n[0]||(n[0]=e.createTextVNode("项目成员 / 任务状态",-1))],!0),e.createElementVNode("div",{class:"absolute top-0 right-0 bottom-0 w-1 cursor-col-resize hover:bg-blue-400 transition-colors z-20 group",onMousedown:de},null,32)],4),e.createElementVNode("div",{ref_key:"headerRef",ref:z,class:"flex-1 overflow-hidden pointer-events-none"},[e.createElementVNode("div",{class:"flex h-full",style:e.normalizeStyle({width:m.value+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(p.value,t=>(e.openBlock(),e.createElementBlock("div",{key:t,class:"shrink-0 flex flex-col items-center justify-center border-r border-slate-100 py-2 transition-colors",style:e.normalizeStyle({width:r+"px"})},[e.renderSlot(l.$slots,"headerCell",{date:t},()=>[e.createElementVNode("span",q,e.toDisplayString(O(t).weekday),1),e.createElementVNode("span",J,e.toDisplayString(O(t).monthDay),1)],!0)],4))),128))],4)],512)]),e.createElementVNode("div",K,[e.createElementVNode("div",{ref_key:"leftPanelRef",ref:x,class:"shrink-0 border-r border-slate-200 overflow-y-auto overflow-x-hidden relative z-10 shadow-[10px_0_15px_-3px_rgba(0,0,0,0.1)] bg-white no-scrollbar",style:e.normalizeStyle({width:k.value+"px"}),onScroll:fe},[e.createElementVNode("div",{style:e.normalizeStyle({height:v.value+"px",position:"relative"})},[e.createElementVNode("div",{style:e.normalizeStyle({transform:`translateY(${I.value}px)`})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(M.value,t=>(e.openBlock(),e.createElementBlock("div",{key:t.uniqueKey},[t.type==="group"?(e.openBlock(),e.createElementBlock("div",{key:0,class:"flex items-center px-4 hover:bg-slate-50 cursor-pointer border-b border-slate-50 transition-colors",style:e.normalizeStyle({height:c+"px"}),onClick:o=>H(t.data)},[e.withDirectives(e.createElementVNode("span",{class:e.normalizeClass(["transform transition-transform duration-200 mr-2",t.data.expanded?"rotate-90":""])},[...n[1]||(n[1]=[e.createElementVNode("svg",{class:"w-4 h-4 text-slate-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M9 5l7 7-7 7"})],-1)])],2),[[e.vShow,t.data.tasks.length>0]]),e.withDirectives(e.createElementVNode("span",U,null,512),[[e.vShow,!t.data.tasks.length]]),e.createElementVNode("div",Y,[e.renderSlot(l.$slots,"leftPanelItem",{item:t.data},()=>[e.createElementVNode("div",Q,e.toDisplayString(t.data.name),1)],!0)])],12,X)):(e.openBlock(),e.createElementBlock("div",{key:1,class:"flex items-center pr-4 border-b border-slate-100/50 text-slate-600 hover:bg-white transition-colors cursor-pointer",style:e.normalizeStyle({height:c+"px",paddingLeft:t.level*20+12+"px"}),onClick:e.withModifiers(o=>H(t.data),["stop"])},[t.data.children&&t.data.children.length>0?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["transform transition-transform duration-200 mr-1.5",t.data.expanded?"rotate-90":""])},[...n[2]||(n[2]=[e.createElementVNode("svg",{class:"w-3 h-3 text-slate-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M9 5l7 7-7 7"})],-1)])],2)):(e.openBlock(),e.createElementBlock("span",ee)),e.createElementVNode("div",te,e.toDisplayString(t.data.name),1)],12,Z))]))),128))],4)],4)],36),e.createElementVNode("div",{ref_key:"rightPanelRef",ref:h,onScroll:he,class:"flex-1 overflow-auto relative select-none"},[W.value!==null&&u.showToday?(e.openBlock(),e.createElementBlock("div",{key:0,class:"absolute top-0 z-10 pointer-events-none border-l-2 border-orange-400",style:e.normalizeStyle({left:W.value+"px",bottom:-b.value+"px"})},[...n[3]||(n[3]=[e.createElementVNode("div",{class:"sticky top-0 z-20",style:{height:"0",overflow:"visible"}},[e.createElementVNode("div",{class:"absolute -top-1 -left-[6px] w-0 h-0 border-l-[5px] border-l-transparent border-r-[5px] border-r-transparent border-t-[6px] border-t-orange-400"}),e.createElementVNode("div",{class:"absolute top-2 left-2 px-1.5 py-0.5 bg-orange-400 text-[10px] text-white rounded shadow-sm opacity-80 whitespace-nowrap"}," 今天 ")],-1)])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:"absolute left-0 pointer-events-none",style:e.normalizeStyle({...ce.value,height:B.value+"px",top:b.value+"px",width:m.value+"px"})},null,4),e.createElementVNode("div",{style:e.normalizeStyle({height:v.value+"px",position:"relative"})},[e.createElementVNode("div",{style:e.normalizeStyle({transform:`translateY(${I.value}px)`})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(M.value,t=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:t.uniqueKey},[t.type==="group"?(e.openBlock(),e.createElementBlock("div",{key:0,class:"relative border-b border-[#e8e8e8]",style:e.normalizeStyle({height:c+"px",width:m.value+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(pe.value[t.data.id],(o,a)=>e.renderSlot(l.$slots,"count",{key:a,item:t.data,date:a,count:o,style:e.normalizeStyle({left:R(a)+"px",width:r+"px",height:c+"px"})},()=>[e.createElementVNode("div",{class:"absolute top-0 flex items-center justify-center text-sm",style:e.normalizeStyle({left:R(a)+"px",width:r+"px",height:c+"px",contentVisibility:"auto",containIntrinsicSize:`${r}px ${c}px`})},e.toDisplayString(o),5)],!0)),128))],4)):(e.openBlock(),e.createElementBlock("div",{key:1,class:"relative border-b border-[#e8e8e8] overflow-hidden",style:e.normalizeStyle({height:c+"px",width:m.value+"px"})},[g(t.data)?e.renderSlot(l.$slots,"task",{key:0,style:e.normalizeStyle({left:g(t.data).left+"px",width:g(t.data).width+"px",position:"absolute"}),task:t.data,ganttItemId:t.groupId},()=>[e.createElementVNode("div",{class:"absolute bg-slate-400 top-2 bottom-2 rounded-md shadow-sm flex items-center px-3 text-[11px] text-white font-medium cursor-pointer hover:shadow-lg hover:-translate-y-0.5 transition-all duration-200",style:e.normalizeStyle({left:g(t.data).left+"px",width:g(t.data).width+"px",backgroundColor:t.data.color})},[e.createElementVNode("span",le,e.toDisplayString(t.data.name),1)],4)],!0):e.createCommentVNode("",!0)],4))],64))),128))],4)],4)],544)])]),e.createCommentVNode("",!0)],512))}}),[["__scopeId","data-v-d9bcafb4"]]),se=G.version,ie=()=>{console.log("Gantt Core Initialized")};f.GANTT_VERSION=se,f.GanttChart=re,f.setupGantt=ie,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})}));
1
+ (function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f.GanttVue3={},f.Vue))})(this,(function(f,e){"use strict";const A={version:"0.3.5"},j={class:"bg-white border border-slate-200 overflow-hidden flex-1 flex flex-col"},q={class:"flex border-b border-slate-200 bg-slate-50/50"},J={class:"text-[10px] tracking-wider text-slate-400"},K={class:"text-xs font-semibold text-slate-400"},X={class:"flex flex-1 overflow-hidden"},U=["onClick"],Y={class:"mr-2 w-4 h-4"},Q={class:"min-w-0"},Z={class:"text-sm font-semibold text-slate-700 truncate"},ee=["onClick"],te={key:1,class:"mr-1.5 w-3 h-3 inline-block"},le={class:"text-xs truncate select-none flex gap-4"},ne={class:"truncate"},oe={class:"absolute top-0 bottom-2 left-0 right-0"},ae={class:"absolute left-1 top-0 text-xs whitespace-nowrap"},r=60,c=52,re=150,se=600,ie=256,de=((y,D)=>{const k=y.__vccOpts||y;for(const[p,N]of D)k[p]=N;return k})(e.defineComponent({__name:"GanttChart",props:{list:{},dateRange:{},showToday:{type:Boolean},shouldCalculate:{type:Function},defaultLeftPanelWidth:{}},emits:["update:list","toggle"],setup(y,{expose:D,emit:k}){const p=y,N=(l,n)=>p.shouldCalculate?p.shouldCalculate(l,n):!0,fe=k,i=e.ref([]),V=e.ref(JSON.parse(JSON.stringify(p.list)));e.watch(()=>p.list,()=>{V.value=JSON.parse(JSON.stringify(p.list))});const E=e.ref(p.defaultLeftPanelWidth??ie),B=e.ref(!1),he=l=>{B.value=!0;const n=l.clientX,t=E.value,o=d=>{if(!B.value)return;const s=d.clientX-n,_=t+s;E.value=Math.max(re,Math.min(se,_))},a=()=>{B.value=!1,document.removeEventListener("mousemove",o),document.removeEventListener("mouseup",a),document.body.style.cursor="",document.body.style.userSelect=""};document.addEventListener("mousemove",o),document.addEventListener("mouseup",a),document.body.style.cursor="col-resize",document.body.style.userSelect="none",l.preventDefault()},m=e.computed(()=>i.value.length*r),me=e.computed(()=>({backgroundImage:`linear-gradient(to right, transparent ${r-1}px, #e8e8e8 ${r-1}px, #e8e8e8 ${r}px)`,backgroundSize:`${r}px 100%`,width:m.value+"px"})),xe=e.computed(()=>{const l={},n=(t,o)=>{if(!o.startDate||!o.endDate||!N(t,o))return;let a=new Date(o.startDate);const d=new Date(o.endDate);for(;a<=d;){const s=a.toISOString().split("T")[0];l[t.id][s]=(l[t.id][s]||0)+1,a.setDate(a.getDate()+1)}o.children&&o.children.forEach(s=>n(t,s))};return V.value.forEach(t=>{l[t.id]={},t.tasks.forEach(o=>{n(t,o)})}),l}),L=()=>{const l=[];let n=new Date(p.dateRange[0]);const t=new Date(p.dateRange[1]);for(;n<=t;)l.push(n.toISOString().split("T")[0]),n.setDate(n.getDate()+1);i.value=l},O=l=>{const n=new Date(l),t=["周日","周一","周二","周三","周四","周五","周六"];return{monthDay:`${String(n.getMonth()+1).padStart(2,"0")}/${n.getDate()}`,weekday:t[n.getDay()]}},$=l=>{const n=i.value.indexOf(l);return n>-1?n*r:-999},u=l=>{if(!l.startDate||!l.endDate)return null;const n=new Date(l.startDate),t=new Date(l.endDate),o=new Date(i.value[0]),a=new Date(i.value[i.value.length-1]);if(n<o&&t>a)return{left:-4,width:m.value+8};let d=i.value.indexOf(l.startDate),s=i.value.indexOf(l.endDate),_=4,G=-8;return d===-1&&s===-1?null:(d===-1&&(d=0,_=-4),s===-1&&(s=i.value.length-1,G=4),{left:d*r+_,width:(s-d+1)*r+G})},I=l=>{if(!l.time)return null;const n=new Date(l.time),t=i.value.indexOf(n.toISOString().split("T")[0]);return t>-1?t*r:-999},x=e.ref(),T=e.ref(),h=e.ref(),S=e.computed(()=>{const l=[],n=(t,o,a,d)=>{l.push({type:"task",data:t,uniqueKey:`t-${o}-${a}-${t.id}`,parentId:a,groupId:o,level:d}),t.expanded&&t.children&&t.children.forEach(s=>{n(s,o,t.id,d+1)})};return V.value.forEach(t=>{l.push({type:"group",data:t,uniqueKey:`g-${t.id}`,groupId:t.id,level:0}),t.expanded&&t.tasks.forEach(o=>{n(o,t.id,t.id,1)})}),l}),b=e.ref(0),z=e.ref(600),R=e.computed(()=>S.value.length*c),M=e.computed(()=>{const l=Math.floor(b.value/c),n=Math.ceil(z.value/c),t=5;return{start:Math.max(0,l-t),end:Math.min(S.value.length,l+n+t)}}),P=e.computed(()=>M.value.start*c),v=e.computed(()=>{const{start:l,end:n}=M.value;return S.value.slice(l,n)}),F=()=>{h.value&&(z.value=h.value.clientHeight-1)};let g=!1;const ge=()=>{g||!x.value||!h.value||(g=!0,b.value=x.value.scrollTop,h.value.scrollTop=x.value.scrollTop,e.nextTick(()=>g=!1))},ye=()=>{g||!h.value||!x.value||(g=!0,b.value=h.value.scrollTop,x.value.scrollTop=h.value.scrollTop,T.value&&(T.value.scrollLeft=h.value.scrollLeft),e.nextTick(()=>g=!1))},H=l=>{l.expanded=!l.expanded,fe("toggle",l.id)},W=e.computed(()=>{const l=new Date().toISOString().split("T")[0],n=i.value.indexOf(l);return n===-1?null:n*r}),C=e.ref();let w=null;return e.onMounted(()=>{L(),F(),C.value&&(w=new ResizeObserver(()=>{F()}),w.observe(C.value))}),e.watch(()=>p.dateRange,()=>{L()}),e.onUnmounted(()=>{w&&w.disconnect()}),D({getExpandedMapId:()=>{const l=new Map;return S.value.forEach(n=>{n.type==="group"&&l.set(n.data.id,n.data.expanded),n.type==="task"&&l.set(`${n.groupId}-${n.data.id}`,n.data.expanded)}),l}}),(l,n)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"containerRef",ref:C,class:"flex flex-col h-full bg-slate-50 font-sans antialiased select-none"},[e.createElementVNode("div",j,[e.createElementVNode("div",q,[e.createElementVNode("div",{class:"shrink-0 px-6 py-4 border-r border-slate-200 font-bold text-slate-700 relative z-20 shadow-[10px_0_15px_-3px_rgba(0,0,0,0.1)]",style:e.normalizeStyle({width:E.value+"px"})},[e.renderSlot(l.$slots,"leftPanelHeader",{},()=>[n[0]||(n[0]=e.createTextVNode("项目成员 / 任务状态",-1))],!0),e.createElementVNode("div",{class:"absolute top-0 right-0 bottom-0 w-1 cursor-col-resize hover:bg-blue-400 transition-colors z-20 group",onMousedown:he},null,32)],4),e.createElementVNode("div",{ref_key:"headerRef",ref:T,class:"flex-1 overflow-hidden pointer-events-none"},[e.createElementVNode("div",{class:"flex h-full",style:e.normalizeStyle({width:m.value+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.value,t=>(e.openBlock(),e.createElementBlock("div",{key:t,class:"shrink-0 flex flex-col items-center justify-center border-r border-slate-100 py-2 transition-colors",style:e.normalizeStyle({width:r+"px"})},[e.renderSlot(l.$slots,"headerCell",{date:t},()=>[e.createElementVNode("span",J,e.toDisplayString(O(t).weekday),1),e.createElementVNode("span",K,e.toDisplayString(O(t).monthDay),1)],!0)],4))),128))],4)],512)]),e.createElementVNode("div",X,[e.createElementVNode("div",{ref_key:"leftPanelRef",ref:x,class:"shrink-0 border-r border-slate-200 overflow-y-auto overflow-x-hidden relative z-10 shadow-[10px_0_15px_-3px_rgba(0,0,0,0.1)] bg-white no-scrollbar",style:e.normalizeStyle({width:E.value+"px"}),onScroll:ge},[e.createElementVNode("div",{style:e.normalizeStyle({height:R.value+"px",position:"relative"})},[e.createElementVNode("div",{style:e.normalizeStyle({transform:`translateY(${P.value}px)`})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,t=>(e.openBlock(),e.createElementBlock("div",{key:t.uniqueKey},[t.type==="group"?(e.openBlock(),e.createElementBlock("div",{key:0,class:"flex items-center px-4 hover:bg-slate-50 cursor-pointer border-b border-slate-50 transition-colors",style:e.normalizeStyle({height:c+"px"}),onClick:o=>H(t.data)},[e.withDirectives(e.createElementVNode("span",{class:e.normalizeClass(["transform transition-transform duration-200 mr-2",t.data.expanded?"rotate-90":""])},[...n[1]||(n[1]=[e.createElementVNode("svg",{class:"w-4 h-4 text-slate-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M9 5l7 7-7 7"})],-1)])],2),[[e.vShow,t.data.tasks.length>0]]),e.withDirectives(e.createElementVNode("span",Y,null,512),[[e.vShow,!t.data.tasks.length]]),e.createElementVNode("div",Q,[e.renderSlot(l.$slots,"leftPanelItem",{item:t.data},()=>[e.createElementVNode("div",Z,e.toDisplayString(t.data.name),1)],!0)])],12,U)):(e.openBlock(),e.createElementBlock("div",{key:1,class:"flex items-center pr-4 border-b border-slate-100/50 text-slate-600 hover:bg-white transition-colors cursor-pointer",style:e.normalizeStyle({height:c+"px",paddingLeft:t.level*20+12+"px"}),onClick:e.withModifiers(o=>H(t.data),["stop"])},[t.data.children&&t.data.children.length>0?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["transform transition-transform duration-200 mr-1.5",t.data.expanded?"rotate-90":""])},[...n[2]||(n[2]=[e.createElementVNode("svg",{class:"w-3 h-3 text-slate-400",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M9 5l7 7-7 7"})],-1)])],2)):(e.openBlock(),e.createElementBlock("span",te)),e.renderSlot(l.$slots,"leftPanelItemTask",{item:t.data},()=>[e.createElementVNode("div",le,e.toDisplayString(t.data.name),1)],!0)],12,ee))]))),128))],4)],4)],36),e.createElementVNode("div",{ref_key:"rightPanelRef",ref:h,onScroll:ye,class:"flex-1 overflow-auto relative select-none"},[W.value!==null&&y.showToday?(e.openBlock(),e.createElementBlock("div",{key:0,class:"absolute top-0 z-10 pointer-events-none border-l-2 border-orange-400",style:e.normalizeStyle({left:W.value+"px",bottom:-b.value+"px"})},[...n[3]||(n[3]=[e.createElementVNode("div",{class:"sticky top-0 z-20",style:{height:"0",overflow:"visible"}},[e.createElementVNode("div",{class:"absolute -top-1 -left-[6px] w-0 h-0 border-l-[5px] border-l-transparent border-r-[5px] border-r-transparent border-t-[6px] border-t-orange-400"}),e.createElementVNode("div",{class:"absolute top-2 left-2 px-1.5 py-0.5 bg-orange-400 text-[10px] text-white rounded shadow-sm opacity-80 whitespace-nowrap"}," 今天 ")],-1)])],4)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:"absolute left-0 pointer-events-none",style:e.normalizeStyle({...me.value,height:z.value+"px",top:b.value+"px",width:m.value+"px"})},null,4),e.createElementVNode("div",{style:e.normalizeStyle({height:R.value+"px",position:"relative"})},[e.createElementVNode("div",{style:e.normalizeStyle({transform:`translateY(${P.value}px)`})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(v.value,t=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:t.uniqueKey},[t.type==="group"?(e.openBlock(),e.createElementBlock("div",{key:0,class:"relative border-b border-[#e8e8e8]",style:e.normalizeStyle({height:c+"px",width:m.value+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(xe.value[t.data.id],(o,a)=>e.renderSlot(l.$slots,"count",{key:a,item:t.data,date:a,count:o,style:e.normalizeStyle({left:$(a)+"px",width:r+"px",height:c+"px"})},()=>[e.createElementVNode("div",{class:"absolute top-0 flex items-center justify-center text-sm",style:e.normalizeStyle({left:$(a)+"px",width:r+"px",height:c+"px",contentVisibility:"auto",containIntrinsicSize:`${r}px ${c}px`})},e.toDisplayString(o),5)],!0)),128))],4)):(e.openBlock(),e.createElementBlock("div",{key:1,class:"relative border-b border-[#e8e8e8] overflow-hidden",style:e.normalizeStyle({height:c+"px",width:m.value+"px"})},[u(t.data)?e.renderSlot(l.$slots,"task",{key:0,style:e.normalizeStyle({left:u(t.data).left+"px",width:u(t.data).width+"px",position:"absolute",getTimelinePos:I}),task:t.data,ganttItemId:t.groupId},()=>[e.createElementVNode("div",{class:"absolute bg-slate-400 top-4 bottom-2 rounded-md shadow-sm flex items-center px-3 text-[11px] text-white font-medium cursor-pointer hover:shadow-lg hover:-translate-y-0.5 transition-all duration-200",style:e.normalizeStyle({left:u(t.data).left+"px",width:u(t.data).width+"px",backgroundColor:t.data.color})},[e.createElementVNode("span",ne,e.toDisplayString(t.data.name),1)],4),e.createElementVNode("div",oe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.data.timelines,o=>(e.openBlock(),e.createElementBlock("div",{key:o.id,style:e.normalizeStyle({left:I(o)+"px",width:"2px",position:"absolute",height:"100%",backgroundColor:o.color,color:o.color})},[e.createElementVNode("span",ae,e.toDisplayString(o.name),1)],4))),128))])],!0):e.createCommentVNode("",!0)],4))],64))),128))],4)],4)],544)])]),e.createCommentVNode("",!0)],512))}}),[["__scopeId","data-v-05d54120"]]),ce=A.version,pe=()=>{console.log("Gantt Core Initialized")};f.GANTT_VERSION=ce,f.GanttChart=de,f.setupGantt=pe,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ollap/gantt-vue3",
3
- "version": "0.3.3",
3
+ "version": "0.3.5",
4
4
  "type": "module",
5
5
  "files": [
6
6
  "dist"
@@ -16,6 +16,11 @@
16
16
  },
17
17
  "./dist/gantt-vue3.css": "./dist/gantt-vue3.css"
18
18
  },
19
+ "scripts": {
20
+ "dev": "vite build --watch",
21
+ "build": "vite build",
22
+ "type-check": "vue-tsc --build"
23
+ },
19
24
  "peerDependencies": {
20
25
  "vue": "^3.5.26"
21
26
  },
@@ -28,10 +33,5 @@
28
33
  "vite-plugin-dts": "^4.5.4",
29
34
  "vue": "^3.5.26",
30
35
  "vue-tsc": "^3.2.1"
31
- },
32
- "scripts": {
33
- "dev": "vite build --watch",
34
- "build": "vite build",
35
- "type-check": "vue-tsc --build"
36
36
  }
37
- }
37
+ }