@demos-europe/demosplan-ui 0.15.0 → 0.16.0

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.
Binary file
package/CHANGELOG.md CHANGED
@@ -4,6 +4,20 @@ Since v0.0.10, this Changelog is formatted according to the [Common Changelog][c
4
4
 
5
5
  ## UNRELEASED
6
6
 
7
+ ## v0.16.0 - 2026-4-9
8
+
9
+ ### Changed
10
+ - ([#1468](https://github.com/demos-europe/demosplan-ui/pull/1468)) DpDataTable: Add `is-col-hovered` class to table cells when hovering the corresponding column header ([@riechedemos](https://github.com/riechedemos))
11
+ - Dependency updates:
12
+ - @stylistic/eslint-plugin from 4.2.0 to 5.0.0
13
+ - @typescript-eslint/eslint-plugin from 8.29.0 to 8.58.0
14
+ - @typescript-eslint/parser from 8.29.0 to 8.58.0
15
+ - @vue/eslint-config-typescript from 14.5.0 to 14.7.0
16
+ - eslint from 9.23.0 to 10.2.0
17
+ - eslint-plugin-vue from 10.0.0 to 10.8.0
18
+ - glob from 11.0.1 to 13.0.6
19
+
20
+
7
21
  ## v0.15.0 - 2026-3-31
8
22
 
9
23
  ### Added
@@ -30861,6 +30861,10 @@ const bW = /* @__PURE__ */ oe(gW, [["render", yW]]), vW = {
30861
30861
  this.resize.style.width = r + "px", this.updateSessionStorage(`dpDataTable:data-col-field=${this.headerField.field}`, this.resize.style.width);
30862
30862
  }
30863
30863
  },
30864
+ setColumnHover(t) {
30865
+ const e = this.$el.closest("table");
30866
+ e && e.querySelectorAll(`td[data-col-idx='${this.idx}']`).forEach((n) => n.classList.toggle("is-col-hovered", t));
30867
+ },
30864
30868
  stopResize() {
30865
30869
  this.currentHandle.classList.remove("is-active"), this.dragStart = !1, this.isResizing = !1, this.unmarkResizingColumn(), document.querySelector("body").removeEventListener("mousemove", this.namedFunc), document.querySelector("body").removeEventListener("mouseup", this.stopResize), document.querySelector("body").classList.remove("resizing");
30866
30870
  },
@@ -30880,7 +30884,9 @@ function SW(t, e, n, r, i, s) {
30880
30884
  ref: "resizableColumn",
30881
30885
  class: H(["c-data-table__resizable break-words !overflow-visible", { "u-pr-0": n.isLast, "is-resizing bg-interactive-subtle-hover !border-r-interactive border-r-2 ": i.isResizing }]),
30882
30886
  "data-col-field": n.headerField.field,
30883
- "data-col-idx": n.idx
30887
+ "data-col-idx": n.idx,
30888
+ onMouseenter: e[1] || (e[1] = (l) => s.setColumnHover(!0)),
30889
+ onMouseleave: e[2] || (e[2] = (l) => s.setColumnHover(!1))
30884
30890
  }, [
30885
30891
  z(t.$slots, "default"),
30886
30892
  n.isLast ? L("", !0) : (g(), ue(o, {
@@ -30889,7 +30895,7 @@ function SW(t, e, n, r, i, s) {
30889
30895
  class: "!-right-[21px] !top-0 z-above-zero",
30890
30896
  onMousedown: e[0] || (e[0] = (l) => s.initResize(l, n.idx))
30891
30897
  }, null, 8, ["display-icon"]))
30892
- ], 10, wW)), [
30898
+ ], 42, wW)), [
30893
30899
  [a, n.headerField.tooltip || n.headerField.label]
30894
30900
  ]);
30895
30901
  }
