garganttua - npm Package Compare versions

Comparing version 1.2.1 to 1.3.0

dist/es/lib/task-element.js

@@ -1,1 +0,1 @@
-import{stateValidation as t}from"./task-list.js";import{TaskScheduleElement as e}from"./task-schedule-element.js";class s extends HTMLElement{connectedCallback(){const t=this.querySelector("garganttua-task-schedule");t&&(this.schedule=t),this.task?.state&&this.schedule&&(this.state=this.task.state,this.schedule.state=this.state)}get state(){return this._state}set state(e){if(e){const s=t.parse(e);s&&(this._state=s,this.setAttribute("state",s))}}static build(t){const s=document.createElement("garganttua-task"),a=(t=>{const e="garganttua-task-description",s=document.createElement("p",{is:e});return s.innerText=t,s.setAttribute("is",e),s})(t.description);if(s.appendChild(a),s.task=t,t.start&&t.end){const a=e.build(t);s.schedule=a,s.appendChild(a)}return s}}export{s as TaskElement};
+import{stateValidation as t}from"./task-list.js";import{TaskScheduleElement as e}from"./task-schedule-element.js";class s extends HTMLElement{connectedCallback(){const t=this.querySelector("garganttua-task-schedule");t&&(this.schedule=t),this.task?.state&&this.schedule&&(this.state=this.task.state,this.schedule.state=this.state)}get state(){return this._state}set state(e){if(e){const s=t.parse(e);s&&(this._state=s,this.setAttribute("state",s))}}static build(t){const s=document.createElement("garganttua-task"),a=((t,e)=>{const s="garganttua-task-description",a=document.createElement("p",{is:s});if(e){const s=document.createElement("a");s.setAttribute("href",e),s.innerText=t,a.appendChild(s)}else a.innerText=t;return a.setAttribute("is",s),a})(t.description,t.link);if(s.appendChild(a),s.task=t,t.start&&t.end){const a=e.build(t);s.schedule=a,s.appendChild(a)}return s}}export{s as TaskElement};

dist/es/lib/task-list.d.ts

@@ -9,2 +9,3 @@ import { z } from 'zod';
     state?: string;
+    link?: string;
 }
@@ -11,0 +12,0 @@ export interface TaskGroup {

dist/es/lib/task-list.js

@@ -1,1 +0,1 @@
-import{z as t}from"../node_modules/zod/lib/index.mjs.js";const e=/^\d\d\d\d-\d\d-\d\d$/,a=t.string().regex(/^[a-z-_]+$/,"the state format can contain characters from a-z, dashes or underscores.").optional(),o=t.object({type:t.literal("task"),description:t.string(),start:t.string().regex(e,"the task date needs to be in the format of YYYY-mm-dd.").optional(),end:t.string().regex(e,"the task date needs to be in the format of YYYY-mm-dd.").optional(),content:t.string().optional(),state:a}),r=t.lazy((()=>t.object({type:t.literal("group"),description:t.string(),tasks:t.array(o.or(r))}))),s=t.array(o.or(r)),n=async t=>s.parseAsync(t),i=async t=>{if(!t)return console.warn("no src for task list download provided"),[];const e=await fetch(t,{credentials:"same-origin",redirect:"follow",headers:{Accept:"application/json"}});if(!e.ok)throw new Error(`GarganttuaCantLoadTasks: (${e.status}) ${e.statusText}`);return await e.json().then(n)};export{i as load,a as stateValidation};
+import{z as t}from"../node_modules/zod/lib/index.mjs.js";const e=/^\d\d\d\d-\d\d-\d\d$/,a=t.string().regex(/^[a-z-_]+$/,"the state format can contain characters from a-z, dashes or underscores.").optional(),o=t.object({type:t.literal("task"),description:t.string(),start:t.string().regex(e,"the task date needs to be in the format of YYYY-mm-dd.").optional(),end:t.string().regex(e,"the task date needs to be in the format of YYYY-mm-dd.").optional(),content:t.string().optional(),state:a,link:t.string().url().optional()}),r=t.lazy((()=>t.object({type:t.literal("group"),description:t.string(),tasks:t.array(o.or(r))}))),s=t.array(o.or(r)),n=async t=>s.parseAsync(t),i=async t=>{if(!t)return console.warn("no src for task list download provided"),[];const e=await fetch(t,{credentials:"same-origin",redirect:"follow",headers:{Accept:"application/json"}});if(!e.ok)throw new Error(`GarganttuaCantLoadTasks: (${e.status}) ${e.statusText}`);return await e.json().then(n)};export{i as load,a as stateValidation};

dist/es/lib/task-schedule-element.d.ts

@@ -23,3 +23,3 @@ import { GanttChartElement } from './gantt-chart-element.js';
     set state(state: string);
-    static build(task: Task, withoutContent: boolean): TaskScheduleElement;
+    static build(task: Task, withoutContent?: null): TaskScheduleElement;
 }

