@maggioli-design-system/mds-input-range 2.5.1 → 2.5.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/collection/common/locale.js +10 -8
- package/dist/collection/common/number.js +5 -0
- package/dist/collection/common/slot.js +10 -1
- package/dist/collection/common/unit.js +16 -1
- package/dist/collection/components/mds-input-range/test/mds-input-range.stories.js +37 -21
- package/dist/collection/dictionary/button.js +20 -1
- package/dist/collection/dictionary/icon.js +1 -1
- package/dist/collection/dictionary/variant.js +9 -1
- package/dist/documentation.json +1 -1
- package/dist/stats.json +7 -6
- package/dist/types/common/number.d.ts +2 -0
- package/dist/types/common/slot.d.ts +2 -1
- package/dist/types/common/unit.d.ts +3 -1
- package/dist/types/components/mds-input-range/test/mds-input-range.stories.d.ts +39 -8
- package/dist/types/dictionary/button.d.ts +4 -1
- package/dist/types/dictionary/icon.d.ts +1 -1
- package/dist/types/dictionary/variant.d.ts +2 -1
- package/dist/types/type/button.d.ts +2 -0
- package/dist/types/type/variant.d.ts +1 -0
- package/documentation.json +34 -4
- package/package.json +3 -3
- package/src/common/locale.ts +10 -8
- package/src/common/number.ts +8 -0
- package/src/common/slot.ts +12 -0
- package/src/common/unit.ts +23 -0
- package/src/components/mds-input-range/test/mds-input-range.stories.tsx +64 -34
- package/src/dictionary/button.ts +25 -0
- package/src/dictionary/icon.ts +2 -1
- package/src/dictionary/variant.ts +11 -1
- package/src/tailwind/components.css +1 -1
- package/src/type/button.ts +15 -0
- package/src/type/variant.ts +8 -0
- package/src/fixtures/icons.json +0 -459
- package/src/fixtures/iconsauce.json +0 -306
|
@@ -19,15 +19,17 @@ export class Locale {
|
|
|
19
19
|
};
|
|
20
20
|
this.update = (doc) => {
|
|
21
21
|
const context = doc !== null && doc !== void 0 ? doc : this.element.shadowRoot;
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
22
|
+
if (context) {
|
|
23
|
+
context.querySelectorAll('*').forEach(el => {
|
|
24
|
+
if (el.tagName.toLowerCase().startsWith('mds-')) {
|
|
25
|
+
// eslint-disable-next-line no-restricted-syntax
|
|
26
|
+
if (el && 'updateLang' in el) {
|
|
27
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
28
|
+
el.updateLang();
|
|
29
|
+
}
|
|
28
30
|
}
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
+
});
|
|
32
|
+
}
|
|
31
33
|
};
|
|
32
34
|
this.pluralize = (tag, context) => {
|
|
33
35
|
const languagePhrase = this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag];
|
|
@@ -25,4 +25,13 @@ const hasSlotted = (el, name) => {
|
|
|
25
25
|
}
|
|
26
26
|
return false;
|
|
27
27
|
};
|
|
28
|
-
|
|
28
|
+
const hasSlottedContent = (el, name) => {
|
|
29
|
+
var _a;
|
|
30
|
+
const query = name ? `slot[name="${name}"]` : 'slot:not([name])';
|
|
31
|
+
const slot = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(query);
|
|
32
|
+
if (!slot)
|
|
33
|
+
return false;
|
|
34
|
+
const assignedNodes = slot.assignedNodes({ flatten: true });
|
|
35
|
+
return assignedNodes.some(node => { var _a; return node.nodeType === Node.TEXT_NODE && ((_a = node.textContent) === null || _a === void 0 ? void 0 : _a.trim()) !== ''; });
|
|
36
|
+
};
|
|
37
|
+
export { hasSlottedElements, hasSlottedNodes, hasSlottedContent, hasSlotted, };
|
|
@@ -7,6 +7,15 @@ const cssDurationToMilliseconds = (duration, defaultValue = 1000) => {
|
|
|
7
7
|
}
|
|
8
8
|
return defaultValue;
|
|
9
9
|
};
|
|
10
|
+
const cssDurationToSeconds = (duration, defaultValue = 1000) => {
|
|
11
|
+
if (duration.includes('ms')) {
|
|
12
|
+
return Number(duration.replace('ms', '')) / 1000;
|
|
13
|
+
}
|
|
14
|
+
if (duration.includes('s')) {
|
|
15
|
+
return Number(duration.replace('s', ''));
|
|
16
|
+
}
|
|
17
|
+
return defaultValue;
|
|
18
|
+
};
|
|
10
19
|
const cssSizeToNumber = (size, defaultValue = 0) => {
|
|
11
20
|
if (size.includes('px')) {
|
|
12
21
|
return Number(size.replace('px', ''));
|
|
@@ -19,4 +28,10 @@ const cssSizeToNumber = (size, defaultValue = 0) => {
|
|
|
19
28
|
}
|
|
20
29
|
return defaultValue;
|
|
21
30
|
};
|
|
22
|
-
|
|
31
|
+
const cssRotationToNumber = (size, defaultValue = 0) => {
|
|
32
|
+
if (size.includes('deg')) {
|
|
33
|
+
return Number(size.replace('deg', ''));
|
|
34
|
+
}
|
|
35
|
+
return defaultValue;
|
|
36
|
+
};
|
|
37
|
+
export { cssDurationToMilliseconds, cssDurationToSeconds, cssRotationToNumber, cssSizeToNumber, };
|
|
@@ -25,7 +25,7 @@ export default {
|
|
|
25
25
|
},
|
|
26
26
|
},
|
|
27
27
|
};
|
|
28
|
-
const Template = args => h("mds-input-range", Object.assign({}, args), "Range label");
|
|
28
|
+
const Template = args => (h("mds-input-range", Object.assign({}, args), "Range label"));
|
|
29
29
|
const TemplateFormatLabel = args => {
|
|
30
30
|
useEffect(() => {
|
|
31
31
|
document.querySelector('#custom-labeled').formatValue = formatValue;
|
|
@@ -42,34 +42,50 @@ const TemplateFormatLabel = args => {
|
|
|
42
42
|
const value = parseFloat((bytes / Math.pow(k, i)).toFixed(decimals));
|
|
43
43
|
return `${value} ${sizes[i]}`;
|
|
44
44
|
};
|
|
45
|
-
return h("div", null, h("mds-input-range", Object.assign({ id: "custom-labeled" }, args, { step: "1048576", min: "0", max: "1073741824" }), "File size"));
|
|
45
|
+
return (h("div", null, h("mds-input-range", Object.assign({ id: "custom-labeled" }, args, { step: "1048576", min: "0", max: "1073741824" }), "File size")));
|
|
46
46
|
};
|
|
47
47
|
const hideHeaderCss = `
|
|
48
48
|
mds-input-range::part(header) {
|
|
49
49
|
display: none;
|
|
50
50
|
}
|
|
51
51
|
`;
|
|
52
|
-
const HideHeaderTemplate = args => h("div", null, h("style", null, hideHeaderCss), h("mds-input-range", Object.assign({}, args), "This shouldn't be visible"));
|
|
53
|
-
export const Default =
|
|
54
|
-
|
|
55
|
-
Disabled.args = {
|
|
56
|
-
disabled: true,
|
|
52
|
+
const HideHeaderTemplate = args => (h("div", null, h("style", null, hideHeaderCss), h("mds-input-range", Object.assign({}, args), "This shouldn't be visible")));
|
|
53
|
+
export const Default = {
|
|
54
|
+
render: Template,
|
|
57
55
|
};
|
|
58
|
-
export const
|
|
59
|
-
|
|
60
|
-
|
|
56
|
+
export const Disabled = {
|
|
57
|
+
render: Template,
|
|
58
|
+
args: {
|
|
59
|
+
disabled: true,
|
|
60
|
+
},
|
|
61
|
+
};
|
|
62
|
+
export const Min = {
|
|
63
|
+
render: Template,
|
|
64
|
+
args: {
|
|
65
|
+
min: -100,
|
|
66
|
+
},
|
|
67
|
+
};
|
|
68
|
+
export const Max = {
|
|
69
|
+
render: Template,
|
|
70
|
+
args: {
|
|
71
|
+
max: 200,
|
|
72
|
+
},
|
|
73
|
+
};
|
|
74
|
+
export const Step = {
|
|
75
|
+
render: Template,
|
|
76
|
+
args: {
|
|
77
|
+
step: 10,
|
|
78
|
+
},
|
|
61
79
|
};
|
|
62
|
-
export const
|
|
63
|
-
|
|
64
|
-
|
|
80
|
+
export const Value = {
|
|
81
|
+
render: Template,
|
|
82
|
+
args: {
|
|
83
|
+
value: 90,
|
|
84
|
+
},
|
|
65
85
|
};
|
|
66
|
-
export const
|
|
67
|
-
|
|
68
|
-
step: 10,
|
|
86
|
+
export const FormatLabel = {
|
|
87
|
+
render: TemplateFormatLabel,
|
|
69
88
|
};
|
|
70
|
-
export const
|
|
71
|
-
|
|
72
|
-
value: 90,
|
|
89
|
+
export const HideHeader = {
|
|
90
|
+
render: HideHeaderTemplate,
|
|
73
91
|
};
|
|
74
|
-
export const FormatLabel = TemplateFormatLabel.bind({});
|
|
75
|
-
export const HideHeader = HideHeaderTemplate.bind({});
|
|
@@ -11,12 +11,27 @@ const buttonVariantDictionary = [
|
|
|
11
11
|
'success',
|
|
12
12
|
'warning',
|
|
13
13
|
];
|
|
14
|
+
const buttonDropdownVariantDictionary = [
|
|
15
|
+
'ai',
|
|
16
|
+
'dark',
|
|
17
|
+
'error',
|
|
18
|
+
'info',
|
|
19
|
+
'light',
|
|
20
|
+
'primary',
|
|
21
|
+
'secondary',
|
|
22
|
+
'success',
|
|
23
|
+
'warning',
|
|
24
|
+
];
|
|
14
25
|
const buttonToneVariantDictionary = [
|
|
15
26
|
'strong',
|
|
16
27
|
'weak',
|
|
17
28
|
'ghost',
|
|
18
29
|
'quiet',
|
|
19
30
|
];
|
|
31
|
+
const buttonToneMinimalVariantDictionary = [
|
|
32
|
+
'strong',
|
|
33
|
+
'weak',
|
|
34
|
+
];
|
|
20
35
|
const buttonTargetDictionary = [
|
|
21
36
|
'blank',
|
|
22
37
|
'self',
|
|
@@ -27,6 +42,10 @@ const buttonSizeDictionary = [
|
|
|
27
42
|
'lg',
|
|
28
43
|
'xl',
|
|
29
44
|
];
|
|
45
|
+
const tabSizeDictionary = [
|
|
46
|
+
'sm',
|
|
47
|
+
'md',
|
|
48
|
+
];
|
|
30
49
|
const buttonIconPositionDictionary = [
|
|
31
50
|
'left',
|
|
32
51
|
'right',
|
|
@@ -36,4 +55,4 @@ const buttonTypeDictionary = [
|
|
|
36
55
|
'submit',
|
|
37
56
|
'reset',
|
|
38
57
|
];
|
|
39
|
-
export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonTypeDictionary, buttonVariantDictionary, };
|
|
58
|
+
export { buttonDropdownVariantDictionary, buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneMinimalVariantDictionary, buttonToneVariantDictionary, buttonTypeDictionary, buttonVariantDictionary, tabSizeDictionary, };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import jsonIconsDictionary from "../fixtures/icons.json";
|
|
2
|
-
import jsonMggIconsDictionary from "
|
|
2
|
+
import jsonMggIconsDictionary from "@maggioli-design-system/svg-icons/dist/iconsauce.json";
|
|
3
3
|
const iconsDictionary = jsonIconsDictionary;
|
|
4
4
|
const mggIconsDictionary = jsonMggIconsDictionary;
|
|
5
5
|
const svgIconsDictionary = [
|
|
@@ -18,6 +18,14 @@ const themeStatusVariantDictionary = [
|
|
|
18
18
|
'success',
|
|
19
19
|
'warning',
|
|
20
20
|
];
|
|
21
|
+
const themeInputVariantDictionary = [
|
|
22
|
+
'ai',
|
|
23
|
+
'error',
|
|
24
|
+
'info',
|
|
25
|
+
'primary',
|
|
26
|
+
'success',
|
|
27
|
+
'warning',
|
|
28
|
+
];
|
|
21
29
|
const themeFullVariantDictionary = [
|
|
22
30
|
'amaranth',
|
|
23
31
|
'aqua',
|
|
@@ -113,4 +121,4 @@ const toneMinimalVariantDictionary = [
|
|
|
113
121
|
'strong',
|
|
114
122
|
'weak',
|
|
115
123
|
];
|
|
116
|
-
export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary,
|
|
124
|
+
export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeInputVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantChipDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };
|
package/dist/documentation.json
CHANGED
package/dist/stats.json
CHANGED
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
{
|
|
2
|
-
"timestamp": "
|
|
2
|
+
"timestamp": "2026-01-16T15:00:12",
|
|
3
3
|
"compiler": {
|
|
4
4
|
"name": "node",
|
|
5
|
-
"version": "22.
|
|
5
|
+
"version": "22.15.0"
|
|
6
6
|
},
|
|
7
7
|
"app": {
|
|
8
8
|
"namespace": "MdsInputRange",
|
|
9
9
|
"fsNamespace": "mds-input-range",
|
|
10
10
|
"components": 1,
|
|
11
11
|
"entries": 1,
|
|
12
|
-
"bundles":
|
|
12
|
+
"bundles": 104,
|
|
13
13
|
"outputs": [
|
|
14
14
|
{
|
|
15
15
|
"name": "dist-collection",
|
|
16
|
-
"files":
|
|
16
|
+
"files": 56,
|
|
17
17
|
"generatedFiles": [
|
|
18
18
|
"./dist/collection/common/aria.js",
|
|
19
19
|
"./dist/collection/common/browser.js",
|
|
@@ -24,6 +24,7 @@
|
|
|
24
24
|
"./dist/collection/common/icon.js",
|
|
25
25
|
"./dist/collection/common/keyboard-manager.js",
|
|
26
26
|
"./dist/collection/common/locale.js",
|
|
27
|
+
"./dist/collection/common/number.js",
|
|
27
28
|
"./dist/collection/common/slot.js",
|
|
28
29
|
"./dist/collection/common/string.js",
|
|
29
30
|
"./dist/collection/common/unit.js",
|
|
@@ -767,6 +768,7 @@
|
|
|
767
768
|
"./src/common/icon.ts": [],
|
|
768
769
|
"./src/common/keyboard-manager.ts": [],
|
|
769
770
|
"./src/common/locale.ts": [],
|
|
771
|
+
"./src/common/number.ts": [],
|
|
770
772
|
"./src/common/slot.ts": [],
|
|
771
773
|
"./src/common/string.ts": [],
|
|
772
774
|
"./src/common/unit.ts": [],
|
|
@@ -795,8 +797,7 @@
|
|
|
795
797
|
"./src/dictionary/file-extensions.ts": [],
|
|
796
798
|
"./src/dictionary/floating-ui.ts": [],
|
|
797
799
|
"./src/dictionary/icon.ts": [
|
|
798
|
-
"./src/fixtures/icons.json"
|
|
799
|
-
"./src/fixtures/iconsauce.json"
|
|
800
|
+
"./src/fixtures/icons.json"
|
|
800
801
|
],
|
|
801
802
|
"./src/dictionary/input.ts": [],
|
|
802
803
|
"./src/dictionary/keyboard.ts": [],
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
declare const hasSlottedElements: (el: HTMLElement, name?: string) => boolean;
|
|
2
2
|
declare const hasSlottedNodes: (el: HTMLElement, name?: string) => boolean;
|
|
3
3
|
declare const hasSlotted: (el: HTMLElement, name?: string) => boolean;
|
|
4
|
-
|
|
4
|
+
declare const hasSlottedContent: (el: HTMLElement, name?: string) => boolean;
|
|
5
|
+
export { hasSlottedElements, hasSlottedNodes, hasSlottedContent, hasSlotted, };
|
|
@@ -1,3 +1,5 @@
|
|
|
1
1
|
declare const cssDurationToMilliseconds: (duration: string, defaultValue?: number) => number;
|
|
2
|
+
declare const cssDurationToSeconds: (duration: string, defaultValue?: number) => number;
|
|
2
3
|
declare const cssSizeToNumber: (size: string, defaultValue?: number) => number;
|
|
3
|
-
|
|
4
|
+
declare const cssRotationToNumber: (size: string, defaultValue?: number) => number;
|
|
5
|
+
export { cssDurationToMilliseconds, cssDurationToSeconds, cssRotationToNumber, cssSizeToNumber, };
|
|
@@ -34,11 +34,42 @@ declare const _default: {
|
|
|
34
34
|
};
|
|
35
35
|
};
|
|
36
36
|
export default _default;
|
|
37
|
-
export declare const Default:
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
export declare const
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
37
|
+
export declare const Default: {
|
|
38
|
+
render: (args: any) => any;
|
|
39
|
+
};
|
|
40
|
+
export declare const Disabled: {
|
|
41
|
+
render: (args: any) => any;
|
|
42
|
+
args: {
|
|
43
|
+
disabled: boolean;
|
|
44
|
+
};
|
|
45
|
+
};
|
|
46
|
+
export declare const Min: {
|
|
47
|
+
render: (args: any) => any;
|
|
48
|
+
args: {
|
|
49
|
+
min: number;
|
|
50
|
+
};
|
|
51
|
+
};
|
|
52
|
+
export declare const Max: {
|
|
53
|
+
render: (args: any) => any;
|
|
54
|
+
args: {
|
|
55
|
+
max: number;
|
|
56
|
+
};
|
|
57
|
+
};
|
|
58
|
+
export declare const Step: {
|
|
59
|
+
render: (args: any) => any;
|
|
60
|
+
args: {
|
|
61
|
+
step: number;
|
|
62
|
+
};
|
|
63
|
+
};
|
|
64
|
+
export declare const Value: {
|
|
65
|
+
render: (args: any) => any;
|
|
66
|
+
args: {
|
|
67
|
+
value: number;
|
|
68
|
+
};
|
|
69
|
+
};
|
|
70
|
+
export declare const FormatLabel: {
|
|
71
|
+
render: (args: any) => any;
|
|
72
|
+
};
|
|
73
|
+
export declare const HideHeader: {
|
|
74
|
+
render: (args: any) => any;
|
|
75
|
+
};
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
declare const buttonVariantDictionary: string[];
|
|
2
|
+
declare const buttonDropdownVariantDictionary: string[];
|
|
2
3
|
declare const buttonToneVariantDictionary: string[];
|
|
4
|
+
declare const buttonToneMinimalVariantDictionary: string[];
|
|
3
5
|
declare const buttonTargetDictionary: string[];
|
|
4
6
|
declare const buttonSizeDictionary: string[];
|
|
7
|
+
declare const tabSizeDictionary: string[];
|
|
5
8
|
declare const buttonIconPositionDictionary: string[];
|
|
6
9
|
declare const buttonTypeDictionary: string[];
|
|
7
|
-
export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonTypeDictionary, buttonVariantDictionary, };
|
|
10
|
+
export { buttonDropdownVariantDictionary, buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneMinimalVariantDictionary, buttonToneVariantDictionary, buttonTypeDictionary, buttonVariantDictionary, tabSizeDictionary, };
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
declare const themeVariantDictionary: string[];
|
|
2
2
|
declare const themeLuminanceVariantDictionary: string[];
|
|
3
3
|
declare const themeStatusVariantDictionary: string[];
|
|
4
|
+
declare const themeInputVariantDictionary: string[];
|
|
4
5
|
declare const themeFullVariantDictionary: string[];
|
|
5
6
|
declare const themeFullVariantAvatarDictionary: string[];
|
|
6
7
|
declare const themeLabelVariantDictionary: string[];
|
|
@@ -10,4 +11,4 @@ declare const toneActionVariantDictionary: string[];
|
|
|
10
11
|
declare const toneSimpleVariantDictionary: string[];
|
|
11
12
|
declare const toneSmartVariantDictionary: string[];
|
|
12
13
|
declare const toneMinimalVariantDictionary: string[];
|
|
13
|
-
export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary,
|
|
14
|
+
export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeInputVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantChipDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
export type ButtonType = 'a' | 'button' | 'reset' | 'submit';
|
|
2
2
|
export type ButtonTargetType = 'self' | 'blank';
|
|
3
3
|
export type ButtonSizeType = 'sm' | 'md' | 'lg' | 'xl';
|
|
4
|
+
export type TabSizeType = 'sm' | 'md';
|
|
4
5
|
export type ButtonIconPositionType = 'left' | 'right';
|
|
5
6
|
export type ButtonVariantType = 'ai' | 'apple' | 'dark' | 'error' | 'google' | 'info' | 'light' | 'primary' | 'secondary' | 'success' | 'warning';
|
|
7
|
+
export type ButtonDropdownVariantType = 'ai' | 'dark' | 'error' | 'info' | 'light' | 'primary' | 'secondary' | 'success' | 'warning';
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export type ThemeStatusVariantType = 'error' | 'info' | 'success' | 'warning';
|
|
2
|
+
export type ThemeInputVariantType = 'primary' | 'ai' | 'error' | 'info' | 'success' | 'warning';
|
|
2
3
|
export type ThemeVariantType = 'ai' | 'dark' | 'error' | 'info' | 'light' | 'primary' | 'success' | 'warning';
|
|
3
4
|
export type ThemeFullVariantType = 'amaranth' | 'aqua' | 'blue' | 'dark' | 'error' | 'green' | 'info' | 'light' | 'lime' | 'orange' | 'orchid' | 'sky' | 'success' | 'violet' | 'warning' | 'yellow';
|
|
4
5
|
export type ThemeFullVariantAvatarType = 'amaranth' | 'aqua' | 'blue' | 'error' | 'green' | 'info' | 'lime' | 'orange' | 'orchid' | 'primary' | 'sky' | 'success' | 'violet' | 'warning' | 'yellow';
|
package/documentation.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"timestamp": "
|
|
2
|
+
"timestamp": "2026-01-16T12:28:24",
|
|
3
3
|
"compiler": {
|
|
4
4
|
"name": "@stencil/core",
|
|
5
5
|
"version": "4.27.2",
|
|
@@ -366,6 +366,11 @@
|
|
|
366
366
|
"docstring": "",
|
|
367
367
|
"path": "src/type/text.ts"
|
|
368
368
|
},
|
|
369
|
+
"src/type/button.ts::ButtonDropdownVariantType": {
|
|
370
|
+
"declaration": "export type ButtonDropdownVariantType =\n | 'ai'\n | 'dark'\n | 'error'\n | 'info'\n | 'light'\n | 'primary'\n | 'secondary'\n | 'success'\n | 'warning'",
|
|
371
|
+
"docstring": "",
|
|
372
|
+
"path": "src/type/button.ts"
|
|
373
|
+
},
|
|
369
374
|
"src/components/mds-calendar-cell/meta/types.ts::CalendarCellType": {
|
|
370
375
|
"declaration": "export type CalendarCellType =\n | 'other'\n | 'current'\n | 'weekend'",
|
|
371
376
|
"docstring": "",
|
|
@@ -387,7 +392,7 @@
|
|
|
387
392
|
"path": "src/type/variant.ts"
|
|
388
393
|
},
|
|
389
394
|
"src/components/mds-chip/meta/interface.ts::MdsChipEvent": {
|
|
390
|
-
"declaration": "interface MdsChipEvent {\n event: Event\n element: HTMLMdsChipElement\n}",
|
|
395
|
+
"declaration": "interface MdsChipEvent {\n event: Event\n selected?: boolean\n element: HTMLMdsChipElement\n}",
|
|
391
396
|
"docstring": "",
|
|
392
397
|
"path": "src/components/mds-chip/meta/interface.ts"
|
|
393
398
|
},
|
|
@@ -506,8 +511,8 @@
|
|
|
506
511
|
"docstring": "",
|
|
507
512
|
"path": "src/type/input.ts"
|
|
508
513
|
},
|
|
509
|
-
"src/type/variant.ts::
|
|
510
|
-
"declaration": "export type
|
|
514
|
+
"src/type/variant.ts::ThemeInputVariantType": {
|
|
515
|
+
"declaration": "export type ThemeInputVariantType =\n | 'primary'\n | 'ai'\n | 'error'\n | 'info'\n | 'success'\n | 'warning'",
|
|
511
516
|
"docstring": "",
|
|
512
517
|
"path": "src/type/variant.ts"
|
|
513
518
|
},
|
|
@@ -536,6 +541,11 @@
|
|
|
536
541
|
"docstring": "",
|
|
537
542
|
"path": "src/components/mds-input/meta/validators.ts"
|
|
538
543
|
},
|
|
544
|
+
"src/type/variant.ts::ThemeStatusVariantType": {
|
|
545
|
+
"declaration": "export type ThemeStatusVariantType =\n | 'error'\n | 'info'\n | 'success'\n | 'warning'",
|
|
546
|
+
"docstring": "",
|
|
547
|
+
"path": "src/type/variant.ts"
|
|
548
|
+
},
|
|
539
549
|
"src/components/mds-input-switch/meta/types.ts::InputSwitchSizeType": {
|
|
540
550
|
"declaration": "export type InputSwitchSizeType =\n | 'sm'\n | 'md'\n | 'lg'",
|
|
541
551
|
"docstring": "",
|
|
@@ -591,6 +601,11 @@
|
|
|
591
601
|
"docstring": "",
|
|
592
602
|
"path": "src/type/typography.ts"
|
|
593
603
|
},
|
|
604
|
+
"src/components/mds-mention/meta/type.ts::MentionSize": {
|
|
605
|
+
"declaration": "export type MentionSize =\n | 'sm'\n | 'md'\n | 'lg'",
|
|
606
|
+
"docstring": "",
|
|
607
|
+
"path": "src/components/mds-mention/meta/type.ts"
|
|
608
|
+
},
|
|
594
609
|
"src/components/mds-modal/meta/types.ts::ModalPositionType": {
|
|
595
610
|
"declaration": "export type ModalPositionType =\n | 'bottom'\n | 'bottom-left'\n | 'bottom-right'\n | 'center'\n | 'left'\n | 'right'\n | 'top'\n | 'top-left'\n | 'top-right'",
|
|
596
611
|
"docstring": "",
|
|
@@ -631,6 +646,11 @@
|
|
|
631
646
|
"docstring": "",
|
|
632
647
|
"path": "src/components/mds-policy-ai/meta/types.ts"
|
|
633
648
|
},
|
|
649
|
+
"src/type/button.ts::TabSizeType": {
|
|
650
|
+
"declaration": "export type TabSizeType =\n | 'sm'\n | 'md'",
|
|
651
|
+
"docstring": "",
|
|
652
|
+
"path": "src/type/button.ts"
|
|
653
|
+
},
|
|
634
654
|
"src/components/mds-pref-animation/meta/types.ts::AnimationModeType": {
|
|
635
655
|
"declaration": "export type AnimationModeType =\n | 'reduce'\n | 'no-preference'\n | 'system'",
|
|
636
656
|
"docstring": "",
|
|
@@ -711,6 +731,11 @@
|
|
|
711
731
|
"docstring": "",
|
|
712
732
|
"path": "src/components/mds-radial-menu/meta/types.ts"
|
|
713
733
|
},
|
|
734
|
+
"src/components.d.ts::ModalOverflowType": {
|
|
735
|
+
"declaration": "any",
|
|
736
|
+
"docstring": "",
|
|
737
|
+
"path": "src/components.d.ts"
|
|
738
|
+
},
|
|
714
739
|
"src/components/mds-stepper-bar/meta/event-detail.ts::MdsStepperBarEventDetail": {
|
|
715
740
|
"declaration": "export interface MdsStepperBarEventDetail {\n step: number\n value: string\n}",
|
|
716
741
|
"docstring": "",
|
|
@@ -721,6 +746,11 @@
|
|
|
721
746
|
"docstring": "",
|
|
722
747
|
"path": "src/components/mds-stepper-bar-item/meta/event-detail.ts"
|
|
723
748
|
},
|
|
749
|
+
"src/components/mds-tab/meta/type.ts::DirectionType": {
|
|
750
|
+
"declaration": "export type DirectionType =\n | 'horizontal'\n | 'vertical'",
|
|
751
|
+
"docstring": "",
|
|
752
|
+
"path": "src/components/mds-tab/meta/type.ts"
|
|
753
|
+
},
|
|
724
754
|
"src/type/animation.ts::HorizontalActionsAnimationType": {
|
|
725
755
|
"declaration": "export type HorizontalActionsAnimationType =\n | 'fade'\n | 'slide'",
|
|
726
756
|
"docstring": "",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@maggioli-design-system/mds-input-range",
|
|
3
|
-
"version": "2.5.
|
|
3
|
+
"version": "2.5.3",
|
|
4
4
|
"description": "mds-input-range is a web-component from Magma Design System, built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScript framework you are using.",
|
|
5
5
|
"main": "dist/index.cjs.js",
|
|
6
6
|
"module": "dist/index.js",
|
|
@@ -24,8 +24,8 @@
|
|
|
24
24
|
"test": "stencil test --spec --e2e"
|
|
25
25
|
},
|
|
26
26
|
"dependencies": {
|
|
27
|
-
"@maggioli-design-system/styles": "15.
|
|
28
|
-
"@maggioli-design-system/mds-text": "4.7.
|
|
27
|
+
"@maggioli-design-system/styles": "15.11.0",
|
|
28
|
+
"@maggioli-design-system/mds-text": "4.7.5",
|
|
29
29
|
"@stencil/core": "4.27.2"
|
|
30
30
|
},
|
|
31
31
|
"license": "MIT",
|
package/src/common/locale.ts
CHANGED
|
@@ -41,15 +41,17 @@ export class Locale {
|
|
|
41
41
|
|
|
42
42
|
update = (doc?: Document | ShadowRoot): void => {
|
|
43
43
|
const context = doc ?? this.element.shadowRoot
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
44
|
+
if (context) {
|
|
45
|
+
context.querySelectorAll('*').forEach(el => {
|
|
46
|
+
if (el.tagName.toLowerCase().startsWith('mds-')) {
|
|
47
|
+
// eslint-disable-next-line no-restricted-syntax
|
|
48
|
+
if (el && 'updateLang' in el) {
|
|
49
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
50
|
+
(el as any).updateLang()
|
|
51
|
+
}
|
|
50
52
|
}
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
+
})
|
|
54
|
+
}
|
|
53
55
|
}
|
|
54
56
|
|
|
55
57
|
private pluralize = (tag: string | string[], context: Record<string, string | number | boolean>): string => {
|
package/src/common/slot.ts
CHANGED
|
@@ -28,8 +28,20 @@ const hasSlotted = (el: HTMLElement, name?: string): boolean => {
|
|
|
28
28
|
return false
|
|
29
29
|
}
|
|
30
30
|
|
|
31
|
+
const hasSlottedContent = (el: HTMLElement, name?: string): boolean => {
|
|
32
|
+
const query = name ? `slot[name="${name}"]` : 'slot:not([name])'
|
|
33
|
+
const slot: HTMLSlotElement = el.shadowRoot?.querySelector(query) as HTMLSlotElement
|
|
34
|
+
if (!slot) return false
|
|
35
|
+
|
|
36
|
+
const assignedNodes = slot.assignedNodes({ flatten: true })
|
|
37
|
+
return assignedNodes.some(node =>
|
|
38
|
+
node.nodeType === Node.TEXT_NODE && node.textContent?.trim() !== '',
|
|
39
|
+
)
|
|
40
|
+
}
|
|
41
|
+
|
|
31
42
|
export {
|
|
32
43
|
hasSlottedElements,
|
|
33
44
|
hasSlottedNodes,
|
|
45
|
+
hasSlottedContent,
|
|
34
46
|
hasSlotted,
|
|
35
47
|
}
|
package/src/common/unit.ts
CHANGED
|
@@ -11,6 +11,19 @@ const cssDurationToMilliseconds = (duration: string, defaultValue = 1000): numbe
|
|
|
11
11
|
return defaultValue
|
|
12
12
|
}
|
|
13
13
|
|
|
14
|
+
const cssDurationToSeconds = (duration: string, defaultValue = 1000): number => {
|
|
15
|
+
|
|
16
|
+
if (duration.includes('ms')) {
|
|
17
|
+
return Number(duration.replace('ms', '')) / 1000
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
if (duration.includes('s')) {
|
|
21
|
+
return Number(duration.replace('s', ''))
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
return defaultValue
|
|
25
|
+
}
|
|
26
|
+
|
|
14
27
|
const cssSizeToNumber = (size: string, defaultValue = 0): number => {
|
|
15
28
|
if (size.includes('px')) {
|
|
16
29
|
return Number(size.replace('px', ''))
|
|
@@ -27,7 +40,17 @@ const cssSizeToNumber = (size: string, defaultValue = 0): number => {
|
|
|
27
40
|
return defaultValue
|
|
28
41
|
}
|
|
29
42
|
|
|
43
|
+
const cssRotationToNumber = (size: string, defaultValue = 0): number => {
|
|
44
|
+
if (size.includes('deg')) {
|
|
45
|
+
return Number(size.replace('deg', ''))
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
return defaultValue
|
|
49
|
+
}
|
|
50
|
+
|
|
30
51
|
export {
|
|
31
52
|
cssDurationToMilliseconds,
|
|
53
|
+
cssDurationToSeconds,
|
|
54
|
+
cssRotationToNumber,
|
|
32
55
|
cssSizeToNumber,
|
|
33
56
|
}
|