@moda/om 16.2.1 → 16.3.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/CHANGELOG.md +7 -0
- package/dist/index.cjs.js +34 -20
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +34 -20
- package/dist/index.esm.js.map +1 -1
- package/dist/src/components/Select/Select.d.ts +1 -0
- package/dist/src/components/Select/SelectOption.d.ts +1 -0
- package/dist/src/components/Select/SelectOptions.d.ts +1 -0
- package/package.json +1 -1
- package/src/components/Select/Select.tsx +4 -0
- package/src/components/Select/SelectOption.tsx +4 -1
- package/src/components/Select/SelectOptions.tsx +3 -0
package/dist/index.esm.js
CHANGED
|
@@ -973,20 +973,20 @@ var typography_1 = typography;
|
|
|
973
973
|
|
|
974
974
|
var text = function text(name, font) {
|
|
975
975
|
if (font === void 0) {
|
|
976
|
-
font =
|
|
976
|
+
font = 'sans';
|
|
977
977
|
}
|
|
978
978
|
|
|
979
|
-
var treatment = typography_1.typography[
|
|
979
|
+
var treatment = typography_1.typography['text-treatments'][name];
|
|
980
980
|
return __assign$b(__assign$b({}, treatment), {
|
|
981
|
-
|
|
982
|
-
|
|
981
|
+
'font-family': typography_1.typography.fonts[font].join(','),
|
|
982
|
+
'line-height': "".concat(treatment['line-height'])
|
|
983
983
|
});
|
|
984
984
|
};
|
|
985
985
|
|
|
986
986
|
helpers.text = text;
|
|
987
987
|
|
|
988
988
|
var remToUnitlessPx = function remToUnitlessPx(value) {
|
|
989
|
-
return parseFloat(value) * parseInt(typography_1.typography[
|
|
989
|
+
return parseFloat(value) * parseInt(typography_1.typography['root-font-size'], 10);
|
|
990
990
|
};
|
|
991
991
|
|
|
992
992
|
helpers.remToUnitlessPx = remToUnitlessPx;
|
|
@@ -995,18 +995,19 @@ var color = function color(name, alpha) {
|
|
|
995
995
|
var _a;
|
|
996
996
|
|
|
997
997
|
var color = colors_1.colors.all[name];
|
|
998
|
-
return alpha != null ?
|
|
998
|
+
return alpha != null ? // eslint-disable-next-line @typescript-eslint/no-magic-numbers
|
|
999
|
+
colorString.to.rgb(__spreadArray$1(__spreadArray$1([], ((_a = colorString.get.rgb(color)) === null || _a === void 0 ? void 0 : _a.slice(0, 3)) || [], true), [alpha], false)) : color;
|
|
999
1000
|
};
|
|
1000
1001
|
|
|
1001
1002
|
helpers.color = color;
|
|
1002
1003
|
|
|
1003
|
-
var spacing = function spacing(
|
|
1004
|
-
return [
|
|
1004
|
+
var spacing = function spacing(topY, rightX, bottom, left) {
|
|
1005
|
+
return [topY, rightX, bottom, left].reduce(function (acc, value) {
|
|
1005
1006
|
var _a;
|
|
1006
1007
|
|
|
1007
|
-
if (
|
|
1008
|
-
return [acc, (_a = space_1.space.scale[
|
|
1009
|
-
},
|
|
1008
|
+
if (value === undefined) return acc;
|
|
1009
|
+
return [acc, (_a = space_1.space.scale[value]) !== null && _a !== void 0 ? _a : value].join(' ');
|
|
1010
|
+
}, '');
|
|
1010
1011
|
};
|
|
1011
1012
|
|
|
1012
1013
|
helpers.spacing = spacing;
|
|
@@ -1015,12 +1016,18 @@ helpers.spacing = spacing;
|
|
|
1015
1016
|
|
|
1016
1017
|
var __createBinding = commonjsGlobal && commonjsGlobal.__createBinding || (Object.create ? function (o, m, k, k2) {
|
|
1017
1018
|
if (k2 === undefined) k2 = k;
|
|
1018
|
-
Object.
|
|
1019
|
-
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1019
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
1020
|
+
|
|
1021
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
1022
|
+
desc = {
|
|
1023
|
+
enumerable: true,
|
|
1024
|
+
get: function get() {
|
|
1025
|
+
return m[k];
|
|
1026
|
+
}
|
|
1027
|
+
};
|
|
1028
|
+
}
|
|
1029
|
+
|
|
1030
|
+
Object.defineProperty(o, k2, desc);
|
|
1024
1031
|
} : function (o, m, k, k2) {
|
|
1025
1032
|
if (k2 === undefined) k2 = k;
|
|
1026
1033
|
o[k2] = m[k];
|
|
@@ -9186,7 +9193,8 @@ var SelectOption = function SelectOption(_ref) {
|
|
|
9186
9193
|
selected = _ref.selected,
|
|
9187
9194
|
option = _ref.option,
|
|
9188
9195
|
onClick = _ref.onClick,
|
|
9189
|
-
className = _ref.className
|
|
9196
|
+
className = _ref.className,
|
|
9197
|
+
dataTestId = _ref.dataTestId;
|
|
9190
9198
|
var ref = useRef(null);
|
|
9191
9199
|
var handleClick = useCallback(function (event) {
|
|
9192
9200
|
event.preventDefault();
|
|
@@ -9208,13 +9216,14 @@ var SelectOption = function SelectOption(_ref) {
|
|
|
9208
9216
|
'SelectOption--disabled': option.disabled
|
|
9209
9217
|
}),
|
|
9210
9218
|
onClick: handleClick,
|
|
9219
|
+
"data-test-id": dataTestId ? "".concat(dataTestId, "--").concat(option.label.replace(' ', '-')) : undefined,
|
|
9211
9220
|
"aria-label": option.label,
|
|
9212
9221
|
"aria-selected": selected,
|
|
9213
9222
|
role: "option"
|
|
9214
9223
|
}, option.label);
|
|
9215
9224
|
};
|
|
9216
9225
|
|
|
9217
|
-
var _excluded$m = ["idRef", "searchable", "autoFocus", "options", "selectedOption", "onSelect", "onFocus", "className"];
|
|
9226
|
+
var _excluded$m = ["idRef", "searchable", "autoFocus", "options", "selectedOption", "onSelect", "onFocus", "className", "dataTestId"];
|
|
9218
9227
|
var SelectOptions = function SelectOptions(_ref) {
|
|
9219
9228
|
var idRef = _ref.idRef,
|
|
9220
9229
|
searchable = _ref.searchable,
|
|
@@ -9225,6 +9234,7 @@ var SelectOptions = function SelectOptions(_ref) {
|
|
|
9225
9234
|
onSelect = _ref.onSelect,
|
|
9226
9235
|
onFocus = _ref.onFocus,
|
|
9227
9236
|
className = _ref.className,
|
|
9237
|
+
dataTestId = _ref.dataTestId,
|
|
9228
9238
|
rest = _objectWithoutProperties(_ref, _excluded$m);
|
|
9229
9239
|
|
|
9230
9240
|
var _useState = useState(''),
|
|
@@ -9282,6 +9292,7 @@ var SelectOptions = function SelectOptions(_ref) {
|
|
|
9282
9292
|
id: "SelectOption--".concat(option.value, "-").concat(idRef),
|
|
9283
9293
|
key: option.value,
|
|
9284
9294
|
option: option,
|
|
9295
|
+
dataTestId: dataTestId,
|
|
9285
9296
|
active: (activeOption === null || activeOption === void 0 ? void 0 : activeOption.value) === option.value,
|
|
9286
9297
|
selected: (selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value) === option.value,
|
|
9287
9298
|
onClick: onSelect
|
|
@@ -9403,7 +9414,7 @@ var useSelect = function useSelect(_ref) {
|
|
|
9403
9414
|
};
|
|
9404
9415
|
};
|
|
9405
9416
|
|
|
9406
|
-
var _excluded$l = ["allowAutoFill", "autoSelect", "className", "defaultValue", "disabled", "dropDirection", "error", "idRef", "label", "name", "onChange", "options", "placeholder", "searchable", "shiftIconLeftwards", "value"];
|
|
9417
|
+
var _excluded$l = ["allowAutoFill", "autoSelect", "className", "defaultValue", "disabled", "dropDirection", "error", "idRef", "label", "name", "onChange", "options", "placeholder", "searchable", "shiftIconLeftwards", "value", "dataTestId"];
|
|
9407
9418
|
var Select = function Select(_ref) {
|
|
9408
9419
|
var _ref2;
|
|
9409
9420
|
|
|
@@ -9429,6 +9440,7 @@ var Select = function Select(_ref) {
|
|
|
9429
9440
|
_ref$shiftIconLeftwar = _ref.shiftIconLeftwards,
|
|
9430
9441
|
shiftIconLeftwards = _ref$shiftIconLeftwar === void 0 ? false : _ref$shiftIconLeftwar,
|
|
9431
9442
|
value = _ref.value,
|
|
9443
|
+
dataTestId = _ref.dataTestId,
|
|
9432
9444
|
rest = _objectWithoutProperties(_ref, _excluded$l);
|
|
9433
9445
|
|
|
9434
9446
|
var _useSelect = useSelect({
|
|
@@ -9497,6 +9509,7 @@ var Select = function Select(_ref) {
|
|
|
9497
9509
|
className: "Select__value",
|
|
9498
9510
|
disabled: disabled,
|
|
9499
9511
|
onClick: handleToggle,
|
|
9512
|
+
"data-test-id": dataTestId,
|
|
9500
9513
|
"aria-haspopup": "listbox",
|
|
9501
9514
|
"aria-expanded": state.mode === Mode.Open,
|
|
9502
9515
|
"aria-labelledby": "Select__label--".concat(idRef, " Select__value--").concat(idRef),
|
|
@@ -9516,6 +9529,7 @@ var Select = function Select(_ref) {
|
|
|
9516
9529
|
'Select__options--up': dropDirection === 'up',
|
|
9517
9530
|
'Select__options--down': dropDirection === 'down'
|
|
9518
9531
|
}),
|
|
9532
|
+
dataTestId: dataTestId,
|
|
9519
9533
|
searchable: searchable,
|
|
9520
9534
|
options: options,
|
|
9521
9535
|
onSelect: handleSelect,
|