dist/es/lib/task-schedule-element.js

@@ -1,1 +0,1 @@
-import t from"../node_modules/date-fns/esm/parseISO/index.js";import e from"../node_modules/date-fns/esm/differenceInDays/index.js";import s from"../node_modules/date-fns/esm/formatISO/index.js";import{stateValidation as a}from"./task-list.js";import{TaskScheduleContentElement as r}from"./task-schedule-content-element.js";class n extends HTMLElement{connectedCallback(){this.ganttChart=this.closest("garganttua-gantt-chart"),this.task?.state&&(this.state=this.task?.state),this.task?.content&&(this.content=r.build(this.task),this.classList.add("has-content"),this.appendChild(this.content)),this.provideConfigAsCSSProps()}provideConfigAsCSSProps(){null!==this.start&&null!==this.end&&(this.style.setProperty("--schedule-start",(this.start+2).toString()),this.style.setProperty("--schedule-end",this.end.toString())),this.state&&(this.style.setProperty("background-color",`var(--task-state-${this.state}-bg, var(--task-schedule-base-bg-col))`),this.style.setProperty("color",`var(--task-state-${this.state}-ft, inherit)`))}get start(){if(this._start)return this._start;if(this.startDate){if(this.ganttChart?.start&&this.ganttChart?.end)return this._start=((t,s,a)=>{const r=e(t,s);return r<0?0:r>a?a:r})(this.startDate,this.ganttChart.start,this.ganttChart.columnCount),this._start;throw new Error("no start/end for gantt-chart defined")}throw new Error("no start date defined for task")}get end(){if(this._end)return this._end;if(this.endDate){if(this.ganttChart?.start&&this.ganttChart?.end)return this._end=((t,s,a)=>{const r=e(s,t);return r<=0?a:r<a?a-r:0})(this.endDate,this.ganttChart.end,this.ganttChart.columnCount),this._end;throw new Error("no start/end for gantt-chart defined")}throw new Error("no start date defined for task")}get startDate(){return this._startDate}set startDate(e){this._startDate=e instanceof Date?e:t(e),this.setAttribute("start",s(this._startDate,{representation:"date"}))}get endDate(){return this._endDate}set endDate(e){this._endDate=e instanceof Date?e:t(e),this.setAttribute("end",s(this._endDate,{representation:"date"}))}get state(){return this._state||""}set state(t){if(t){const e=a.parse(t);e&&(this._state=e,this.setAttribute("state",this._state),this.classList.add(`state-${this._state}`))}}static build(t,e){const s=document.createElement("garganttua-task-schedule"),a=Object.assign({},t,{content:e?null:t.content});return s.task=a,t.start&&(s.startDate=t.start),t.end&&(s.endDate=t.end),s}}export{n as TaskScheduleElement};
+import t from"../node_modules/date-fns/esm/parseISO/index.js";import e from"../node_modules/date-fns/esm/differenceInDays/index.js";import s from"../node_modules/date-fns/esm/formatISO/index.js";import{stateValidation as a}from"./task-list.js";import{TaskScheduleContentElement as r}from"./task-schedule-content-element.js";class n extends HTMLElement{connectedCallback(){this.ganttChart=this.closest("garganttua-gantt-chart"),this.task?.state&&(this.state=this.task?.state),this.task?.content&&(this.content=r.build(this.task),this.classList.add("has-content"),this.appendChild(this.content)),this.provideConfigAsCSSProps()}provideConfigAsCSSProps(){null!==this.start&&null!==this.end&&(this.style.setProperty("--schedule-start",(this.start+2).toString()),this.style.setProperty("--schedule-end",this.end.toString())),this.state&&(this.style.setProperty("background-color",`var(--task-state-${this.state}-bg, var(--task-schedule-base-bg-col))`),this.style.setProperty("color",`var(--task-state-${this.state}-ft, inherit)`))}get start(){if(this._start)return this._start;if(this.startDate){if(this.ganttChart?.start&&this.ganttChart?.end)return this._start=((t,s,a)=>{const r=e(t,s);return r<0?0:r>a?a:r})(this.startDate,this.ganttChart.start,this.ganttChart.columnCount),this._start;throw new Error("no start/end for gantt-chart defined")}throw new Error("no start date defined for task")}get end(){if(this._end)return this._end;if(this.endDate){if(this.ganttChart?.start&&this.ganttChart?.end)return this._end=((t,s,a)=>{const r=e(s,t);return r<=0?a:r<a?a-r:0})(this.endDate,this.ganttChart.end,this.ganttChart.columnCount),this._end;throw new Error("no start/end for gantt-chart defined")}throw new Error("no start date defined for task")}get startDate(){return this._startDate}set startDate(e){this._startDate=e instanceof Date?e:t(e),this.setAttribute("start",s(this._startDate,{representation:"date"}))}get endDate(){return this._endDate}set endDate(e){this._endDate=e instanceof Date?e:t(e),this.setAttribute("end",s(this._endDate,{representation:"date"}))}get state(){return this._state||""}set state(t){if(t){const e=a.parse(t);e&&(this._state=e,this.setAttribute("state",this._state),this.classList.add(`state-${this._state}`))}}static build(t,e=null){const s=document.createElement("garganttua-task-schedule"),a=Object.assign({},t,{content:e?null:t.content});return s.task=a,t.start&&(s.startDate=t.start),t.end&&(s.endDate=t.end),s}}export{n as TaskScheduleElement};

