@skf-design-system/ui-components 1.0.2-beta.2 → 1.0.2-beta.4

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 (131) hide show
  1. package/README.md +7 -1
  2. package/dist/components/accordion/accordion-item.component.js +49 -38
  3. package/dist/components/accordion/accordion.component.d.ts +1 -1
  4. package/dist/components/accordion/accordion.component.js +10 -10
  5. package/dist/components/alert/alert.component.d.ts +5 -1
  6. package/dist/components/alert/alert.component.js +57 -54
  7. package/dist/components/alert/alert.styles.js +51 -47
  8. package/dist/components/breadcrumb/breadcrumb-item.component.js +24 -25
  9. package/dist/components/breadcrumb/breadcrumb-item.d.ts +2 -2
  10. package/dist/components/breadcrumb/breadcrumb-item.styles.js +16 -15
  11. package/dist/components/breadcrumb/breadcrumb.component.d.ts +5 -2
  12. package/dist/components/breadcrumb/breadcrumb.component.js +51 -46
  13. package/dist/components/breadcrumb/breadcrumb.d.ts +2 -2
  14. package/dist/components/breadcrumb/breadcrumb.styles.js +13 -10
  15. package/dist/components/button/button.component.js +39 -39
  16. package/dist/components/button/button.styles.js +2 -1
  17. package/dist/components/card/card.component.d.ts +5 -0
  18. package/dist/components/card/card.component.js +46 -24
  19. package/dist/components/card/card.styles.js +31 -14
  20. package/dist/components/{date-picker/datepicker.calendar.component.d.ts → datepicker/datepicker-calendar.component.d.ts} +4 -1
  21. package/dist/components/{date-picker/datepicker.calendar.component.js → datepicker/datepicker-calendar.component.js} +7 -7
  22. package/dist/components/datepicker/datepicker-calendar.d.ts +8 -0
  23. package/dist/components/datepicker/datepicker-calendar.js +6 -0
  24. package/dist/components/{date-picker/datepicker.component.d.ts → datepicker/datepicker-popup.component.d.ts} +5 -20
  25. package/dist/components/{date-picker/datepicker.component.js → datepicker/datepicker-popup.component.js} +12 -12
  26. package/dist/components/datepicker/datepicker-popup.d.ts +8 -0
  27. package/dist/components/{date-picker/datepicker.helpers.d.ts → datepicker/datepicker-popup.helpers.d.ts} +3 -3
  28. package/dist/components/datepicker/datepicker-popup.helpers.js +83 -0
  29. package/dist/components/datepicker/datepicker-popup.js +6 -0
  30. package/dist/components/{date-picker/datepicker.styles.js → datepicker/datepicker-popup.styles.js} +3 -3
  31. package/dist/components/{date-picker-input/datepicker-input.component.d.ts → datepicker/datepicker.component.d.ts} +17 -12
  32. package/dist/components/{date-picker-input/datepicker-input.component.js → datepicker/datepicker.component.js} +110 -97
  33. package/dist/components/datepicker/datepicker.d.ts +8 -0
  34. package/dist/components/datepicker/datepicker.js +6 -0
  35. package/dist/components/dialog/dialog.component.js +1 -1
  36. package/dist/components/dialog/dialog.d.ts +2 -2
  37. package/dist/components/drawer/drawer.d.ts +2 -2
  38. package/dist/components/header/header.d.ts +2 -2
  39. package/dist/components/heading/heading.component.d.ts +5 -1
  40. package/dist/components/heading/heading.component.js +54 -27
  41. package/dist/components/heading/heading.styles.js +34 -36
  42. package/dist/components/icon/icon.component.d.ts +4 -0
  43. package/dist/components/icon/icon.component.js +52 -43
  44. package/dist/components/icon/icon.styles.js +60 -60
  45. package/dist/components/input/input.component.js +26 -26
  46. package/dist/components/logo/logo.component.d.ts +4 -1
  47. package/dist/components/logo/logo.component.js +55 -51
  48. package/dist/components/logo/logo.styles.js +26 -16
  49. package/dist/components/menu/menu-item.d.ts +2 -2
  50. package/dist/components/menu/menu.d.ts +2 -2
  51. package/dist/components/nav/nav-item.component.d.ts +2 -2
  52. package/dist/components/nav/nav.d.ts +2 -2
  53. package/dist/components/popover/popover.component.js +1 -1
  54. package/dist/components/popover/popover.d.ts +2 -2
  55. package/dist/components/progress/progress.d.ts +2 -2
  56. package/dist/components/progress/progress.styles.js +8 -6
  57. package/dist/components/segmented-button/segmented-button-item.d.ts +2 -2
  58. package/dist/components/segmented-button/segmented-button.d.ts +2 -2
  59. package/dist/components/select/select-option-group.d.ts +2 -2
  60. package/dist/components/select/select-option.component.d.ts +2 -2
  61. package/dist/components/select/select-option.component.js +9 -9
  62. package/dist/components/select/select.component.d.ts +2 -2
  63. package/dist/components/select/select.component.js +3 -4
  64. package/dist/components/select/select.controllers.js +11 -14
  65. package/dist/components/stepper/stepper-item.component.js +47 -47
  66. package/dist/components/stepper/stepper-item.d.ts +2 -2
  67. package/dist/components/stepper/stepper.d.ts +2 -2
  68. package/dist/components/switch/switch.d.ts +2 -2
  69. package/dist/components/{tab-panel → tabs}/tab-panel.d.ts +2 -2
  70. package/dist/components/{tab → tabs}/tab.component.d.ts +2 -2
  71. package/dist/components/{tab → tabs}/tab.d.ts +2 -2
  72. package/dist/components/{tab-group/tab-group.component.d.ts → tabs/tabs.component.d.ts} +3 -4
  73. package/dist/components/{tab-group/tab-group.component.js → tabs/tabs.component.js} +35 -36
  74. package/dist/components/tabs/tabs.d.ts +8 -0
  75. package/dist/components/tabs/tabs.js +6 -0
  76. package/dist/components/{tab-group/tab-group.styles.js → tabs/tabs.styles.js} +16 -16
  77. package/dist/components/tag/tag.component.d.ts +7 -2
  78. package/dist/components/tag/tag.component.js +69 -65
  79. package/dist/components/tag/tag.d.ts +2 -2
  80. package/dist/components/tag/tag.styles.js +63 -50
  81. package/dist/components/tooltip/tooltip.d.ts +2 -2
  82. package/dist/custom-elements.json +233 -126
  83. package/dist/index.d.ts +6 -5
  84. package/dist/index.js +96 -93
  85. package/dist/internal/base-classes/popover/popover.base.js +1 -1
  86. package/dist/internal/components/skf-element.d.ts +1 -3
  87. package/dist/internal/components/skf-element.js +4 -9
  88. package/dist/internal/helpers/stateMap.d.ts +14 -0
  89. package/dist/internal/helpers/stateMap.js +68 -0
  90. package/dist/internal/helpers/watch.d.ts +1 -1
  91. package/dist/internal/helpers/watch.js +12 -12
  92. package/dist/styles/component.styles.js +37 -36
  93. package/dist/styles/{global-without-fonts.css → global-alt.css} +1 -1
  94. package/dist/styles/global.css +1 -1
  95. package/dist/types/jsx/custom-element-jsx.d.ts +86 -44
  96. package/dist/types/vue/index.d.ts +86 -44
  97. package/dist/vscode.html-custom-data.json +103 -17
  98. package/dist/web-types.json +208 -55
  99. package/package.json +14 -20
  100. package/dist/components/accordion/accordion-item.test.d.ts +0 -1
  101. package/dist/components/accordion/accordion.test.d.ts +0 -1
  102. package/dist/components/checkbox/checkbox.test.d.ts +0 -1
  103. package/dist/components/date-picker/datepicker.d.ts +0 -10
  104. package/dist/components/date-picker/datepicker.helpers.js +0 -76
  105. package/dist/components/date-picker/datepicker.js +0 -8
  106. package/dist/components/date-picker-input/datepicker-input.d.ts +0 -8
  107. package/dist/components/date-picker-input/datepicker-input.js +0 -6
  108. package/dist/components/input/input.test.d.ts +0 -1
  109. package/dist/components/radio/radio.test.d.ts +0 -1
  110. package/dist/components/switch/switch.test.d.ts +0 -1
  111. package/dist/components/tab-group/tab-group.d.ts +0 -8
  112. package/dist/components/tab-group/tab-group.js +0 -6
  113. package/dist/internal/playwright/index.d.ts +0 -1
  114. /package/dist/components/{date-picker/datepicker.calendar.styles.d.ts → datepicker/datepicker-calendar.styles.d.ts} +0 -0
  115. /package/dist/components/{date-picker/datepicker.calendar.styles.js → datepicker/datepicker-calendar.styles.js} +0 -0
  116. /package/dist/components/{date-picker/datepicker.styles.d.ts → datepicker/datepicker-popup.styles.d.ts} +0 -0
  117. /package/dist/components/{date-picker-input/datepicker-input.helpers.d.ts → datepicker/datepicker.helpers.d.ts} +0 -0
  118. /package/dist/components/{date-picker-input/datepicker-input.helpers.js → datepicker/datepicker.helpers.js} +0 -0
  119. /package/dist/components/{date-picker-input/datepicker-input.styles.d.ts → datepicker/datepicker.styles.d.ts} +0 -0
  120. /package/dist/components/{date-picker-input/datepicker-input.styles.js → datepicker/datepicker.styles.js} +0 -0
  121. /package/dist/components/select/{select.stories.icons.d.ts → stories/select.stories.icons.d.ts} +0 -0
  122. /package/dist/components/{tab-panel → tabs}/tab-panel.component.d.ts +0 -0
  123. /package/dist/components/{tab-panel → tabs}/tab-panel.component.js +0 -0
  124. /package/dist/components/{tab-panel → tabs}/tab-panel.js +0 -0
  125. /package/dist/components/{tab-panel → tabs}/tab-panel.styles.d.ts +0 -0
  126. /package/dist/components/{tab-panel → tabs}/tab-panel.styles.js +0 -0
  127. /package/dist/components/{tab → tabs}/tab.component.js +0 -0
  128. /package/dist/components/{tab → tabs}/tab.js +0 -0
  129. /package/dist/components/{tab → tabs}/tab.styles.d.ts +0 -0
  130. /package/dist/components/{tab → tabs}/tab.styles.js +0 -0
  131. /package/dist/components/{tab-group/tab-group.styles.d.ts → tabs/tabs.styles.d.ts} +0 -0
