@maggioli-design-system/mds-input-select 3.3.0 → 3.4.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.
- package/dist/collection/common/browser.js +7 -0
- package/dist/collection/common/floating-controller.js +18 -0
- package/dist/collection/common/keyboard-manager.js +3 -2
- package/dist/collection/type/input-tip.js +1 -0
- package/dist/documentation.json +1 -1
- package/dist/stats.json +7 -3
- package/dist/types/common/browser.d.ts +2 -0
- package/dist/types/common/floating-controller.d.ts +1 -0
- package/dist/types/common/locale.d.ts +1 -1
- package/dist/types/type/input-tip.d.ts +1 -0
- package/documentation.json +4 -4
- package/package.json +2 -2
- package/src/common/browser.ts +10 -0
- package/src/common/floating-controller.ts +20 -0
- package/src/common/keyboard-manager.ts +1 -0
- package/src/common/locale.ts +2 -2
- package/src/fixtures/icons.json +2 -0
- package/src/fixtures/iconsauce.json +1 -0
- package/src/type/input-tip.ts +11 -0
|
@@ -65,6 +65,23 @@ export class FloatingController {
|
|
|
65
65
|
return { transformOrigin: 'center top' };
|
|
66
66
|
}
|
|
67
67
|
};
|
|
68
|
+
this.convertToTransformOrigin = (position) => {
|
|
69
|
+
const positions = {
|
|
70
|
+
top: 'center bottom',
|
|
71
|
+
right: 'left center',
|
|
72
|
+
bottom: 'center top',
|
|
73
|
+
left: 'right center',
|
|
74
|
+
'bottom-end': 'top right',
|
|
75
|
+
'bottom-start': 'top left',
|
|
76
|
+
'left-end': 'right bottom',
|
|
77
|
+
'left-start': 'right top',
|
|
78
|
+
'right-end': 'left bottom',
|
|
79
|
+
'right-start': 'left top',
|
|
80
|
+
'top-end': 'bottom right',
|
|
81
|
+
'top-start': 'bottom left',
|
|
82
|
+
};
|
|
83
|
+
return positions[position];
|
|
84
|
+
};
|
|
68
85
|
this.calculatePosition = () => {
|
|
69
86
|
if (!this._caller)
|
|
70
87
|
return;
|
|
@@ -99,6 +116,7 @@ export class FloatingController {
|
|
|
99
116
|
Object.assign(this._host.style, {
|
|
100
117
|
left: `${x}px`,
|
|
101
118
|
top: `${y}px`,
|
|
119
|
+
transformOrigin: this.convertToTransformOrigin(placement),
|
|
102
120
|
});
|
|
103
121
|
const arrowStyle = {};
|
|
104
122
|
const arrowPosition = {
|
|
@@ -22,8 +22,9 @@ export class KeyboardManager {
|
|
|
22
22
|
this.elements.delete(name);
|
|
23
23
|
};
|
|
24
24
|
this.attachClickBehavior = (name = 'element') => {
|
|
25
|
-
var _a;
|
|
26
|
-
(_a = this.elements.get(name)) === null || _a === void 0 ? void 0 : _a.
|
|
25
|
+
var _a, _b;
|
|
26
|
+
(_a = this.elements.get(name)) === null || _a === void 0 ? void 0 : _a.removeEventListener('keydown', this.handleClickBehaviorDispatchEvent);
|
|
27
|
+
(_b = this.elements.get(name)) === null || _b === void 0 ? void 0 : _b.addEventListener('keydown', this.handleClickBehaviorDispatchEvent);
|
|
27
28
|
};
|
|
28
29
|
this.detachClickBehavior = (name = 'element') => {
|
|
29
30
|
var _a;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/dist/documentation.json
CHANGED
package/dist/stats.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"timestamp": "2025-03-
|
|
2
|
+
"timestamp": "2025-03-17T17:38:14",
|
|
3
3
|
"compiler": {
|
|
4
4
|
"name": "node",
|
|
5
5
|
"version": "22.11.0"
|
|
@@ -9,13 +9,14 @@
|
|
|
9
9
|
"fsNamespace": "mds-input-select",
|
|
10
10
|
"components": 1,
|
|
11
11
|
"entries": 1,
|
|
12
|
-
"bundles":
|
|
12
|
+
"bundles": 103,
|
|
13
13
|
"outputs": [
|
|
14
14
|
{
|
|
15
15
|
"name": "dist-collection",
|
|
16
|
-
"files":
|
|
16
|
+
"files": 55,
|
|
17
17
|
"generatedFiles": [
|
|
18
18
|
"./dist/collection/common/aria.js",
|
|
19
|
+
"./dist/collection/common/browser.js",
|
|
19
20
|
"./dist/collection/common/date.js",
|
|
20
21
|
"./dist/collection/common/device.js",
|
|
21
22
|
"./dist/collection/common/file.js",
|
|
@@ -59,6 +60,7 @@
|
|
|
59
60
|
"./dist/collection/type/floating-ui.js",
|
|
60
61
|
"./dist/collection/type/form-rel.js",
|
|
61
62
|
"./dist/collection/type/header-bar.js",
|
|
63
|
+
"./dist/collection/type/input-tip.js",
|
|
62
64
|
"./dist/collection/type/input.js",
|
|
63
65
|
"./dist/collection/type/keyboard.js",
|
|
64
66
|
"./dist/collection/type/loading.js",
|
|
@@ -924,6 +926,7 @@
|
|
|
924
926
|
},
|
|
925
927
|
"sourceGraph": {
|
|
926
928
|
"./src/common/aria.ts": [],
|
|
929
|
+
"./src/common/browser.ts": [],
|
|
927
930
|
"./src/common/date.ts": [],
|
|
928
931
|
"./src/common/device.ts": [],
|
|
929
932
|
"./src/common/file.ts": [],
|
|
@@ -982,6 +985,7 @@
|
|
|
982
985
|
"./src/type/floating-ui.ts": [],
|
|
983
986
|
"./src/type/form-rel.ts": [],
|
|
984
987
|
"./src/type/header-bar.ts": [],
|
|
988
|
+
"./src/type/input-tip.ts": [],
|
|
985
989
|
"./src/type/input.ts": [],
|
|
986
990
|
"./src/type/keyboard.ts": [],
|
|
987
991
|
"./src/type/loading.ts": [],
|
|
@@ -27,6 +27,7 @@ export declare class FloatingController {
|
|
|
27
27
|
private readonly arrowInset;
|
|
28
28
|
private readonly arrowTransform;
|
|
29
29
|
private readonly arrowTransformOrigin;
|
|
30
|
+
private convertToTransformOrigin;
|
|
30
31
|
private readonly calculatePosition;
|
|
31
32
|
updatePosition(): void;
|
|
32
33
|
dismiss(): void;
|
|
@@ -15,6 +15,6 @@ export declare class Locale {
|
|
|
15
15
|
lang: (el: HTMLElement) => string;
|
|
16
16
|
update: (doc?: Document | ShadowRoot) => void;
|
|
17
17
|
private pluralize;
|
|
18
|
-
get: (tag: string | string[], context?: Record<string, string | number>) => string;
|
|
18
|
+
get: (tag: string | string[], context?: Record<string, string | number | boolean>) => string;
|
|
19
19
|
}
|
|
20
20
|
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type InputTipItemVariantType = 'count-almost' | 'count-almost-full' | 'count-empty' | 'count-full' | 'count-incomplete' | 'disabled' | 'readonly' | 'required' | 'required-success' | 'text';
|
package/documentation.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"timestamp": "2025-03-
|
|
2
|
+
"timestamp": "2025-03-17T17:10:07",
|
|
3
3
|
"compiler": {
|
|
4
4
|
"name": "@stencil/core",
|
|
5
5
|
"version": "4.27.2",
|
|
@@ -661,10 +661,10 @@
|
|
|
661
661
|
"docstring": "",
|
|
662
662
|
"path": "src/components/mds-input-tip/meta/types.ts"
|
|
663
663
|
},
|
|
664
|
-
"src/
|
|
665
|
-
"declaration": "export type InputTipItemVariantType =\n | '
|
|
664
|
+
"src/type/input-tip.ts::InputTipItemVariantType": {
|
|
665
|
+
"declaration": "export type InputTipItemVariantType =\n | 'count-almost'\n | 'count-almost-full'\n | 'count-empty'\n | 'count-full'\n | 'count-incomplete'\n | 'disabled'\n | 'readonly'\n | 'required'\n | 'required-success'\n | 'text'",
|
|
666
666
|
"docstring": "",
|
|
667
|
-
"path": "src/
|
|
667
|
+
"path": "src/type/input-tip.ts"
|
|
668
668
|
},
|
|
669
669
|
"src/components/mds-input-upload/meta/types.ts::AttachmentSort": {
|
|
670
670
|
"declaration": "type AttachmentSort =\n 'status' |\n 'date'",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@maggioli-design-system/mds-input-select",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.4.0",
|
|
4
4
|
"description": "mds-input-select 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",
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
},
|
|
26
26
|
"dependencies": {
|
|
27
27
|
"@maggioli-design-system/styles": "15.9.0",
|
|
28
|
-
"@maggioli-design-system/mds-input-tip": "1.
|
|
28
|
+
"@maggioli-design-system/mds-input-tip": "1.5.0",
|
|
29
29
|
"@stencil/core": "4.27.2",
|
|
30
30
|
"clsx": "2.1.0"
|
|
31
31
|
},
|
|
@@ -7,6 +7,7 @@ import {
|
|
|
7
7
|
Middleware,
|
|
8
8
|
MiddlewareData,
|
|
9
9
|
offset,
|
|
10
|
+
Placement,
|
|
10
11
|
shift,
|
|
11
12
|
} from '@floating-ui/dom'
|
|
12
13
|
import { FloatingUIPlacement, FloatingUIStrategy } from '@type/floating-ui'
|
|
@@ -138,6 +139,24 @@ export class FloatingController {
|
|
|
138
139
|
}
|
|
139
140
|
}
|
|
140
141
|
|
|
142
|
+
private convertToTransformOrigin = (position: Placement): string => {
|
|
143
|
+
const positions = {
|
|
144
|
+
top: 'center bottom',
|
|
145
|
+
right: 'left center',
|
|
146
|
+
bottom: 'center top',
|
|
147
|
+
left: 'right center',
|
|
148
|
+
'bottom-end': 'top right',
|
|
149
|
+
'bottom-start': 'top left',
|
|
150
|
+
'left-end': 'right bottom',
|
|
151
|
+
'left-start': 'right top',
|
|
152
|
+
'right-end': 'left bottom',
|
|
153
|
+
'right-start': 'left top',
|
|
154
|
+
'top-end': 'bottom right',
|
|
155
|
+
'top-start': 'bottom left',
|
|
156
|
+
}
|
|
157
|
+
return positions[position]
|
|
158
|
+
}
|
|
159
|
+
|
|
141
160
|
private readonly calculatePosition = (): void => {
|
|
142
161
|
if (!this._caller) return
|
|
143
162
|
|
|
@@ -181,6 +200,7 @@ export class FloatingController {
|
|
|
181
200
|
Object.assign(this._host.style, {
|
|
182
201
|
left: `${x}px`,
|
|
183
202
|
top: `${y}px`,
|
|
203
|
+
transformOrigin: this.convertToTransformOrigin(placement),
|
|
184
204
|
})
|
|
185
205
|
|
|
186
206
|
const arrowStyle = {}
|
|
@@ -27,6 +27,7 @@ export class KeyboardManager {
|
|
|
27
27
|
}
|
|
28
28
|
|
|
29
29
|
attachClickBehavior = (name = 'element'): void => {
|
|
30
|
+
this.elements.get(name)?.removeEventListener('keydown', this.handleClickBehaviorDispatchEvent)
|
|
30
31
|
this.elements.get(name)?.addEventListener('keydown', this.handleClickBehaviorDispatchEvent)
|
|
31
32
|
}
|
|
32
33
|
|
package/src/common/locale.ts
CHANGED
|
@@ -52,7 +52,7 @@ export class Locale {
|
|
|
52
52
|
})
|
|
53
53
|
}
|
|
54
54
|
|
|
55
|
-
private pluralize = (tag: string | string[], context: Record<string, string | number>): string => {
|
|
55
|
+
private pluralize = (tag: string | string[], context: Record<string, string | number | boolean>): string => {
|
|
56
56
|
|
|
57
57
|
const languagePhrase: string | string[] = this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag]
|
|
58
58
|
const phrases: string[] = []
|
|
@@ -81,7 +81,7 @@ export class Locale {
|
|
|
81
81
|
return render(translatePhrase, context)
|
|
82
82
|
}
|
|
83
83
|
|
|
84
|
-
get = (tag: string | string[], context?: Record<string, string | number>): string => {
|
|
84
|
+
get = (tag: string | string[], context?: Record<string, string | number | boolean>): string => {
|
|
85
85
|
if (context) {
|
|
86
86
|
return this.pluralize(tag, context)
|
|
87
87
|
}
|
package/src/fixtures/icons.json
CHANGED
|
@@ -52,6 +52,7 @@
|
|
|
52
52
|
"mgg/ai-status-suspended",
|
|
53
53
|
"mgg/alerts-pagopa",
|
|
54
54
|
"mgg/anagrafe-nazionale",
|
|
55
|
+
"mgg/anist",
|
|
55
56
|
"mgg/anpr",
|
|
56
57
|
"mgg/ansc",
|
|
57
58
|
"mgg/area-edificabile",
|
|
@@ -361,6 +362,7 @@
|
|
|
361
362
|
"mi/baseline/eco",
|
|
362
363
|
"mi/baseline/email",
|
|
363
364
|
"mi/baseline/error",
|
|
365
|
+
"mi/baseline/expand-more",
|
|
364
366
|
"mi/baseline/explore",
|
|
365
367
|
"mi/baseline/favorite",
|
|
366
368
|
"mi/baseline/favorite-border",
|