lib/task-element.ts

 import { Task, stateValidation } from './task-list.js'
 import { TaskScheduleElement } from './task-schedule-element.js'
 
-const buildTaskDescription = (text: string): HTMLParagraphElement => {
+const buildTaskDescription = (text: string, href: string | undefined): HTMLParagraphElement => {
   const is = 'garganttua-task-description'
   const element:HTMLParagraphElement = document.createElement('p', { is })
-  element.innerText = text
+  if (href) {
+    const link: HTMLAnchorElement = document.createElement('a')
+    link.setAttribute('href', href)
+    link.innerText = text
+    element.appendChild(link)
+  } else {
+    element.innerText = text
+  }
   element.setAttribute('is', is)
@@ -47,3 +54,3 @@ return element
     const element = document.createElement('garganttua-task') as TaskElement
-    const description = buildTaskDescription(task.description)
+    const description = buildTaskDescription(task.description, task.link)
     element.appendChild(description)
@@ -50,0 +57,0 @@ element.task = task

lib/task-list.ts

@@ -9,3 +9,4 @@ import { z } from 'zod'
   content?: string,
-  state?: string
+  state?: string,
+  link?: string
 }
@@ -35,3 +36,4 @@
   content: z.string().optional(),
-  state: stateValidation
+  state: stateValidation,
+  link: z.string().url().optional()
 })
@@ -38,0 +40,0 @@

lib/task-schedule-element.ts

@@ -135,3 +135,3 @@ import parseISO from 'date-fns/parseISO'
 
-  static build (task: Task, withoutContent: boolean): TaskScheduleElement {
+  static build (task: Task, withoutContent = null): TaskScheduleElement {
     const element = document.createElement('garganttua-task-schedule') as TaskScheduleElement
@@ -138,0 +138,0 @@ const copy = Object.assign({}, task, { content: withoutContent ? null : task.content })

package.json

 {
   "name": "garganttua",
-  "version": "1.2.1",
+  "version": "1.3.0",
   "description": "simple gantt charts based on css grid",
@@ -5,0 +5,0 @@ "type": "module",

README.md

@@ -44,3 +44,5 @@ # Garganttua
     end?: "2021-01-15", // date formatted as ISO date string: yyyy-mm-dd
-    content?: "SGVsbG8gV29ybGQh" // b64 encoded HTML or text
+    content?: "SGVsbG8gV29ybGQh" // b64 encoded HTML or text,
+    state?: string, // adds state classes to the task schedules, so they can be styled
+    link?: string // adds a link to the task description
   },
@@ -47,0 +49,0 @@ ...

No alert changes

Improved metrics

Total package byte prevSize

258419

increased by0.32%

Lines of code

1567

increased by0.64%

Number of lines in readme file

69

increased by2.99%

No dependency changes