@dbcdk/react-components 0.0.47 → 0.0.48
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.
|
@@ -166,7 +166,7 @@ export function FilterField({ field, control, operator, value, onChange, operato
|
|
|
166
166
|
scheduleEmitValue(next);
|
|
167
167
|
}, onBlur: () => {
|
|
168
168
|
flushPendingValue();
|
|
169
|
-
}, fullWidth: true, inputSize: size, placeholder: placeholder, disabled: disabled, autoComplete: (_b = inputProps.autoComplete) !== null && _b !== void 0 ? _b : 'off', autoCorrect: (_c = inputProps.autoCorrect) !== null && _c !== void 0 ? _c : 'off', autoCapitalize: (_d = inputProps.autoCapitalize) !== null && _d !== void 0 ? _d : '
|
|
169
|
+
}, fullWidth: true, inputSize: size, placeholder: placeholder, disabled: disabled, autoComplete: (_b = inputProps.autoComplete) !== null && _b !== void 0 ? _b : 'off', autoCorrect: (_c = inputProps.autoCorrect) !== null && _c !== void 0 ? _c : 'off', autoCapitalize: (_d = inputProps.autoCapitalize) !== null && _d !== void 0 ? _d : 'none', spellCheck: (_e = inputProps.spellCheck) !== null && _e !== void 0 ? _e : false, onClear: () => {
|
|
170
170
|
clearDebounce();
|
|
171
171
|
pendingValueRef.current = '';
|
|
172
172
|
setLocalValue('');
|
|
@@ -73,8 +73,8 @@
|
|
|
73
73
|
border-bottom-right-radius: 0;
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
-
.withClear .
|
|
77
|
-
padding-inline-end: calc(var(--spacing-
|
|
76
|
+
.withClear .input {
|
|
77
|
+
padding-inline-end: calc(var(--spacing-xs) + 16px + var(--spacing-xs));
|
|
78
78
|
}
|
|
79
79
|
|
|
80
80
|
/* Global focus reset - variants own visible focus treatment */
|
|
@@ -138,7 +138,6 @@
|
|
|
138
138
|
border-color: transparent;
|
|
139
139
|
border-radius: 0;
|
|
140
140
|
box-shadow: none;
|
|
141
|
-
padding-inline: var(--spacing-xs);
|
|
142
141
|
padding-block: 0;
|
|
143
142
|
block-size: 100%;
|
|
144
143
|
}
|
|
@@ -330,17 +329,17 @@
|
|
|
330
329
|
}
|
|
331
330
|
|
|
332
331
|
/* Leading icon */
|
|
333
|
-
.fieldWithIcon {
|
|
334
|
-
padding-inline-start: calc(var(--icon-size-md) + var(--spacing-
|
|
332
|
+
.fieldWithIcon .input {
|
|
333
|
+
padding-inline-start: calc(var(--spacing-sm) + var(--icon-size-md) + var(--spacing-xs));
|
|
335
334
|
}
|
|
336
335
|
|
|
337
|
-
.embedded.fieldWithIcon {
|
|
338
|
-
padding-inline-start: calc(var(--icon-size-md) + var(--spacing-
|
|
336
|
+
.embedded.fieldWithIcon .input {
|
|
337
|
+
padding-inline-start: calc(var(--spacing-xs) + var(--icon-size-md) + var(--spacing-xs));
|
|
339
338
|
}
|
|
340
339
|
|
|
341
340
|
.icon {
|
|
342
341
|
position: absolute;
|
|
343
|
-
inset-inline-start: var(--spacing-
|
|
342
|
+
inset-inline-start: var(--spacing-sm);
|
|
344
343
|
top: 50%;
|
|
345
344
|
transform: translateY(-50%);
|
|
346
345
|
display: inline-flex;
|
|
@@ -353,6 +352,10 @@
|
|
|
353
352
|
transition: color var(--transition-fast) var(--ease-standard);
|
|
354
353
|
}
|
|
355
354
|
|
|
355
|
+
.embedded .icon {
|
|
356
|
+
inset-inline-start: var(--spacing-xs);
|
|
357
|
+
}
|
|
358
|
+
|
|
356
359
|
.field:focus-within .icon {
|
|
357
360
|
color: var(--color-fg-muted);
|
|
358
361
|
}
|
|
@@ -308,7 +308,7 @@ export function Typeahead({ options, mode = 'single', multiValueDisplayMode = 'c
|
|
|
308
308
|
if (e.defaultPrevented)
|
|
309
309
|
return;
|
|
310
310
|
handleKeyDown(e);
|
|
311
|
-
}, placeholder: placeholder, variant: variant, inputSize: (_a = inputSize !== null && inputSize !== void 0 ? inputSize : inputProps === null || inputProps === void 0 ? void 0 : inputProps.inputSize) !== null && _a !== void 0 ? _a : 'md', width: width !== null && width !== void 0 ? width : inputProps === null || inputProps === void 0 ? void 0 : inputProps.width, autoComplete: (_b = autoComplete !== null && autoComplete !== void 0 ? autoComplete : inputProps === null || inputProps === void 0 ? void 0 : inputProps.autoComplete) !== null && _b !== void 0 ? _b : 'off', autoCorrect: (_c = autoCorrect !== null && autoCorrect !== void 0 ? autoCorrect : inputProps === null || inputProps === void 0 ? void 0 : inputProps.autoCorrect) !== null && _c !== void 0 ? _c : 'off', autoCapitalize: (_d = autoCapitalize !== null && autoCapitalize !== void 0 ? autoCapitalize : inputProps === null || inputProps === void 0 ? void 0 : inputProps.autoCapitalize) !== null && _d !== void 0 ? _d : '
|
|
311
|
+
}, placeholder: placeholder, variant: variant, inputSize: (_a = inputSize !== null && inputSize !== void 0 ? inputSize : inputProps === null || inputProps === void 0 ? void 0 : inputProps.inputSize) !== null && _a !== void 0 ? _a : 'md', width: width !== null && width !== void 0 ? width : inputProps === null || inputProps === void 0 ? void 0 : inputProps.width, autoComplete: (_b = autoComplete !== null && autoComplete !== void 0 ? autoComplete : inputProps === null || inputProps === void 0 ? void 0 : inputProps.autoComplete) !== null && _b !== void 0 ? _b : 'off', autoCorrect: (_c = autoCorrect !== null && autoCorrect !== void 0 ? autoCorrect : inputProps === null || inputProps === void 0 ? void 0 : inputProps.autoCorrect) !== null && _c !== void 0 ? _c : 'off', autoCapitalize: (_d = autoCapitalize !== null && autoCapitalize !== void 0 ? autoCapitalize : inputProps === null || inputProps === void 0 ? void 0 : inputProps.autoCapitalize) !== null && _d !== void 0 ? _d : 'none', spellCheck: (_e = spellCheck !== null && spellCheck !== void 0 ? spellCheck : inputProps === null || inputProps === void 0 ? void 0 : inputProps.spellCheck) !== null && _e !== void 0 ? _e : false, disabled: disabled, fullWidth: fullWidth, onClear: () => {
|
|
312
312
|
setInputValue('');
|
|
313
313
|
setQuery('');
|
|
314
314
|
setActiveIndex(-1);
|