package/package.json CHANGED
@@ -34,7 +34,7 @@
34
34
  "sideEffects": true,
35
35
  "type": "module",
36
36
  "types": "./dist/index.d.ts",
37
- "version": "1.0.2-beta.2",
37
+ "version": "1.0.2-beta.4",
38
38
  "dependencies": {
39
39
  "@floating-ui/dom": "^1.6.13",
40
40
  "@js-temporal/polyfill": "^0.5.1"
@@ -44,8 +44,7 @@
44
44
  "@commitlint/cli": "^19.8.0",
45
45
  "@commitlint/config-conventional": "^19.8.0",
46
46
  "@custom-elements-manifest/analyzer": "^0.10.4",
47
- "@eslint/js": "^9.23.0",
48
- "@playwright/test": "^1.51.1",
47
+ "@eslint/js": "^9.24.0",
49
48
  "@skf-design-system/ui-assets": "0.1.3-beta.4",
50
49
  "@storybook/addon-a11y": "^8.6.12",
51
50
  "@storybook/addon-essentials": "^8.6.12",
@@ -54,39 +53,37 @@
54
53
  "@storybook/blocks": "^8.6.12",
55
54
  "@storybook/manager-api": "^8.6.12",
56
55
  "@storybook/test": "^8.6.12",
57
- "@storybook/test-runner": "^0.22.0",
58
56
  "@storybook/theming": "^8.6.12",
59
57
  "@storybook/web-components": "^8.6.12",
60
58
  "@storybook/web-components-vite": "^8.6.12",
61
- "@types/node": "^22.14.0",
59
+ "@types/node": "^22.14.1",
62
60
  "@wc-toolkit/module-path-resolver": "^1.0.0",
63
- "@wc-toolkit/storybook-helpers": "^1.1.1",
61
+ "@wc-toolkit/storybook-helpers": "^1.1.2",
64
62
  "@wc-toolkit/type-parser": "^1.0.3",
65
63
  "concurrently": "^9.1.2",
66
64
  "custom-element-jet-brains-integration": "^1.7.0",
67
65
  "custom-element-jsx-integration": "^1.6.0",
68
66
  "custom-element-vs-code-integration": "^1.5.0",
69
67
  "custom-element-vuejs-integration": "^1.4.0",
70
- "eslint": "^9.23.0",
68
+ "eslint": "^9.24.0",
71
69
  "eslint-plugin-lit": "^2.0.0",
72
70
  "eslint-plugin-lit-a11y": "^4.1.4",
73
71
  "eslint-plugin-wc": "^3.0.0",
74
- "express": "^5.1.0",
75
72
  "husky": "^9.1.7",
76
- "lint-staged": "^15.5.0",
77
- "lit": "^3.2.1",
73
+ "lint-staged": "^15.5.1",
74
+ "lit": "^3.3.0",
78
75
  "postcss-styled-syntax": "^0.7.1",
79
76
  "prettier": "3.5.3",
80
77
  "storybook": "^8.6.12",
81
- "stylelint": "^16.17.0",
82
- "stylelint-config-standard": "^37.0.0",
78
+ "stylelint": "^16.18.0",
79
+ "stylelint-config-standard": "^38.0.0",
83
80
  "stylelint-no-unsupported-browser-features": "^8.0.4",
84
81
  "stylelint-order": "^6.0.4",
85
82
  "stylelint-value-no-unknown-custom-properties": "^6.0.1",
86
- "tsc-alias": "^1.8.13",
87
- "typescript": "^5.8.2",
88
- "typescript-eslint": "^8.29.0",
89
- "vite": "^6.2.4",
83
+ "tsc-alias": "^1.8.15",
84
+ "typescript": "^5.8.3",
85
+ "typescript-eslint": "^8.30.1",
86
+ "vite": "^6.3.0",
90
87
  "vite-tsconfig-paths": "^5.1.4"
91
88
  },
