@connectif/ui-components 9.0.0 → 9.0.2
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/CHANGELOG.md +18 -0
- package/dist/components/icon/icons.d.ts +5 -0
- package/dist/components/input/Select.d.ts +11 -0
- package/dist/index.js +19 -10
- package/dist/tsconfig.build.tsbuildinfo +1 -1
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,23 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [9.0.2] - 2026-05-29
|
|
4
|
+
|
|
5
|
+
### Added
|
|
6
|
+
|
|
7
|
+
- Added `calendar-star-outline`, `play-speed`, `timer-play-outline`, `timer-stop-outline` icons.
|
|
8
|
+
|
|
9
|
+
## [9.0.1] - 2026-05-28
|
|
10
|
+
|
|
11
|
+
### Added
|
|
12
|
+
|
|
13
|
+
- Added `minMenuWidth` prop to `Select` component to set a minimum width for the dropdown menu.
|
|
14
|
+
- Added `maxMenuWidth` prop to `Select` component to cap the dropdown menu's natural width.
|
|
15
|
+
- Added `view-week-outline` icon.
|
|
16
|
+
|
|
17
|
+
### Changed
|
|
18
|
+
|
|
19
|
+
- `Select` dropdown menu no longer matches the trigger element's width. The menu now sizes to its content, constrained by `minMenuWidth` and `maxMenuWidth`
|
|
20
|
+
|
|
3
21
|
## [9.0.0] - 2026-05-21
|
|
4
22
|
|
|
5
23
|
### Added
|
|
@@ -312,6 +312,7 @@ export declare const icons: {
|
|
|
312
312
|
'calendar-range': string;
|
|
313
313
|
'calendar-remove': string;
|
|
314
314
|
'calendar-search-outline': string;
|
|
315
|
+
'calendar-star-outline': string;
|
|
315
316
|
'calendar-text': string;
|
|
316
317
|
'calendar-today': string;
|
|
317
318
|
'call-made': string;
|
|
@@ -1381,6 +1382,7 @@ export declare const icons: {
|
|
|
1381
1382
|
'playlist-play': string;
|
|
1382
1383
|
'playlist-plus': string;
|
|
1383
1384
|
'playlist-remove': string;
|
|
1385
|
+
'play-speed': string;
|
|
1384
1386
|
playstation: string;
|
|
1385
1387
|
plex: string;
|
|
1386
1388
|
plus: string;
|
|
@@ -1752,8 +1754,10 @@ export declare const icons: {
|
|
|
1752
1754
|
'timer-cancel': string;
|
|
1753
1755
|
'timer-off': string;
|
|
1754
1756
|
'timer-outline': string;
|
|
1757
|
+
'timer-play-outline': string;
|
|
1755
1758
|
'timer-sand': string;
|
|
1756
1759
|
'timer-sand-empty': string;
|
|
1760
|
+
'timer-stop-outline': string;
|
|
1757
1761
|
timetable: string;
|
|
1758
1762
|
'toggle-switch': string;
|
|
1759
1763
|
'toggle-switch-off': string;
|
|
@@ -1860,6 +1864,7 @@ export declare const icons: {
|
|
|
1860
1864
|
'view-sequential': string;
|
|
1861
1865
|
'view-stream': string;
|
|
1862
1866
|
'view-week': string;
|
|
1867
|
+
'view-week-outline': string;
|
|
1863
1868
|
vimeo: string;
|
|
1864
1869
|
vine: string;
|
|
1865
1870
|
violin: string;
|
|
@@ -75,6 +75,17 @@ export type SelectProps<T extends string | number | undefined, Multiple extends
|
|
|
75
75
|
* The max height of the menu when open
|
|
76
76
|
*/
|
|
77
77
|
menuMaxHeight?: string;
|
|
78
|
+
/**
|
|
79
|
+
* The minimum width (in px) of the dropdown menu.
|
|
80
|
+
* Defaults to 200.
|
|
81
|
+
*/
|
|
82
|
+
minMenuWidth?: number;
|
|
83
|
+
/**
|
|
84
|
+
* The maximum width (in px) of the dropdown menu. Defaults to 400.
|
|
85
|
+
* When `virtualized=true`, the menu width is fixed to `minMenuWidth` by default,
|
|
86
|
+
* but `maxMenuWidth` still acts as an upper cap if `virtualizedProps.width` exceeds it.
|
|
87
|
+
*/
|
|
88
|
+
maxMenuWidth?: number;
|
|
78
89
|
/**
|
|
79
90
|
* Ref to inner HTMLSelectElement
|
|
80
91
|
*/
|
package/dist/index.js
CHANGED
|
@@ -1200,6 +1200,7 @@ import {
|
|
|
1200
1200
|
mdiCalendarRange,
|
|
1201
1201
|
mdiCalendarRemove,
|
|
1202
1202
|
mdiCalendarSearchOutline,
|
|
1203
|
+
mdiCalendarStarOutline,
|
|
1203
1204
|
mdiCalendarText,
|
|
1204
1205
|
mdiCalendarToday,
|
|
1205
1206
|
mdiCallMade,
|
|
@@ -2137,6 +2138,7 @@ import {
|
|
|
2137
2138
|
mdiPlaylistPlay,
|
|
2138
2139
|
mdiPlaylistPlus,
|
|
2139
2140
|
mdiPlaylistRemove,
|
|
2141
|
+
mdiPlaySpeed,
|
|
2140
2142
|
mdiPlus,
|
|
2141
2143
|
mdiPlusBox,
|
|
2142
2144
|
mdiPlusBoxOutline,
|
|
@@ -2475,8 +2477,10 @@ import {
|
|
|
2475
2477
|
mdiTimerCancel,
|
|
2476
2478
|
mdiTimerOff,
|
|
2477
2479
|
mdiTimerOutline,
|
|
2480
|
+
mdiTimerPlayOutline,
|
|
2478
2481
|
mdiTimerSand,
|
|
2479
2482
|
mdiTimerSandEmpty,
|
|
2483
|
+
mdiTimerStopOutline,
|
|
2480
2484
|
mdiTimetable,
|
|
2481
2485
|
mdiToggleSwitch,
|
|
2482
2486
|
mdiToggleSwitchOff,
|
|
@@ -2638,7 +2642,8 @@ import {
|
|
|
2638
2642
|
mdiDatabaseExport,
|
|
2639
2643
|
mdiBrain,
|
|
2640
2644
|
mdiTools,
|
|
2641
|
-
mdiSitemapOutline
|
|
2645
|
+
mdiSitemapOutline,
|
|
2646
|
+
mdiViewWeekOutline
|
|
2642
2647
|
} from "@mdi/js";
|
|
2643
2648
|
var icons = {
|
|
2644
2649
|
"abx-testing": "M 18.00108644,11.0000004 L 18.00108644,8.00000044 L 22.00108644,12.0000004 L 18.00108644,16.0000004 L 18.00108644,13.0000004 L 13.57108644,13.0000004 C 13.1110864,12.2500004 12.5410864,11.5800004 11.8810864,11.0000004 L 18.00108644,11.0000004 Z M 12.0010864,22.0000004 L 16.00108644,18.0000004 L 13.0010864,18.0000004 C 13.1510864,14.3900004 10.4310864,11.3100004 6.8310864,11.0000004 C 6.2810864,9.44000044 4.5610864,8.62000044 3.0010864,9.17000044 C 1.4410864,9.72000044 0.6210864,11.4400004 1.1710864,13.0000004 C 1.7310864,14.5600004 3.4410864,15.3800004 5.0010864,14.8300004 C 5.8610864,14.5300004 6.5310864,13.8500004 6.8310864,13.0000004 C 10.8310864,13.4700004 11.0310864,17.4700004 11.0310864,17.9500004 L 8.0310864,17.9500004 L 12.0010864,22.0000004 Z M 11.4110864,10.6300004 C 12.4310864,9.30000044 13.0010864,7.67000044 13.0010864,6.00000044 L 16.00108644,6.00000044 L 12.0010864,2.00000044 L 8.0010864,6.00000044 L 11.0010864,6.00000044 C 10.9710864,7.34000044 10.5010864,8.63000044 9.6010864,9.64000044 C 10.2410864,9.89000044 10.8510864,10.22000044 11.4110864,10.6300004 Z",
|
|
@@ -2954,6 +2959,7 @@ var icons = {
|
|
|
2954
2959
|
"calendar-range": mdiCalendarRange,
|
|
2955
2960
|
"calendar-remove": mdiCalendarRemove,
|
|
2956
2961
|
"calendar-search-outline": mdiCalendarSearchOutline,
|
|
2962
|
+
"calendar-star-outline": mdiCalendarStarOutline,
|
|
2957
2963
|
"calendar-text": mdiCalendarText,
|
|
2958
2964
|
"calendar-today": mdiCalendarToday,
|
|
2959
2965
|
"call-made": mdiCallMade,
|
|
@@ -4046,6 +4052,7 @@ var icons = {
|
|
|
4046
4052
|
"playlist-play": mdiPlaylistPlay,
|
|
4047
4053
|
"playlist-plus": mdiPlaylistPlus,
|
|
4048
4054
|
"playlist-remove": mdiPlaylistRemove,
|
|
4055
|
+
"play-speed": mdiPlaySpeed,
|
|
4049
4056
|
playstation: "M9.5,4.27C10.88,4.53 12.9,5.14 14,5.5C16.75,6.45 17.69,7.63 17.69,10.29C17.69,12.89 16.09,13.87 14.05,12.89V8.05C14.05,7.5 13.95,6.97 13.41,6.82C13,6.69 12.76,7.07 12.76,7.63V19.73L9.5,18.69V4.27M13.37,17.62L18.62,15.75C19.22,15.54 19.31,15.24 18.83,15.08C18.34,14.92 17.47,14.97 16.87,15.18L13.37,16.41V14.45L13.58,14.38C13.58,14.38 14.59,14 16,13.87C17.43,13.71 19.17,13.89 20.53,14.4C22.07,14.89 22.25,15.61 21.86,16.1C21.46,16.6 20.5,16.95 20.5,16.95L13.37,19.5V17.62M3.5,17.42C1.93,17 1.66,16.05 2.38,15.5C3.05,15 4.18,14.65 4.18,14.65L8.86,13V14.88L5.5,16.09C4.9,16.3 4.81,16.6 5.29,16.76C5.77,16.92 6.65,16.88 7.24,16.66L8.86,16.08V17.77L8.54,17.83C6.92,18.09 5.2,18 3.5,17.42Z",
|
|
4050
4057
|
plex: "M4,2C2.89,2 2,2.89 2,4V20C2,21.11 2.89,22 4,22H20C21.11,22 22,21.11 22,20V4C22,2.89 21.11,2 20,2H4M8.56,6H12.06L15.5,12L12.06,18H8.56L12,12L8.56,6Z",
|
|
4051
4058
|
plus: mdiPlus,
|
|
@@ -4429,8 +4436,10 @@ var icons = {
|
|
|
4429
4436
|
"timer-cancel": mdiTimerCancel,
|
|
4430
4437
|
"timer-off": mdiTimerOff,
|
|
4431
4438
|
"timer-outline": mdiTimerOutline,
|
|
4439
|
+
"timer-play-outline": mdiTimerPlayOutline,
|
|
4432
4440
|
"timer-sand": mdiTimerSand,
|
|
4433
4441
|
"timer-sand-empty": mdiTimerSandEmpty,
|
|
4442
|
+
"timer-stop-outline": mdiTimerStopOutline,
|
|
4434
4443
|
timetable: mdiTimetable,
|
|
4435
4444
|
"toggle-switch": mdiToggleSwitch,
|
|
4436
4445
|
"toggle-switch-off": mdiToggleSwitchOff,
|
|
@@ -4542,6 +4551,7 @@ var icons = {
|
|
|
4542
4551
|
"view-sequential": mdiViewSequential,
|
|
4543
4552
|
"view-stream": mdiViewStream,
|
|
4544
4553
|
"view-week": mdiViewWeek,
|
|
4554
|
+
"view-week-outline": mdiViewWeekOutline,
|
|
4545
4555
|
vimeo: "M22,7.42C21.91,9.37 20.55,12.04 17.92,15.44C15.2,19 12.9,20.75 11,20.75C9.85,20.75 8.86,19.67 8.05,17.5C7.5,15.54 7,13.56 6.44,11.58C5.84,9.42 5.2,8.34 4.5,8.34C4.36,8.34 3.84,8.66 2.94,9.29L2,8.07C3,7.2 3.96,6.33 4.92,5.46C6.24,4.32 7.23,3.72 7.88,3.66C9.44,3.5 10.4,4.58 10.76,6.86C11.15,9.33 11.42,10.86 11.57,11.46C12,13.5 12.5,14.5 13.05,14.5C13.47,14.5 14.1,13.86 14.94,12.53C15.78,11.21 16.23,10.2 16.29,9.5C16.41,8.36 15.96,7.79 14.94,7.79C14.46,7.79 13.97,7.9 13.46,8.12C14.44,4.89 16.32,3.32 19.09,3.41C21.15,3.47 22.12,4.81 22,7.42Z",
|
|
4546
4556
|
vine: "M19.89,11.95C19.43,12.06 19,12.1 18.57,12.1C16.3,12.1 14.55,10.5 14.55,7.76C14.55,6.41 15.08,5.7 15.82,5.7C16.5,5.7 17,6.33 17,7.61C17,8.34 16.79,9.14 16.65,9.61C16.65,9.61 17.35,10.83 19.26,10.46C19.67,9.56 19.89,8.39 19.89,7.36C19.89,4.6 18.5,3 15.91,3C13.26,3 11.71,5.04 11.71,7.72C11.71,10.38 12.95,12.67 15,13.71C14.14,15.43 13.04,16.95 11.9,18.1C9.82,15.59 7.94,12.24 7.17,5.7H4.11C5.53,16.59 9.74,20.05 10.86,20.72C11.5,21.1 12.03,21.08 12.61,20.75C13.5,20.24 16.23,17.5 17.74,14.34C18.37,14.33 19.13,14.26 19.89,14.09V11.95Z",
|
|
4547
4557
|
violin: mdiViolin,
|
|
@@ -22051,6 +22061,8 @@ var Select = function Select2({
|
|
|
22051
22061
|
menuZIndex,
|
|
22052
22062
|
menuColors,
|
|
22053
22063
|
menuMaxHeight,
|
|
22064
|
+
minMenuWidth = 200,
|
|
22065
|
+
maxMenuWidth = 400,
|
|
22054
22066
|
"data-testid": dataTestId,
|
|
22055
22067
|
open,
|
|
22056
22068
|
onOpen,
|
|
@@ -22063,9 +22075,6 @@ var Select = function Select2({
|
|
|
22063
22075
|
const paperRef = React64.useRef(null);
|
|
22064
22076
|
const selectRef = React64.useRef(null);
|
|
22065
22077
|
const [measuredPaperHeight, setMeasuredPaperHeight] = React64.useState(void 0);
|
|
22066
|
-
const [selectWidth, setSelectWidth] = React64.useState(
|
|
22067
|
-
void 0
|
|
22068
|
-
);
|
|
22069
22078
|
const [highlightedIndex, setHighlightedIndex] = React64.useState(-1);
|
|
22070
22079
|
const currentValue = React64.useMemo(
|
|
22071
22080
|
() => value ?? (multiple ? [] : ""),
|
|
@@ -22121,7 +22130,7 @@ var Select = function Select2({
|
|
|
22121
22130
|
return () => document.removeEventListener("keydown", handleKeyDown);
|
|
22122
22131
|
}, [isOpen, virtualized, highlightedIndex, options, onChange, onClose]);
|
|
22123
22132
|
const defaultVirtualizedProps = {
|
|
22124
|
-
width:
|
|
22133
|
+
width: minMenuWidth,
|
|
22125
22134
|
overscanCount: 3,
|
|
22126
22135
|
itemSize: 44
|
|
22127
22136
|
};
|
|
@@ -22216,7 +22225,6 @@ var Select = function Select2({
|
|
|
22216
22225
|
IconComponent: () => /* @__PURE__ */ jsx120(ChevronIcon, { disabled: rest.disabled, isOpen }),
|
|
22217
22226
|
input: /* @__PURE__ */ jsx120(BootstrapInput, { ref: selectRef, placeholder }),
|
|
22218
22227
|
onOpen: () => {
|
|
22219
|
-
setSelectWidth(selectRef.current?.clientWidth);
|
|
22220
22228
|
setOpen(true);
|
|
22221
22229
|
onOpen && onOpen();
|
|
22222
22230
|
},
|
|
@@ -22254,7 +22262,8 @@ var Select = function Select2({
|
|
|
22254
22262
|
border: `1px solid ${menuColors.borderColor}`
|
|
22255
22263
|
},
|
|
22256
22264
|
maxHeight: menuMaxHeight,
|
|
22257
|
-
|
|
22265
|
+
minWidth: minMenuWidth,
|
|
22266
|
+
maxWidth: maxMenuWidth
|
|
22258
22267
|
},
|
|
22259
22268
|
className: paperClassName
|
|
22260
22269
|
},
|
|
@@ -22272,7 +22281,7 @@ var Select = function Select2({
|
|
|
22272
22281
|
style: {
|
|
22273
22282
|
maxHeight: measuredPaperHeight ? measuredPaperHeight - 16 : menuMaxHeight ? `calc(${menuMaxHeight} - 16px)` : "90vh",
|
|
22274
22283
|
height: options.length * itemSize,
|
|
22275
|
-
maxWidth:
|
|
22284
|
+
maxWidth: maxMenuWidth,
|
|
22276
22285
|
flex: "1 1 auto"
|
|
22277
22286
|
}
|
|
22278
22287
|
}
|
|
@@ -22340,7 +22349,6 @@ var Select = function Select2({
|
|
|
22340
22349
|
open,
|
|
22341
22350
|
input: /* @__PURE__ */ jsx120(BootstrapInput, { ref: selectRef, placeholder }),
|
|
22342
22351
|
onOpen: () => {
|
|
22343
|
-
setSelectWidth(selectRef.current?.clientWidth);
|
|
22344
22352
|
setOpen(true);
|
|
22345
22353
|
onOpen && onOpen();
|
|
22346
22354
|
},
|
|
@@ -22384,7 +22392,8 @@ var Select = function Select2({
|
|
|
22384
22392
|
border: `1px solid ${menuColors.borderColor}`
|
|
22385
22393
|
},
|
|
22386
22394
|
maxHeight: menuMaxHeight,
|
|
22387
|
-
|
|
22395
|
+
minWidth: minMenuWidth,
|
|
22396
|
+
maxWidth: maxMenuWidth
|
|
22388
22397
|
},
|
|
22389
22398
|
className: `${paperClassName} Slim-Vertical-Scroll`
|
|
22390
22399
|
}
|