@odx/websites-react 1.1.97 → 1.1.98
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/components/actions/autocomplete/Autocomplete.d.ts +1 -0
- package/dist/components/actions/autocomplete/Autocomplete.d.ts.map +1 -1
- package/dist/components/actions/autocomplete/Autocomplete.js +2 -9
- package/dist/components/actions/autocomplete/Autocomplete.js.map +1 -1
- package/package.json +4 -4
|
@@ -11,6 +11,7 @@ export interface AutocompleteProps extends FormFieldWrapperVariants, FormField {
|
|
|
11
11
|
query: string;
|
|
12
12
|
setQuery: (query: string) => void;
|
|
13
13
|
optionsLimit?: number;
|
|
14
|
+
onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
|
|
14
15
|
}
|
|
15
16
|
declare const Autocomplete: React.FC<AutocompleteProps>;
|
|
16
17
|
export { Autocomplete };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAML,KAAK,SAAS,EACd,KAAK,wBAAwB,EAC9B,MAAM,cAAc,CAAC;AACtB,OAAO,EAGL,cAAc,EAOf,MAAM,OAAO,CAAC;AAIf,MAAM,WAAW,iBAAkB,SAAQ,wBAAwB,EAAE,SAAS;IAC5E,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,QAAQ,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IACjD,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAW/B,OAAO,EAML,KAAK,SAAS,EACd,KAAK,wBAAwB,EAC9B,MAAM,cAAc,CAAC;AACtB,OAAO,EAGL,cAAc,EAOf,MAAM,OAAO,CAAC;AAIf,MAAM,WAAW,iBAAkB,SAAQ,wBAAwB,EAAE,SAAS;IAC5E,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,QAAQ,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IACjD,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CAC/D;AA+CD,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAqJ7C,CAAC;AAEF,OAAO,EAAC,YAAY,EAAC,CAAC"}
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
-
import * as React from 'react';
|
|
4
3
|
import { Combobox as ComboboxPrimitive, ComboboxInput as ComboboxPrimitiveInput, ComboboxOption as ComboboxPrimitiveOption, ComboboxOptions as ComboboxPrimitiveOptions, ComboboxButton as ComboboxPrimitiveButton, Transition, } from '@headlessui/react';
|
|
5
4
|
import { FormFieldHelperText, FormFieldIcon, FormFieldIconsContainer, FormFieldLabel, FormFieldWrapper, } from '../formField';
|
|
6
5
|
import { BodyText, optionVariants, optionsVariants, IconCoreCheck, IconCoreSearch, IconCoreFeedbackWarningFilledMono, IconCoreClose, } from '../..';
|
|
@@ -11,22 +10,16 @@ const ComboboxOption = ({ option, size, children, query, ...props }) => {
|
|
|
11
10
|
const { label, disabled } = option;
|
|
12
11
|
return (_jsx(ComboboxPrimitiveOption, { disabled: disabled, value: option, ...props, children: ({ selected, focus, disabled }) => (_jsxs("div", { title: label, className: cn(optionVariants({ size, hover: focus, selected, disabled }), 'justify-between'), children: [_jsx(BodyText, { textColor: 'inherit', variant: 'small', className: "truncate", children: typeof children === 'string' ? (_jsx(Highlight, { text: children, highlight: query ?? '' })) : (children) }), selected && _jsx(IconCoreCheck, { className: "shrink-0" })] })) }));
|
|
13
12
|
};
|
|
14
|
-
const Autocomplete = ({ options, optionsLimit = 10, selected, onChange, disabled, label, helperText, invalidText, invalid = false, placeholder, size, wrapperClassName, freeTextSearchLabel, freeTextSearchAllowed = false, required, query, setQuery, }) => {
|
|
15
|
-
const [focused, setFocused] = React.useState(false);
|
|
13
|
+
const Autocomplete = ({ options, optionsLimit = 10, selected, onChange, disabled, label, helperText, invalidText, invalid = false, placeholder, size, wrapperClassName, freeTextSearchLabel, freeTextSearchAllowed = false, required, query, setQuery, onFocus, }) => {
|
|
16
14
|
const { id, labelId, helperTextId } = useFieldId();
|
|
17
|
-
const clearIconEnabled = React.useRef(false);
|
|
18
15
|
const hasQuery = Boolean(query?.length);
|
|
19
|
-
React.useEffect(() => {
|
|
20
|
-
clearIconEnabled.current = false;
|
|
21
|
-
}, [focused]);
|
|
22
16
|
const showFreeTextOption = Boolean(query && freeTextSearchAllowed);
|
|
23
17
|
return (_jsx("div", { className: cn('relative font-text', wrapperClassName), children: _jsxs(ComboboxPrimitive, { as: "div", className: 'group', value: selected, onChange: value => {
|
|
24
18
|
onChange(value);
|
|
25
19
|
setQuery(value?.label ?? '');
|
|
26
20
|
}, disabled: disabled, immediate: true, children: [label && (_jsx(FormFieldLabel, { id: labelId, htmlFor: id, label: label, disabled: disabled, required: required })), _jsxs("div", { className: "relative inline-block w-full", children: [_jsx(FormFieldWrapper, { size: size, invalid: invalid, className: "text-draeger-dark-gray", children: _jsx(ComboboxPrimitiveInput, { id: id, autoComplete: "off", displayValue: option => option?.label, onBlur: () => {
|
|
27
|
-
setFocused(false);
|
|
28
21
|
setQuery(selected?.label ?? '');
|
|
29
|
-
}, onFocus:
|
|
22
|
+
}, onFocus: onFocus, onChange: event => setQuery(event.target.value), onKeyDown: e => e.key === 'Enter' && setQuery(''), placeholder: placeholder, required: required, "aria-labelledby": label && labelId, "aria-describedby": helperText && helperTextId, className: cn('pl-16 pr-14', hasQuery && invalid && 'pr-[88px]') }) }), _jsx(FormFieldIconsContainer, { align: 'left', children: _jsx(FormFieldIcon, { className: cn('pointer-events-auto'), icon: _jsx(IconCoreSearch, {}), color: disabled ? 'disabled' : undefined }) }), _jsxs(FormFieldIconsContainer, { children: [invalid && (_jsx(FormFieldIcon, { className: "pointer-events-auto text-draeger-error", icon: _jsx(IconCoreFeedbackWarningFilledMono, {}) })), (hasQuery || selected?.value) && (_jsx(ComboboxPrimitiveButton, { "aria-label": "Expand", className: 'flex', children: _jsx(FormFieldIcon, { className: "w-6 cursor-pointer pointer-events-auto text-draeger-cool-gray-750", icon: _jsx(IconCoreClose, {}), onClick: () => {
|
|
30
23
|
onChange(null);
|
|
31
24
|
setQuery('');
|
|
32
25
|
} }) }))] })] }), (showFreeTextOption || options.length > 0) && (_jsx(Transition, { enter: "duration-200 ease-out", enterFrom: "scale-95 opacity-0", enterTo: "scale-100 opacity-100", leave: "duration-300 ease-out", leaveFrom: "scale-100 opacity-100", leaveTo: "scale-95 opacity-0", children: _jsxs(ComboboxPrimitiveOptions, { anchor: { to: 'bottom' }, className: cn(optionsVariants({ size }), 'transition origin-top w-[var(--input-width)]'), children: [showFreeTextOption && (_jsxs(ComboboxOption, { option: { value: query, label: query }, size: size, children: [freeTextSearchLabel, query] })), options.slice(0, optionsLimit).map((option, index) => (_jsx(ComboboxOption, { option: option, size: size, query: query, children: option.label }, `${option.label}-${index}`)))] }) })), _jsx(FormFieldHelperText, { id: helperTextId, helperText: helperText, invalidText: invalidText, invalid: invalid, disabled: disabled })] }) }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Autocomplete.js","sourceRoot":"","sources":["../../../../src/components/actions/autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;
|
|
1
|
+
{"version":3,"file":"Autocomplete.js","sourceRoot":"","sources":["../../../../src/components/actions/autocomplete/Autocomplete.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@odx/websites-react",
|
|
3
3
|
"author": "Drägerwerk AG & Co. KGaA",
|
|
4
|
-
"version": "1.1.
|
|
4
|
+
"version": "1.1.98",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.md",
|
|
6
6
|
"description": "ODX React component library for websites",
|
|
7
7
|
"type": "module",
|
|
@@ -482,7 +482,7 @@
|
|
|
482
482
|
"tailwind-lib-content.js"
|
|
483
483
|
],
|
|
484
484
|
"dependencies": {
|
|
485
|
-
"@headlessui/react": "2.2.
|
|
485
|
+
"@headlessui/react": "2.2.7",
|
|
486
486
|
"@radix-ui/react-checkbox": "^1.1.4",
|
|
487
487
|
"@radix-ui/react-dialog": "^1.1.1",
|
|
488
488
|
"@radix-ui/react-navigation-menu": "^1.1.4",
|
|
@@ -529,8 +529,8 @@
|
|
|
529
529
|
"typescript": "^5.4.5",
|
|
530
530
|
"vitest": "^3.1.0-beta.1",
|
|
531
531
|
"@odx/eslint-config-websites": "0.0.1",
|
|
532
|
-
"@odx/websites-
|
|
533
|
-
"@odx/websites-
|
|
532
|
+
"@odx/websites-tsconfig": "0.0.0",
|
|
533
|
+
"@odx/websites-ui": "0.2.36"
|
|
534
534
|
},
|
|
535
535
|
"peerDependencies": {
|
|
536
536
|
"@odx/websites-ui": ">=0.2.1",
|