92
89
  "peerDependencies": {
@@ -107,9 +104,6 @@
107
104
  "lint:eslint": "eslint \"**/*.{js,ts}\" --ignore-pattern .gitignore",
108
105
  "lint:prettier": "prettier \"**/*.{js,ts}\" --check --ignore-path .gitignore --log-level warn",
109
106
  "lint:stylelint": "stylelint \"**/*.{css,ts}\" --quiet --ignore-path .gitignore",
110
- "serve:storybook-static": "pnpm build && pnpm storybook build && node ./build/serve.js",
111
- "storybook": "concurrently \"storybook dev -p 9009\" \"pnpm analyze --watch\"",
112
- "test": "npx playwright test",
113
- "test:ui": " npx playwright test --ui"
107
+ "storybook": "concurrently \"storybook dev -p 6006\" \"pnpm analyze --watch\""
114
108
  }
115
109
  }
@@ -1 +0,0 @@
1
- export {};
@@ -1 +0,0 @@
1
- export {};
@@ -1 +0,0 @@
1
- export {};
@@ -1,10 +0,0 @@
1
- import { SkfDatePickerCalendar } from './datepicker.calendar.component.js';
2
- import { SkfDatePicker } from './datepicker.component.js';
3
- export * from './datepicker.component.js';
4
- export default SkfDatePicker;
5
- declare global {
6
- interface HTMLElementTagNameMap {
7
- 'skf-datepicker': SkfDatePicker;
8
- 'skf-datepicker-calendar': SkfDatePickerCalendar;
9
- }
10
- }
@@ -1,76 +0,0 @@
1
- import { is as c } from "../date-picker-input/datepicker-input.helpers.js";
2
- import { Temporal as e } from "@js-temporal/polyfill";
3
- function I(t, n, s) {
4
- const o = (r) => Array.isArray(r) ? r : [r], f = o(t);
5
- n = o(n);
6
- const a = [];
7
- for (const r of f) {
8
- const { promise: i, resolve: m, reject: p } = Promise.withResolvers(), l = r.animate(n, {
9
- fill: "forwards",
10
- duration: 300,
11
- iterations: 1,
12
- ...s
13
- });
14
- l.onfinish = () => m("finished"), l.oncancel = () => p("canceled"), a.push(i);
15
- }
16
- return Promise.allSettled(a);
17
- }
18
- function P(t = e.Now.plainDateISO()) {
19
- return t ?? (t = e.Now.plainDateISO()), t instanceof Date && (t = e.PlainDate.from(t.toISOString())), typeof t == "string" && (t = e.PlainDate.from(S(t, !0))), {
20
- year: t.year,
21
- month: t.month - 1,
22
- // new Date is 0 based
23
- day: t.day
24
- };
25
- }
26
- function v(t, n, s = "days") {
27
- console.assert(c(t, n).plainISO(), "Invalid dates passed to compareDates()"), typeof t == "string" && (t = e.PlainDate.from(t)), typeof n == "string" && (n = e.PlainDate.from(n)), console.assert(
28
- c(t, n).plain(),
29
- `Invalid date was sent to helper function compareDates(). Got ${JSON.stringify(t)} and ${JSON.stringify(n)} passed in`
30
- );
31
- const o = D(t, n, s);
32
- return f(o);
33
- function f(a) {
34
- return Math.max(-1, Math.min(a, 1));
35
- }
36
- }
37
- function D(t, n, s = "days") {
38
- return typeof t == "string" && (t = e.PlainDate.from(t)), typeof n == "string" && (n = e.PlainDate.from(n)), console.assert(
39
- t instanceof e.PlainDate && n instanceof e.PlainDate,
40
- `Invalid date was sent to helper function timeBetween(). Got ${JSON.stringify(t)} and ${JSON.stringify(n)} passed in`
41
- ), s === "months" ? n.until(t, { largestUnit: "months" }).months : s === "years" ? n.until(t, { largestUnit: "years" }).years : n.until(t, { largestUnit: "days" }).days;
42
- }
43
- function u(...t) {
44
- if (t.length === 0)
45
- throw new Error("At least one date must be provided");
46
- const n = (i) => i instanceof Date, s = t.map((i) => n(i) ? i : new Date(i));
47
- if (s.length === 1)
48
- return s[0].toISOString().split("T")[0];
49
- const [o, ...f] = s, a = u(...f), r = new Date(a);
50
- return o < r ? o.toISOString().split("T")[0] : r.toISOString().split("T")[0];
51
- }
52
- function g(...t) {
53
- if (t.length === 0)
54
- throw new Error("At least one date must be provided");
55
- const n = (i) => i instanceof Date, s = t.map((i) => n(i) ? i : new Date(i));
56
- if (s.length === 1)
57
- return s[0].toISOString().split("T")[0];
58
- const [o, ...f] = s, a = g(...f), r = new Date(a);
59
- return o > r ? o.toISOString().split("T")[0] : r.toISOString().split("T")[0];
60
- }
61
- function S(t, n = !1) {
62
- t instanceof Date && (t = e.PlainDate.from(t.toISOString())), typeof t != "string" && (t = t.toString());
63
- const s = /^\d{4}-\d{2}-\d{2}$/;
64
- if (!s.test(t) && n)
65
- throw new Error(`Invalid date format. Got ${t} passed in.`);
66
- return s.test(t) ? t : "";
67
- }
68
- export {
69
- S as assertISODate,
70
- v as compareDates,
71
- I as doAnimate,
72
- u as earliestDate,
73
- P as getDateParts,
74
- g as latestDate,
75
- D as timeBetween
76
- };
@@ -1,8 +0,0 @@
1
- import { SkfDatePickerCalendar as e } from "./datepicker.calendar.component.js";
2
- import { SkfDatePicker as r } from "./datepicker.component.js";
3
- r.define("skf-datepicker");
4
- e.define("skf-datepicker-calendar");
5
- export {
6
- r as SkfDatePicker,
7
- r as default
8
- };
@@ -1,8 +0,0 @@
1
- import { SkfDatePickerInput } from './datepicker-input.component.js';
2
- export * from './datepicker-input.component.js';
3
- export default SkfDatePickerInput;
4
- declare global {
5
- interface HTMLElementTagNameMap {
6
- 'skf-datepicker-input': SkfDatePickerInput;
7
- }
8
- }
@@ -1,6 +0,0 @@
1
- import { SkfDatePickerInput as e } from "./datepicker-input.component.js";
2
- e.define("skf-datepicker-input");
3
- export {
4
- e as SkfDatePickerInput,
5
- e as default
6
- };
@@ -1 +0,0 @@
1
- export {};
@@ -1 +0,0 @@
1
- export {};
@@ -1 +0,0 @@
1
- export {};
@@ -1,8 +0,0 @@
1
- import { SkfTabGroup } from './tab-group.component';
2
- export * from './tab-group.component';
3
- export default SkfTabGroup;
4
- declare global {
5
- interface HTMLElementTagNameMap {
6
- 'skf-tab-group': SkfTabGroup;
7
- }
8
- }
@@ -1,6 +0,0 @@
1
- import { SkfTabGroup as f } from "./tab-group.component.js";
2
- f.define("skf-tab-group");
3
- export {
4
- f as SkfTabGroup,
5
- f as default
6
- };
@@ -1 +0,0 @@
1
- export declare function fixture(id: string, name: string): string;
File without changes
File without changes
File without changes
File without changes