@@ -31078,10 +31084,10 @@ function IW(t, e, n, r, i, s) {
31078
31084
  (g(!0), b(Oe, null, Pe(n.headerFields, (l, c) => (g(), ue($i(n.isResizable ? "DpResizableColumn" : "th"), {
31079
31085
  key: `header-${c}`,
31080
31086
  class: H([{ "border-r border-b-2 border-neutral-light-3": n.hasBorders }, { "p-[16px]": n.density === "spacious" }]),
31081
- "is-last": n.headerFields.length === c ? !0 : null,
31082
31087
  "header-field": l,
31083
- "next-header": n.headerFields[c + 1],
31084
- idx: c
31088
+ idx: c,
31089
+ "is-last": n.headerFields.length === c ? !0 : null,
31090
+ "next-header": n.headerFields[c + 1]
31085
31091
  }, {
31086
31092
  default: He(() => [
31087
31093
  t.$slots[`header-${l.field}`] && t.$slots[`header-${l.field}`](l)[0].children?.length > 0 ? z(t.$slots, `header-${l.field}`, ee({
@@ -31102,7 +31108,7 @@ function IW(t, e, n, r, i, s) {
31102
31108
  }, null, 8, PW)) : L("", !0)
31103
31109
  ]),
31104
31110
  _: 2
31105
- }, 1032, ["class", "is-last", "header-field", "next-header", "idx"]))), 128)),
31111
+ }, 1032, ["class", "header-field", "idx", "is-last", "next-header"]))), 128)),
31106
31112
  n.hasFlyout ? (g(), b("th", {
31107
31113
  key: 2,
31108
31114
  class: H([[{ "border-b-2 border-neutral-light-3": n.hasBorders }, { "p-[16px]": n.density === "spacious" }], "c-data-table__col--flyout"]),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@demos-europe/demosplan-ui",
3
- "version": "0.15.0",
3
+ "version": "0.16.0",
4
4
  "license": "MIT",
5
5
  "description": "Vue components, Vue directives, Design Token and Scss files to build interfaces for demosPlan.",
6
6
  "main": "./dist/demosplan-ui.mjs",
@@ -74,23 +74,24 @@
74
74
  "@babel/preset-env": "^7.27.2",
75
75
  "@babel/preset-react": "^7.27.1",
76
76
  "@babel/preset-typescript": "^7.27.1",
77
+ "@eslint/js": "^10.0.0",
77
78
  "@jest/globals": "^29.5.0",
78
79
  "@jest/transform": "^29.5.0",
79
80
  "@storybook/addon-docs": "10.2.13",
80
81
  "@storybook/addon-links": "10.2.13",
81
82
  "@storybook/vue3-vite": "10.2.13",
82
- "@stylistic/eslint-plugin": "^4.2.0",
83
+ "@stylistic/eslint-plugin": "^5.0.0",
83
84
  "@tailwindcss/postcss": "^4.1.6",
84
85
  "@types/eslint": "^9",
85
86
  "@types/jest": "^29.5.1",
86
87
  "@types/qs": "^6.9.7",
87
88
  "@types/sortablejs": "^1",
88
- "@typescript-eslint/eslint-plugin": "^8.29.0",
89
- "@typescript-eslint/parser": "^8.29.0",
89
+ "@typescript-eslint/eslint-plugin": "^8.58.0",
90
+ "@typescript-eslint/parser": "^8.58.0",
90
91
  "@vitejs/plugin-vue": "^6.0.0",
91
92
  "@vue/compat": "3.5.24",
92
93
  "@vue/compiler-sfc": "3.5.24",
93
- "@vue/eslint-config-typescript": "^14.5.0",
94
+ "@vue/eslint-config-typescript": "^14.7.0",
94
95
  "@vue/test-utils": "^2.4.6",
95
96
  "autoprefixer": "^10.4.14",
96
97
  "babel-core": "^7.0.0-bridge.0",
@@ -98,11 +99,11 @@
98
99
  "babel-jest": "^29.5.0",
99
100
  "babel-plugin-syntax-jsx": "^6.18.0",
100
101
  "babel-plugin-transform-vue-jsx": "^3.7.0",
101
- "eslint": "^9.23.0",
102
+ "eslint": "^10.2.0",
102
103
  "eslint-plugin-storybook": "10.2.10",
103
- "eslint-plugin-vue": "^10.0.0",
104
+ "eslint-plugin-vue": "^10.8.0",
104
105
  "eslint-plugin-vuejs-accessibility": "^2.4.1",
105
- "glob": "^11.0.1",
106
+ "glob": "^13.0.6",
106
107
  "globals": "^16.0.0",
107
108
  "jest": "^29.7.0",
108
109
  "jest-environment-jsdom": "^29.7.0",
@@ -6,6 +6,8 @@
6
6
  :class="{ 'u-pr-0': isLast, 'is-resizing bg-interactive-subtle-hover !border-r-interactive border-r-2 ': isResizing }"
7
7
  :data-col-field="headerField.field"
8
8
  :data-col-idx="idx"
9
+ @mouseenter="setColumnHover(true)"
10
+ @mouseleave="setColumnHover(false)"
9
11
  >
10
12
  <slot />
11
13
  <dp-resize-handle
@@ -116,6 +118,17 @@ export default {
116
118
  }
117
119
  },
118
120
 
121
+ setColumnHover (active) {
122
+ const table = this.$el.closest('table')
123
+
124
+ if (!table) {
125
+ return
126
+ }
127
+
128
+ table.querySelectorAll(`td[data-col-idx='${this.idx}']`)
129
+ .forEach(td => td.classList.toggle('is-col-hovered', active))
130
+ },
131
+
119
132
  stopResize () {
120
133
  this.currentHandle.classList.remove('is-active')
121
134
  this.dragStart = false
@@ -38,12 +38,12 @@
38
38
  :key="`header-${idx}`"
39
39
  >
40
40
  <component
41
- :class="[{ 'border-r border-b-2 border-neutral-light-3': hasBorders }, { 'p-[16px]': density === 'spacious' }]"
42
41
  :is="isResizable ? 'DpResizableColumn' : 'th'"
43
- :is-last="headerFields.length === idx ? true : null"
42
+ :class="[{ 'border-r border-b-2 border-neutral-light-3': hasBorders }, { 'p-[16px]': density === 'spacious' }]"
44
43
  :header-field="hf"
45
- :next-header="headerFields[idx + 1]"
46
44
  :idx="idx"
45
+ :is-last="headerFields.length === idx ? true : null"
46
+ :next-header="headerFields[idx + 1]"
47
47
  >
48
48
  <slot
49
49
  v-if="$slots[`header-${hf.field}`] && $slots[`header-${hf.field}`](hf)[0].children?.length > 0"
@@ -231,7 +231,7 @@ export default {
231
231
  },
232
232
  },
233
233
 
234
- beforeUpdate() {
234
+ beforeUpdate () {
235
235
  this.setIndeterminate()
236
236
  },
237
237
 
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
 
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ * Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
  */
5
5
 
6
6
  export default {
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-box-shadow-xl: 0 0 16px rgb(0 0 0 / 20%), 0 0 3px rgb(0 0 0 / 50%) !default;
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-breakpoints-xl: 1400px;
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-color-highlight-contrast: $dp-color-white !default;
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-color-11-11: #313695;
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-color-magenta-dark-2: #650324 !default;
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-color-background-medium: $dp-color-neutral-light-3 !default;
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-font-size-7: 50px !default;
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-rounded-full: 9999px;
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-space-1_5: 9px;
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Tue, 31 Mar 2026 16:55:02 GMT
3
+ // Generated on Thu, 09 Apr 2026 11:41:11 GMT
4
4
 
5
5
 
6
6
  $dp-z-ultimate: 10000;