smarthr-ui 30.6.0 → 30.7.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/esm/components/ComboBox/MultiComboBox.d.ts +8 -65
- package/esm/components/ComboBox/MultiComboBox.js +2 -2
- package/esm/components/ComboBox/MultiComboBox.js.map +1 -1
- package/esm/components/ComboBox/MultiSelectedItemTooltip.d.ts +1 -1
- package/esm/components/ComboBox/SingleComboBox.d.ts +9 -65
- package/esm/components/ComboBox/SingleComboBox.js +5 -4
- package/esm/components/ComboBox/SingleComboBox.js.map +1 -1
- package/esm/components/ComboBox/types.d.ts +69 -1
- package/esm/components/ComboBox/useListBox.d.ts +1 -1
- package/esm/components/ComboBox/useOptions.js +2 -1
- package/esm/components/ComboBox/useOptions.js.map +1 -1
- package/lib/components/ComboBox/MultiComboBox.d.ts +8 -65
- package/lib/components/ComboBox/MultiComboBox.js +2 -2
- package/lib/components/ComboBox/MultiComboBox.js.map +1 -1
- package/lib/components/ComboBox/MultiSelectedItemTooltip.d.ts +1 -1
- package/lib/components/ComboBox/SingleComboBox.d.ts +9 -65
- package/lib/components/ComboBox/SingleComboBox.js +8 -4
- package/lib/components/ComboBox/SingleComboBox.js.map +1 -1
- package/lib/components/ComboBox/types.d.ts +69 -1
- package/lib/components/ComboBox/useListBox.d.ts +1 -1
- package/lib/components/ComboBox/useOptions.js +5 -1
- package/lib/components/ComboBox/useOptions.js.map +1 -1
- package/package.json +15 -12
|
@@ -1,87 +1,26 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { HTMLAttributes, InputHTMLAttributes } from 'react';
|
|
2
2
|
import { DecoratorsType } from '../../types/props';
|
|
3
|
-
import { ComboBoxItem } from './types';
|
|
4
|
-
type Props<T> = {
|
|
5
|
-
/**
|
|
6
|
-
* 選択可能なアイテムのリスト
|
|
7
|
-
*/
|
|
8
|
-
items: Array<ComboBoxItem<T>>;
|
|
3
|
+
import { BaseProps, ComboBoxItem } from './types';
|
|
4
|
+
type Props<T> = BaseProps<T> & {
|
|
9
5
|
/**
|
|
10
6
|
* 選択されているアイテムのリスト
|
|
11
7
|
*/
|
|
12
8
|
selectedItems: Array<ComboBoxItem<T> & {
|
|
13
9
|
deletable?: boolean;
|
|
14
10
|
}>;
|
|
15
|
-
/**
|
|
16
|
-
* input 要素の `name` 属性の値
|
|
17
|
-
*/
|
|
18
|
-
name?: string;
|
|
19
|
-
/**
|
|
20
|
-
* input 要素の `disabled` 属性の値
|
|
21
|
-
*/
|
|
22
|
-
disabled?: boolean;
|
|
23
|
-
/**
|
|
24
|
-
* `true` のとき、コンポーネントの外枠が `DANGER` カラーになる
|
|
25
|
-
*/
|
|
26
|
-
error?: boolean;
|
|
27
|
-
/**
|
|
28
|
-
* `true` のとき、 `items` 内に存在しないアイテムを新しく追加できるようになる
|
|
29
|
-
*/
|
|
30
|
-
creatable?: boolean;
|
|
31
|
-
/**
|
|
32
|
-
* input 要素の `placeholder` 属性の値
|
|
33
|
-
*/
|
|
34
|
-
placeholder?: string;
|
|
35
|
-
/**
|
|
36
|
-
* ドロップダウンリスト内に表示するヘルプメッセージ
|
|
37
|
-
*/
|
|
38
|
-
dropdownHelpMessage?: ReactNode;
|
|
39
|
-
/**
|
|
40
|
-
* `true` のとき、ドロップダウンリスト内にローダーを表示する
|
|
41
|
-
*/
|
|
42
|
-
isLoading?: boolean;
|
|
43
11
|
/**
|
|
44
12
|
* 選択されているアイテムのラベルを省略表示するかどうか
|
|
45
13
|
*/
|
|
46
14
|
selectedItemEllipsis?: boolean;
|
|
47
|
-
/**
|
|
48
|
-
* input 要素の `width` スタイルに適用する値
|
|
49
|
-
*/
|
|
50
|
-
width?: number | string;
|
|
51
|
-
/**
|
|
52
|
-
* ドロップダウンリストの `width` スタイルに適用する値
|
|
53
|
-
*/
|
|
54
|
-
dropdownWidth?: number | string;
|
|
55
15
|
/**
|
|
56
16
|
* テキストボックスの `value` 属性の値。
|
|
57
17
|
* `onChangeInput` と併せて設定することで、テキストボックスの挙動が制御可能になる。
|
|
58
18
|
*/
|
|
59
19
|
inputValue?: string;
|
|
60
|
-
/**
|
|
61
|
-
* コンポーネント内の一番外側の要素に適用するクラス名
|
|
62
|
-
*/
|
|
63
|
-
className?: string;
|
|
64
|
-
/**
|
|
65
|
-
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
66
|
-
* @deprecated `onChange` は非推奨なため、代わりに `onChangeInput` を使用してください。
|
|
67
|
-
*/
|
|
68
|
-
onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
69
|
-
/**
|
|
70
|
-
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
71
|
-
*/
|
|
72
|
-
onChangeInput?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
73
|
-
/**
|
|
74
|
-
* `items` 内に存在しないアイテムが追加されたときに発火するコールバック関数
|
|
75
|
-
*/
|
|
76
|
-
onAdd?: (label: string) => void;
|
|
77
20
|
/**
|
|
78
21
|
* 選択されているアイテムの削除ボタンがクリックされた時に発火するコールバック関数
|
|
79
22
|
*/
|
|
80
23
|
onDelete?: (item: ComboBoxItem<T>) => void;
|
|
81
|
-
/**
|
|
82
|
-
* アイテムが選択された時に発火するコールバック関数
|
|
83
|
-
*/
|
|
84
|
-
onSelect?: (item: ComboBoxItem<T>) => void;
|
|
85
24
|
/**
|
|
86
25
|
* 選択されているアイテムのリストが変わった時に発火するコールバック関数
|
|
87
26
|
*/
|
|
@@ -101,7 +40,11 @@ type Props<T> = {
|
|
|
101
40
|
destroyButtonIconAlt?: (text: string) => string;
|
|
102
41
|
selectedListAriaLabel?: (text: string) => string;
|
|
103
42
|
};
|
|
43
|
+
/**
|
|
44
|
+
* input 要素の属性
|
|
45
|
+
*/
|
|
46
|
+
inputAttributes?: Omit<InputHTMLAttributes<HTMLInputElement>, 'name' | 'disabled' | 'required' | 'type' | 'aria-activedescendant' | 'aria-autocomplete' | 'aria-controls' | 'aria-disabled' | 'aria-expanded' | 'aria-haspopup' | 'aria-invalid' | 'autoComplete' | 'className' | 'onChange' | 'onCompositionEnd' | 'onCompositionStart' | 'onFocus' | 'onKeyDown' | 'ref' | 'role' | 'tabIndex' | 'value'>;
|
|
104
47
|
};
|
|
105
48
|
type ElementProps<T> = Omit<HTMLAttributes<HTMLDivElement>, keyof Props<T>>;
|
|
106
|
-
export declare function MultiComboBox<T>({ items, selectedItems, name, disabled, error, creatable, placeholder, dropdownHelpMessage, isLoading, selectedItemEllipsis, width, dropdownWidth, inputValue: controlledInputValue, className, onChange, onChangeInput, onAdd, onDelete, onSelect, onChangeSelected, onFocus, onBlur, decorators, ...props }: Props<T> & ElementProps<T>): JSX.Element;
|
|
49
|
+
export declare function MultiComboBox<T>({ items, selectedItems, name, disabled, required, error, creatable, placeholder, dropdownHelpMessage, isLoading, selectedItemEllipsis, width, dropdownWidth, inputValue: controlledInputValue, className, onChange, onChangeInput, onAdd, onDelete, onSelect, onChangeSelected, onFocus, onBlur, decorators, inputAttributes, ...props }: Props<T> & ElementProps<T>): JSX.Element;
|
|
107
50
|
export {};
|
|
@@ -12,7 +12,7 @@ import { useFocusControl } from './useFocusControl';
|
|
|
12
12
|
import { useListBox } from './useListBox';
|
|
13
13
|
import { useOptions } from './useOptions';
|
|
14
14
|
const SELECTED_LIST_ARIA_LABEL = '選択済みアイテム';
|
|
15
|
-
export function MultiComboBox({ items, selectedItems, name, disabled = false, error = false, creatable = false, placeholder = '', dropdownHelpMessage, isLoading, selectedItemEllipsis, width = 'auto', dropdownWidth = 'auto', inputValue: controlledInputValue, className = '', onChange, onChangeInput, onAdd, onDelete, onSelect, onChangeSelected, onFocus, onBlur, decorators, ...props }) {
|
|
15
|
+
export function MultiComboBox({ items, selectedItems, name, disabled = false, required = false, error = false, creatable = false, placeholder = '', dropdownHelpMessage, isLoading, selectedItemEllipsis, width = 'auto', dropdownWidth = 'auto', inputValue: controlledInputValue, className = '', onChange, onChangeInput, onAdd, onDelete, onSelect, onChangeSelected, onFocus, onBlur, decorators, inputAttributes, ...props }) {
|
|
16
16
|
const theme = useTheme();
|
|
17
17
|
const classNames = useMultiComboBoxClassNames();
|
|
18
18
|
const outerRef = useRef(null);
|
|
@@ -162,7 +162,7 @@ export function MultiComboBox({ items, selectedItems, name, disabled = false, er
|
|
|
162
162
|
SELECTED_LIST_ARIA_LABEL, className: classNames.selectedList }, selectedItems.map((selectedItem, i) => (React.createElement("li", { key: `${selectedItem.label}-${selectedItem.value}` },
|
|
163
163
|
React.createElement(MultiSelectedItem, { item: selectedItem, disabled: disabled, onDelete: handleDelete, enableEllipsis: selectedItemEllipsis, buttonRef: deletionButtonRefs[i], decorators: decorators }))))),
|
|
164
164
|
React.createElement(InputWrapper, { className: isFocused ? undefined : 'hidden' },
|
|
165
|
-
React.createElement(Input, { type: "text", name: name, value: inputValue, disabled: disabled, ref: inputRef, themes: theme, onChange: (e) => {
|
|
165
|
+
React.createElement(Input, { ...inputAttributes, type: "text", name: name, value: inputValue, disabled: disabled, required: required, ref: inputRef, themes: theme, onChange: (e) => {
|
|
166
166
|
if (onChange)
|
|
167
167
|
onChange(e);
|
|
168
168
|
if (onChangeInput)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/MultiComboBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,
|
|
1
|
+
{"version":3,"file":"MultiComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/MultiComboBox.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,11 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import React, { HTMLAttributes, MouseEvent, ReactNode } from 'react';
|
|
2
2
|
import { DecoratorsType } from '../../types/props';
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
* 選択可能なアイテムのリスト
|
|
7
|
-
*/
|
|
8
|
-
items: Array<ComboBoxItem<T>>;
|
|
3
|
+
import { Input } from '../Input';
|
|
4
|
+
import { BaseProps, ComboBoxItem } from './types';
|
|
5
|
+
type Props<T> = BaseProps<T> & {
|
|
9
6
|
/**
|
|
10
7
|
* 選択されているアイテム
|
|
11
8
|
*/
|
|
@@ -14,67 +11,10 @@ type Props<T> = {
|
|
|
14
11
|
* デフォルトで選択されるアイテム
|
|
15
12
|
*/
|
|
16
13
|
defaultItem?: ComboBoxItem<T>;
|
|
17
|
-
/**
|
|
18
|
-
* input 要素の `name` 属性の値
|
|
19
|
-
*/
|
|
20
|
-
name?: string;
|
|
21
|
-
/**
|
|
22
|
-
* input 要素の `disabled` 属性の値
|
|
23
|
-
*/
|
|
24
|
-
disabled?: boolean;
|
|
25
14
|
/**
|
|
26
15
|
* コンポーネント内の先頭に表示する内容
|
|
27
16
|
*/
|
|
28
17
|
prefix?: ReactNode;
|
|
29
|
-
/**
|
|
30
|
-
* `true` のとき、コンポーネントの外枠が `DANGER` カラーになる
|
|
31
|
-
*/
|
|
32
|
-
error?: boolean;
|
|
33
|
-
/**
|
|
34
|
-
* `true` のとき、 `items` 内に存在しないアイテムを新しく追加できるようになる
|
|
35
|
-
*/
|
|
36
|
-
creatable?: boolean;
|
|
37
|
-
/**
|
|
38
|
-
* input 要素の `placeholder` 属性の値
|
|
39
|
-
*/
|
|
40
|
-
placeholder?: string;
|
|
41
|
-
/**
|
|
42
|
-
* ドロップダウンリスト内に表示するヘルプメッセージ
|
|
43
|
-
*/
|
|
44
|
-
dropdownHelpMessage?: ReactNode;
|
|
45
|
-
/**
|
|
46
|
-
* `true` のとき、ドロップダウンリスト内にローダーを表示する
|
|
47
|
-
*/
|
|
48
|
-
isLoading?: boolean;
|
|
49
|
-
/**
|
|
50
|
-
* input 要素の `width` スタイルに適用する値
|
|
51
|
-
*/
|
|
52
|
-
width?: number | string;
|
|
53
|
-
/**
|
|
54
|
-
* ドロップダウンリストの `width` スタイルに適用する値
|
|
55
|
-
*/
|
|
56
|
-
dropdownWidth?: number | string;
|
|
57
|
-
/**
|
|
58
|
-
* コンポーネント内の一番外側の要素に適用するクラス名
|
|
59
|
-
*/
|
|
60
|
-
className?: string;
|
|
61
|
-
/**
|
|
62
|
-
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
63
|
-
* @deprecated `onChange` は非推奨なため、 代わりに `onChangeInput` を使用してください。
|
|
64
|
-
*/
|
|
65
|
-
onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
66
|
-
/**
|
|
67
|
-
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
68
|
-
*/
|
|
69
|
-
onChangeInput?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
70
|
-
/**
|
|
71
|
-
* `items` 内に存在しないアイテムが追加されたときに発火するコールバック関数
|
|
72
|
-
*/
|
|
73
|
-
onAdd?: (label: string) => void;
|
|
74
|
-
/**
|
|
75
|
-
* アイテムが選択された時に発火するコールバック関数
|
|
76
|
-
*/
|
|
77
|
-
onSelect?: (item: ComboBoxItem<T>) => void;
|
|
78
18
|
/**
|
|
79
19
|
* 選択されているアイテムがクリアされた時に発火するコールバック関数
|
|
80
20
|
*/
|
|
@@ -94,7 +34,11 @@ type Props<T> = {
|
|
|
94
34
|
decorators?: DecoratorsType<'noResultText'> & {
|
|
95
35
|
destroyButtonIconAlt?: (text: string) => string;
|
|
96
36
|
};
|
|
37
|
+
/**
|
|
38
|
+
* input 要素の属性
|
|
39
|
+
*/
|
|
40
|
+
inputAttributes?: Omit<React.ComponentProps<typeof Input>, 'aria-activedescendant' | 'aria-autocomplete' | 'autoComplete' | 'className' | 'disabled' | 'required' | 'error' | 'name' | 'onChange' | 'onClick' | 'onCompositionEnd' | 'onCompositionStart' | 'onFocus' | 'onKeyDown' | 'placeholder' | 'prefix' | 'ref' | 'suffix' | 'type' | 'value'>;
|
|
97
41
|
};
|
|
98
42
|
type ElementProps<T> = Omit<HTMLAttributes<HTMLDivElement>, keyof Props<T>>;
|
|
99
|
-
export declare function SingleComboBox<T>({ items, selectedItem, defaultItem, name, disabled, prefix, error, creatable, placeholder, dropdownHelpMessage, isLoading, width, dropdownWidth, className, onChange, onChangeInput, onAdd, onSelect, onClear, onClearClick, onChangeSelected, decorators, ...props }: Props<T> & ElementProps<T>): JSX.Element;
|
|
43
|
+
export declare function SingleComboBox<T>({ items, selectedItem, defaultItem, name, disabled, required, prefix, error, creatable, placeholder, dropdownHelpMessage, isLoading, width, dropdownWidth, className, onChange, onChangeInput, onAdd, onSelect, onClear, onClearClick, onChangeSelected, decorators, inputAttributes, ...props }: Props<T> & ElementProps<T>): JSX.Element;
|
|
100
44
|
export {};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import React, { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
|
|
2
|
+
import innerText from 'react-innertext';
|
|
2
3
|
import styled, { css } from 'styled-components';
|
|
3
4
|
import { useClick } from '../../hooks/useClick';
|
|
4
5
|
import { useTheme } from '../../hooks/useTheme';
|
|
@@ -10,7 +11,7 @@ import { useSingleComboBoxClassNames } from './useClassNames';
|
|
|
10
11
|
import { useListBox } from './useListBox';
|
|
11
12
|
import { useOptions } from './useOptions';
|
|
12
13
|
const DESTROY_BUTTON_TEXT = '削除';
|
|
13
|
-
export function SingleComboBox({ items, selectedItem, defaultItem, name, disabled = false, prefix, error = false, creatable = false, placeholder = '', dropdownHelpMessage, isLoading, width = 'auto', dropdownWidth = 'auto', className = '', onChange, onChangeInput, onAdd, onSelect, onClear, onClearClick, onChangeSelected, decorators, ...props }) {
|
|
14
|
+
export function SingleComboBox({ items, selectedItem, defaultItem, name, disabled = false, required = false, prefix, error = false, creatable = false, placeholder = '', dropdownHelpMessage, isLoading, width = 'auto', dropdownWidth = 'auto', className = '', onChange, onChangeInput, onAdd, onSelect, onClear, onClearClick, onChangeSelected, decorators, inputAttributes, ...props }) {
|
|
14
15
|
const theme = useTheme();
|
|
15
16
|
const classNames = useSingleComboBoxClassNames();
|
|
16
17
|
const outerRef = useRef(null);
|
|
@@ -59,7 +60,7 @@ export function SingleComboBox({ items, selectedItem, defaultItem, name, disable
|
|
|
59
60
|
setIsExpanded(false);
|
|
60
61
|
setIsEditing(false);
|
|
61
62
|
if (!selectedItem && defaultItem) {
|
|
62
|
-
setInputValue(defaultItem.label);
|
|
63
|
+
setInputValue(innerText(defaultItem.label));
|
|
63
64
|
onSelect && onSelect(defaultItem);
|
|
64
65
|
}
|
|
65
66
|
}, [selectedItem, defaultItem, onSelect]);
|
|
@@ -156,7 +157,7 @@ export function SingleComboBox({ items, selectedItem, defaultItem, name, disable
|
|
|
156
157
|
}, [unfocus]));
|
|
157
158
|
useEffect(() => {
|
|
158
159
|
if (selectedItem) {
|
|
159
|
-
setInputValue(selectedItem.label);
|
|
160
|
+
setInputValue(innerText(selectedItem.label));
|
|
160
161
|
}
|
|
161
162
|
else {
|
|
162
163
|
setInputValue('');
|
|
@@ -174,7 +175,7 @@ export function SingleComboBox({ items, selectedItem, defaultItem, name, disable
|
|
|
174
175
|
}), [classNames.listBox]);
|
|
175
176
|
return (React.createElement(ComboBoxContext.Provider, { value: contextValue },
|
|
176
177
|
React.createElement(Container, { ...props, ref: outerRef, className: `${disabled ? 'disabled' : ''} ${className} ${classNames.wrapper}`, "$width": width, role: "combobox", "aria-haspopup": "listbox", "aria-controls": listBoxId, "aria-expanded": isFocused, "aria-invalid": error || undefined },
|
|
177
|
-
React.createElement(StyledInput, { placeholder: placeholder, type: "text", name: name, value: inputValue, disabled: disabled, prefix: prefix, error: error, suffix: React.createElement(React.Fragment, null,
|
|
178
|
+
React.createElement(StyledInput, { ...inputAttributes, placeholder: placeholder, type: "text", name: name, value: inputValue, disabled: disabled, required: required, prefix: prefix, error: error, suffix: React.createElement(React.Fragment, null,
|
|
178
179
|
React.createElement(ClearButton, { type: "button", onClick: onClickClear, ref: clearButtonRef, themes: theme, className: `${needsClearButton ? '' : 'hidden'} ${classNames.clearButton}` },
|
|
179
180
|
React.createElement(FaTimesCircleIcon, { color: theme.color.TEXT_BLACK, alt: decorators?.destroyButtonIconAlt?.(DESTROY_BUTTON_TEXT) || DESTROY_BUTTON_TEXT })),
|
|
180
181
|
React.createElement(CaretDownLayout, { themes: theme, onClick: onClickInput },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SingleComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/SingleComboBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAKZ,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAA;AACd,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAA;AAE/C,OAAO,EAAE,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAC/C,OAAO,EAAS,QAAQ,EAAE,MAAM,sBAAsB,CAAA;AAEtD,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAC1C,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAC5D,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAEhC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAEnD,OAAO,EAAE,2BAA2B,EAAE,MAAM,iBAAiB,CAAA;AAC7D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;
|
|
1
|
+
{"version":3,"file":"SingleComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/SingleComboBox.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import React, { ChangeEvent, ReactNode } from 'react';
|
|
1
2
|
export type ComboBoxItem<T> = {
|
|
2
3
|
value: string;
|
|
3
|
-
label:
|
|
4
|
+
label: React.ReactNode;
|
|
4
5
|
disabled?: boolean;
|
|
5
6
|
data?: T;
|
|
6
7
|
};
|
|
@@ -10,3 +11,70 @@ export type ComboBoxOption<T> = {
|
|
|
10
11
|
isNew: boolean;
|
|
11
12
|
item: ComboBoxItem<T>;
|
|
12
13
|
};
|
|
14
|
+
export type BaseProps<T> = {
|
|
15
|
+
/**
|
|
16
|
+
* 選択可能なアイテムのリスト
|
|
17
|
+
*/
|
|
18
|
+
items: Array<ComboBoxItem<T>>;
|
|
19
|
+
/**
|
|
20
|
+
* input 要素の `name` 属性の値
|
|
21
|
+
*/
|
|
22
|
+
name?: string;
|
|
23
|
+
/**
|
|
24
|
+
* input 要素の `disabled` 属性の値
|
|
25
|
+
*/
|
|
26
|
+
disabled?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* input 要素の `required` 属性の値
|
|
29
|
+
*/
|
|
30
|
+
required?: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* コンポーネント内の一番外側の要素に適用するクラス名
|
|
33
|
+
*/
|
|
34
|
+
className?: string;
|
|
35
|
+
/**
|
|
36
|
+
* `true` のとき、コンポーネントの外枠が `DANGER` カラーになる
|
|
37
|
+
*/
|
|
38
|
+
error?: boolean;
|
|
39
|
+
/**
|
|
40
|
+
* `true` のとき、 `items` 内に存在しないアイテムを新しく追加できるようになる
|
|
41
|
+
*/
|
|
42
|
+
creatable?: boolean;
|
|
43
|
+
/**
|
|
44
|
+
* input 要素の `placeholder` 属性の値
|
|
45
|
+
*/
|
|
46
|
+
placeholder?: string;
|
|
47
|
+
/**
|
|
48
|
+
* `true` のとき、ドロップダウンリスト内にローダーを表示する
|
|
49
|
+
*/
|
|
50
|
+
isLoading?: boolean;
|
|
51
|
+
/**
|
|
52
|
+
* input 要素の `width` スタイルに適用する値
|
|
53
|
+
*/
|
|
54
|
+
width?: number | string;
|
|
55
|
+
/**
|
|
56
|
+
* ドロップダウンリスト内に表示するヘルプメッセージ
|
|
57
|
+
*/
|
|
58
|
+
dropdownHelpMessage?: ReactNode;
|
|
59
|
+
/**
|
|
60
|
+
* ドロップダウンリストの `width` スタイルに適用する値
|
|
61
|
+
*/
|
|
62
|
+
dropdownWidth?: number | string;
|
|
63
|
+
/**
|
|
64
|
+
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
65
|
+
*/
|
|
66
|
+
onChangeInput?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
67
|
+
/**
|
|
68
|
+
* `items` 内に存在しないアイテムが追加されたときに発火するコールバック関数
|
|
69
|
+
*/
|
|
70
|
+
onAdd?: (label: ReactNode) => void;
|
|
71
|
+
/**
|
|
72
|
+
* アイテムが選択された時に発火するコールバック関数
|
|
73
|
+
*/
|
|
74
|
+
onSelect?: (item: ComboBoxItem<T>) => void;
|
|
75
|
+
/**
|
|
76
|
+
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
77
|
+
* @deprecated `onChange` は非推奨なため、 代わりに `onChangeInput` を使用してください。
|
|
78
|
+
*/
|
|
79
|
+
onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
80
|
+
};
|
|
@@ -5,7 +5,7 @@ type Props<T> = {
|
|
|
5
5
|
options: Array<ComboBoxOption<T>>;
|
|
6
6
|
dropdownHelpMessage?: ReactNode;
|
|
7
7
|
dropdownWidth?: string | number;
|
|
8
|
-
onAdd?: (label:
|
|
8
|
+
onAdd?: (label: ReactNode) => void;
|
|
9
9
|
onSelect: (item: ComboBoxItem<T>) => void;
|
|
10
10
|
isExpanded: boolean;
|
|
11
11
|
isLoading?: boolean;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { useCallback, useMemo } from 'react';
|
|
2
|
+
import innerText from 'react-innertext';
|
|
2
3
|
import { useId } from '../../hooks/useId';
|
|
3
4
|
import { convertMatchableString } from './comboBoxHelper';
|
|
4
5
|
export function useOptions({ items, selected, creatable, inputValue = '', isFilteringDisabled = false, }) {
|
|
@@ -41,7 +42,7 @@ export function useOptions({ items, selected, creatable, inputValue = '', isFilt
|
|
|
41
42
|
return allOptions.filter(({ item: { label } }) => {
|
|
42
43
|
if (!inputValue)
|
|
43
44
|
return true;
|
|
44
|
-
return convertMatchableString(label).includes(convertMatchableString(inputValue));
|
|
45
|
+
return convertMatchableString(innerText(label)).includes(convertMatchableString(inputValue));
|
|
45
46
|
});
|
|
46
47
|
}, [allOptions, inputValue, isFilteringDisabled]);
|
|
47
48
|
return {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useOptions.js","sourceRoot":"","sources":["../../../src/components/ComboBox/useOptions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"useOptions.js","sourceRoot":"","sources":["../../../src/components/ComboBox/useOptions.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,87 +1,26 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { HTMLAttributes, InputHTMLAttributes } from 'react';
|
|
2
2
|
import { DecoratorsType } from '../../types/props';
|
|
3
|
-
import { ComboBoxItem } from './types';
|
|
4
|
-
type Props<T> = {
|
|
5
|
-
/**
|
|
6
|
-
* 選択可能なアイテムのリスト
|
|
7
|
-
*/
|
|
8
|
-
items: Array<ComboBoxItem<T>>;
|
|
3
|
+
import { BaseProps, ComboBoxItem } from './types';
|
|
4
|
+
type Props<T> = BaseProps<T> & {
|
|
9
5
|
/**
|
|
10
6
|
* 選択されているアイテムのリスト
|
|
11
7
|
*/
|
|
12
8
|
selectedItems: Array<ComboBoxItem<T> & {
|
|
13
9
|
deletable?: boolean;
|
|
14
10
|
}>;
|
|
15
|
-
/**
|
|
16
|
-
* input 要素の `name` 属性の値
|
|
17
|
-
*/
|
|
18
|
-
name?: string;
|
|
19
|
-
/**
|
|
20
|
-
* input 要素の `disabled` 属性の値
|
|
21
|
-
*/
|
|
22
|
-
disabled?: boolean;
|
|
23
|
-
/**
|
|
24
|
-
* `true` のとき、コンポーネントの外枠が `DANGER` カラーになる
|
|
25
|
-
*/
|
|
26
|
-
error?: boolean;
|
|
27
|
-
/**
|
|
28
|
-
* `true` のとき、 `items` 内に存在しないアイテムを新しく追加できるようになる
|
|
29
|
-
*/
|
|
30
|
-
creatable?: boolean;
|
|
31
|
-
/**
|
|
32
|
-
* input 要素の `placeholder` 属性の値
|
|
33
|
-
*/
|
|
34
|
-
placeholder?: string;
|
|
35
|
-
/**
|
|
36
|
-
* ドロップダウンリスト内に表示するヘルプメッセージ
|
|
37
|
-
*/
|
|
38
|
-
dropdownHelpMessage?: ReactNode;
|
|
39
|
-
/**
|
|
40
|
-
* `true` のとき、ドロップダウンリスト内にローダーを表示する
|
|
41
|
-
*/
|
|
42
|
-
isLoading?: boolean;
|
|
43
11
|
/**
|
|
44
12
|
* 選択されているアイテムのラベルを省略表示するかどうか
|
|
45
13
|
*/
|
|
46
14
|
selectedItemEllipsis?: boolean;
|
|
47
|
-
/**
|
|
48
|
-
* input 要素の `width` スタイルに適用する値
|
|
49
|
-
*/
|
|
50
|
-
width?: number | string;
|
|
51
|
-
/**
|
|
52
|
-
* ドロップダウンリストの `width` スタイルに適用する値
|
|
53
|
-
*/
|
|
54
|
-
dropdownWidth?: number | string;
|
|
55
15
|
/**
|
|
56
16
|
* テキストボックスの `value` 属性の値。
|
|
57
17
|
* `onChangeInput` と併せて設定することで、テキストボックスの挙動が制御可能になる。
|
|
58
18
|
*/
|
|
59
19
|
inputValue?: string;
|
|
60
|
-
/**
|
|
61
|
-
* コンポーネント内の一番外側の要素に適用するクラス名
|
|
62
|
-
*/
|
|
63
|
-
className?: string;
|
|
64
|
-
/**
|
|
65
|
-
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
66
|
-
* @deprecated `onChange` は非推奨なため、代わりに `onChangeInput` を使用してください。
|
|
67
|
-
*/
|
|
68
|
-
onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
69
|
-
/**
|
|
70
|
-
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
71
|
-
*/
|
|
72
|
-
onChangeInput?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
73
|
-
/**
|
|
74
|
-
* `items` 内に存在しないアイテムが追加されたときに発火するコールバック関数
|
|
75
|
-
*/
|
|
76
|
-
onAdd?: (label: string) => void;
|
|
77
20
|
/**
|
|
78
21
|
* 選択されているアイテムの削除ボタンがクリックされた時に発火するコールバック関数
|
|
79
22
|
*/
|
|
80
23
|
onDelete?: (item: ComboBoxItem<T>) => void;
|
|
81
|
-
/**
|
|
82
|
-
* アイテムが選択された時に発火するコールバック関数
|
|
83
|
-
*/
|
|
84
|
-
onSelect?: (item: ComboBoxItem<T>) => void;
|
|
85
24
|
/**
|
|
86
25
|
* 選択されているアイテムのリストが変わった時に発火するコールバック関数
|
|
87
26
|
*/
|
|
@@ -101,7 +40,11 @@ type Props<T> = {
|
|
|
101
40
|
destroyButtonIconAlt?: (text: string) => string;
|
|
102
41
|
selectedListAriaLabel?: (text: string) => string;
|
|
103
42
|
};
|
|
43
|
+
/**
|
|
44
|
+
* input 要素の属性
|
|
45
|
+
*/
|
|
46
|
+
inputAttributes?: Omit<InputHTMLAttributes<HTMLInputElement>, 'name' | 'disabled' | 'required' | 'type' | 'aria-activedescendant' | 'aria-autocomplete' | 'aria-controls' | 'aria-disabled' | 'aria-expanded' | 'aria-haspopup' | 'aria-invalid' | 'autoComplete' | 'className' | 'onChange' | 'onCompositionEnd' | 'onCompositionStart' | 'onFocus' | 'onKeyDown' | 'ref' | 'role' | 'tabIndex' | 'value'>;
|
|
104
47
|
};
|
|
105
48
|
type ElementProps<T> = Omit<HTMLAttributes<HTMLDivElement>, keyof Props<T>>;
|
|
106
|
-
export declare function MultiComboBox<T>({ items, selectedItems, name, disabled, error, creatable, placeholder, dropdownHelpMessage, isLoading, selectedItemEllipsis, width, dropdownWidth, inputValue: controlledInputValue, className, onChange, onChangeInput, onAdd, onDelete, onSelect, onChangeSelected, onFocus, onBlur, decorators, ...props }: Props<T> & ElementProps<T>): JSX.Element;
|
|
49
|
+
export declare function MultiComboBox<T>({ items, selectedItems, name, disabled, required, error, creatable, placeholder, dropdownHelpMessage, isLoading, selectedItemEllipsis, width, dropdownWidth, inputValue: controlledInputValue, className, onChange, onChangeInput, onAdd, onDelete, onSelect, onChangeSelected, onFocus, onBlur, decorators, inputAttributes, ...props }: Props<T> & ElementProps<T>): JSX.Element;
|
|
107
50
|
export {};
|
|
@@ -38,7 +38,7 @@ const useFocusControl_1 = require("./useFocusControl");
|
|
|
38
38
|
const useListBox_1 = require("./useListBox");
|
|
39
39
|
const useOptions_1 = require("./useOptions");
|
|
40
40
|
const SELECTED_LIST_ARIA_LABEL = '選択済みアイテム';
|
|
41
|
-
function MultiComboBox({ items, selectedItems, name, disabled = false, error = false, creatable = false, placeholder = '', dropdownHelpMessage, isLoading, selectedItemEllipsis, width = 'auto', dropdownWidth = 'auto', inputValue: controlledInputValue, className = '', onChange, onChangeInput, onAdd, onDelete, onSelect, onChangeSelected, onFocus, onBlur, decorators, ...props }) {
|
|
41
|
+
function MultiComboBox({ items, selectedItems, name, disabled = false, required = false, error = false, creatable = false, placeholder = '', dropdownHelpMessage, isLoading, selectedItemEllipsis, width = 'auto', dropdownWidth = 'auto', inputValue: controlledInputValue, className = '', onChange, onChangeInput, onAdd, onDelete, onSelect, onChangeSelected, onFocus, onBlur, decorators, inputAttributes, ...props }) {
|
|
42
42
|
const theme = (0, useTheme_1.useTheme)();
|
|
43
43
|
const classNames = (0, useClassNames_1.useMultiComboBoxClassNames)();
|
|
44
44
|
const outerRef = (0, react_1.useRef)(null);
|
|
@@ -188,7 +188,7 @@ function MultiComboBox({ items, selectedItems, name, disabled = false, error = f
|
|
|
188
188
|
SELECTED_LIST_ARIA_LABEL, className: classNames.selectedList }, selectedItems.map((selectedItem, i) => (react_1.default.createElement("li", { key: `${selectedItem.label}-${selectedItem.value}` },
|
|
189
189
|
react_1.default.createElement(MultiSelectedItem_1.MultiSelectedItem, { item: selectedItem, disabled: disabled, onDelete: handleDelete, enableEllipsis: selectedItemEllipsis, buttonRef: deletionButtonRefs[i], decorators: decorators }))))),
|
|
190
190
|
react_1.default.createElement(InputWrapper, { className: isFocused ? undefined : 'hidden' },
|
|
191
|
-
react_1.default.createElement(Input, { type: "text", name: name, value: inputValue, disabled: disabled, ref: inputRef, themes: theme, onChange: (e) => {
|
|
191
|
+
react_1.default.createElement(Input, { ...inputAttributes, type: "text", name: name, value: inputValue, disabled: disabled, required: required, ref: inputRef, themes: theme, onChange: (e) => {
|
|
192
192
|
if (onChange)
|
|
193
193
|
onChange(e);
|
|
194
194
|
if (onChangeInput)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/MultiComboBox.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+
|
|
1
|
+
{"version":3,"file":"MultiComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/MultiComboBox.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,11 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import React, { HTMLAttributes, MouseEvent, ReactNode } from 'react';
|
|
2
2
|
import { DecoratorsType } from '../../types/props';
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
* 選択可能なアイテムのリスト
|
|
7
|
-
*/
|
|
8
|
-
items: Array<ComboBoxItem<T>>;
|
|
3
|
+
import { Input } from '../Input';
|
|
4
|
+
import { BaseProps, ComboBoxItem } from './types';
|
|
5
|
+
type Props<T> = BaseProps<T> & {
|
|
9
6
|
/**
|
|
10
7
|
* 選択されているアイテム
|
|
11
8
|
*/
|
|
@@ -14,67 +11,10 @@ type Props<T> = {
|
|
|
14
11
|
* デフォルトで選択されるアイテム
|
|
15
12
|
*/
|
|
16
13
|
defaultItem?: ComboBoxItem<T>;
|
|
17
|
-
/**
|
|
18
|
-
* input 要素の `name` 属性の値
|
|
19
|
-
*/
|
|
20
|
-
name?: string;
|
|
21
|
-
/**
|
|
22
|
-
* input 要素の `disabled` 属性の値
|
|
23
|
-
*/
|
|
24
|
-
disabled?: boolean;
|
|
25
14
|
/**
|
|
26
15
|
* コンポーネント内の先頭に表示する内容
|
|
27
16
|
*/
|
|
28
17
|
prefix?: ReactNode;
|
|
29
|
-
/**
|
|
30
|
-
* `true` のとき、コンポーネントの外枠が `DANGER` カラーになる
|
|
31
|
-
*/
|
|
32
|
-
error?: boolean;
|
|
33
|
-
/**
|
|
34
|
-
* `true` のとき、 `items` 内に存在しないアイテムを新しく追加できるようになる
|
|
35
|
-
*/
|
|
36
|
-
creatable?: boolean;
|
|
37
|
-
/**
|
|
38
|
-
* input 要素の `placeholder` 属性の値
|
|
39
|
-
*/
|
|
40
|
-
placeholder?: string;
|
|
41
|
-
/**
|
|
42
|
-
* ドロップダウンリスト内に表示するヘルプメッセージ
|
|
43
|
-
*/
|
|
44
|
-
dropdownHelpMessage?: ReactNode;
|
|
45
|
-
/**
|
|
46
|
-
* `true` のとき、ドロップダウンリスト内にローダーを表示する
|
|
47
|
-
*/
|
|
48
|
-
isLoading?: boolean;
|
|
49
|
-
/**
|
|
50
|
-
* input 要素の `width` スタイルに適用する値
|
|
51
|
-
*/
|
|
52
|
-
width?: number | string;
|
|
53
|
-
/**
|
|
54
|
-
* ドロップダウンリストの `width` スタイルに適用する値
|
|
55
|
-
*/
|
|
56
|
-
dropdownWidth?: number | string;
|
|
57
|
-
/**
|
|
58
|
-
* コンポーネント内の一番外側の要素に適用するクラス名
|
|
59
|
-
*/
|
|
60
|
-
className?: string;
|
|
61
|
-
/**
|
|
62
|
-
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
63
|
-
* @deprecated `onChange` は非推奨なため、 代わりに `onChangeInput` を使用してください。
|
|
64
|
-
*/
|
|
65
|
-
onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
66
|
-
/**
|
|
67
|
-
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
68
|
-
*/
|
|
69
|
-
onChangeInput?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
70
|
-
/**
|
|
71
|
-
* `items` 内に存在しないアイテムが追加されたときに発火するコールバック関数
|
|
72
|
-
*/
|
|
73
|
-
onAdd?: (label: string) => void;
|
|
74
|
-
/**
|
|
75
|
-
* アイテムが選択された時に発火するコールバック関数
|
|
76
|
-
*/
|
|
77
|
-
onSelect?: (item: ComboBoxItem<T>) => void;
|
|
78
18
|
/**
|
|
79
19
|
* 選択されているアイテムがクリアされた時に発火するコールバック関数
|
|
80
20
|
*/
|
|
@@ -94,7 +34,11 @@ type Props<T> = {
|
|
|
94
34
|
decorators?: DecoratorsType<'noResultText'> & {
|
|
95
35
|
destroyButtonIconAlt?: (text: string) => string;
|
|
96
36
|
};
|
|
37
|
+
/**
|
|
38
|
+
* input 要素の属性
|
|
39
|
+
*/
|
|
40
|
+
inputAttributes?: Omit<React.ComponentProps<typeof Input>, 'aria-activedescendant' | 'aria-autocomplete' | 'autoComplete' | 'className' | 'disabled' | 'required' | 'error' | 'name' | 'onChange' | 'onClick' | 'onCompositionEnd' | 'onCompositionStart' | 'onFocus' | 'onKeyDown' | 'placeholder' | 'prefix' | 'ref' | 'suffix' | 'type' | 'value'>;
|
|
97
41
|
};
|
|
98
42
|
type ElementProps<T> = Omit<HTMLAttributes<HTMLDivElement>, keyof Props<T>>;
|
|
99
|
-
export declare function SingleComboBox<T>({ items, selectedItem, defaultItem, name, disabled, prefix, error, creatable, placeholder, dropdownHelpMessage, isLoading, width, dropdownWidth, className, onChange, onChangeInput, onAdd, onSelect, onClear, onClearClick, onChangeSelected, decorators, ...props }: Props<T> & ElementProps<T>): JSX.Element;
|
|
43
|
+
export declare function SingleComboBox<T>({ items, selectedItem, defaultItem, name, disabled, required, prefix, error, creatable, placeholder, dropdownHelpMessage, isLoading, width, dropdownWidth, className, onChange, onChangeInput, onAdd, onSelect, onClear, onClearClick, onChangeSelected, decorators, inputAttributes, ...props }: Props<T> & ElementProps<T>): JSX.Element;
|
|
100
44
|
export {};
|
|
@@ -22,9 +22,13 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
22
22
|
__setModuleDefault(result, mod);
|
|
23
23
|
return result;
|
|
24
24
|
};
|
|
25
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
+
};
|
|
25
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
29
|
exports.SingleComboBox = void 0;
|
|
27
30
|
const react_1 = __importStar(require("react"));
|
|
31
|
+
const react_innertext_1 = __importDefault(require("react-innertext"));
|
|
28
32
|
const styled_components_1 = __importStar(require("styled-components"));
|
|
29
33
|
const useClick_1 = require("../../hooks/useClick");
|
|
30
34
|
const useTheme_1 = require("../../hooks/useTheme");
|
|
@@ -36,7 +40,7 @@ const useClassNames_1 = require("./useClassNames");
|
|
|
36
40
|
const useListBox_1 = require("./useListBox");
|
|
37
41
|
const useOptions_1 = require("./useOptions");
|
|
38
42
|
const DESTROY_BUTTON_TEXT = '削除';
|
|
39
|
-
function SingleComboBox({ items, selectedItem, defaultItem, name, disabled = false, prefix, error = false, creatable = false, placeholder = '', dropdownHelpMessage, isLoading, width = 'auto', dropdownWidth = 'auto', className = '', onChange, onChangeInput, onAdd, onSelect, onClear, onClearClick, onChangeSelected, decorators, ...props }) {
|
|
43
|
+
function SingleComboBox({ items, selectedItem, defaultItem, name, disabled = false, required = false, prefix, error = false, creatable = false, placeholder = '', dropdownHelpMessage, isLoading, width = 'auto', dropdownWidth = 'auto', className = '', onChange, onChangeInput, onAdd, onSelect, onClear, onClearClick, onChangeSelected, decorators, inputAttributes, ...props }) {
|
|
40
44
|
const theme = (0, useTheme_1.useTheme)();
|
|
41
45
|
const classNames = (0, useClassNames_1.useSingleComboBoxClassNames)();
|
|
42
46
|
const outerRef = (0, react_1.useRef)(null);
|
|
@@ -85,7 +89,7 @@ function SingleComboBox({ items, selectedItem, defaultItem, name, disabled = fal
|
|
|
85
89
|
setIsExpanded(false);
|
|
86
90
|
setIsEditing(false);
|
|
87
91
|
if (!selectedItem && defaultItem) {
|
|
88
|
-
setInputValue(defaultItem.label);
|
|
92
|
+
setInputValue((0, react_innertext_1.default)(defaultItem.label));
|
|
89
93
|
onSelect && onSelect(defaultItem);
|
|
90
94
|
}
|
|
91
95
|
}, [selectedItem, defaultItem, onSelect]);
|
|
@@ -182,7 +186,7 @@ function SingleComboBox({ items, selectedItem, defaultItem, name, disabled = fal
|
|
|
182
186
|
}, [unfocus]));
|
|
183
187
|
(0, react_1.useEffect)(() => {
|
|
184
188
|
if (selectedItem) {
|
|
185
|
-
setInputValue(selectedItem.label);
|
|
189
|
+
setInputValue((0, react_innertext_1.default)(selectedItem.label));
|
|
186
190
|
}
|
|
187
191
|
else {
|
|
188
192
|
setInputValue('');
|
|
@@ -200,7 +204,7 @@ function SingleComboBox({ items, selectedItem, defaultItem, name, disabled = fal
|
|
|
200
204
|
}), [classNames.listBox]);
|
|
201
205
|
return (react_1.default.createElement(ComboBoxContext_1.ComboBoxContext.Provider, { value: contextValue },
|
|
202
206
|
react_1.default.createElement(Container, { ...props, ref: outerRef, className: `${disabled ? 'disabled' : ''} ${className} ${classNames.wrapper}`, "$width": width, role: "combobox", "aria-haspopup": "listbox", "aria-controls": listBoxId, "aria-expanded": isFocused, "aria-invalid": error || undefined },
|
|
203
|
-
react_1.default.createElement(StyledInput, { placeholder: placeholder, type: "text", name: name, value: inputValue, disabled: disabled, prefix: prefix, error: error, suffix: react_1.default.createElement(react_1.default.Fragment, null,
|
|
207
|
+
react_1.default.createElement(StyledInput, { ...inputAttributes, placeholder: placeholder, type: "text", name: name, value: inputValue, disabled: disabled, required: required, prefix: prefix, error: error, suffix: react_1.default.createElement(react_1.default.Fragment, null,
|
|
204
208
|
react_1.default.createElement(ClearButton, { type: "button", onClick: onClickClear, ref: clearButtonRef, themes: theme, className: `${needsClearButton ? '' : 'hidden'} ${classNames.clearButton}` },
|
|
205
209
|
react_1.default.createElement(Icon_1.FaTimesCircleIcon, { color: theme.color.TEXT_BLACK, alt: decorators?.destroyButtonIconAlt?.(DESTROY_BUTTON_TEXT) || DESTROY_BUTTON_TEXT })),
|
|
206
210
|
react_1.default.createElement(CaretDownLayout, { themes: theme, onClick: onClickInput },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SingleComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/SingleComboBox.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SingleComboBox.js","sourceRoot":"","sources":["../../../src/components/ComboBox/SingleComboBox.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import React, { ChangeEvent, ReactNode } from 'react';
|
|
1
2
|
export type ComboBoxItem<T> = {
|
|
2
3
|
value: string;
|
|
3
|
-
label:
|
|
4
|
+
label: React.ReactNode;
|
|
4
5
|
disabled?: boolean;
|
|
5
6
|
data?: T;
|
|
6
7
|
};
|
|
@@ -10,3 +11,70 @@ export type ComboBoxOption<T> = {
|
|
|
10
11
|
isNew: boolean;
|
|
11
12
|
item: ComboBoxItem<T>;
|
|
12
13
|
};
|
|
14
|
+
export type BaseProps<T> = {
|
|
15
|
+
/**
|
|
16
|
+
* 選択可能なアイテムのリスト
|
|
17
|
+
*/
|
|
18
|
+
items: Array<ComboBoxItem<T>>;
|
|
19
|
+
/**
|
|
20
|
+
* input 要素の `name` 属性の値
|
|
21
|
+
*/
|
|
22
|
+
name?: string;
|
|
23
|
+
/**
|
|
24
|
+
* input 要素の `disabled` 属性の値
|
|
25
|
+
*/
|
|
26
|
+
disabled?: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* input 要素の `required` 属性の値
|
|
29
|
+
*/
|
|
30
|
+
required?: boolean;
|
|
31
|
+
/**
|
|
32
|
+
* コンポーネント内の一番外側の要素に適用するクラス名
|
|
33
|
+
*/
|
|
34
|
+
className?: string;
|
|
35
|
+
/**
|
|
36
|
+
* `true` のとき、コンポーネントの外枠が `DANGER` カラーになる
|
|
37
|
+
*/
|
|
38
|
+
error?: boolean;
|
|
39
|
+
/**
|
|
40
|
+
* `true` のとき、 `items` 内に存在しないアイテムを新しく追加できるようになる
|
|
41
|
+
*/
|
|
42
|
+
creatable?: boolean;
|
|
43
|
+
/**
|
|
44
|
+
* input 要素の `placeholder` 属性の値
|
|
45
|
+
*/
|
|
46
|
+
placeholder?: string;
|
|
47
|
+
/**
|
|
48
|
+
* `true` のとき、ドロップダウンリスト内にローダーを表示する
|
|
49
|
+
*/
|
|
50
|
+
isLoading?: boolean;
|
|
51
|
+
/**
|
|
52
|
+
* input 要素の `width` スタイルに適用する値
|
|
53
|
+
*/
|
|
54
|
+
width?: number | string;
|
|
55
|
+
/**
|
|
56
|
+
* ドロップダウンリスト内に表示するヘルプメッセージ
|
|
57
|
+
*/
|
|
58
|
+
dropdownHelpMessage?: ReactNode;
|
|
59
|
+
/**
|
|
60
|
+
* ドロップダウンリストの `width` スタイルに適用する値
|
|
61
|
+
*/
|
|
62
|
+
dropdownWidth?: number | string;
|
|
63
|
+
/**
|
|
64
|
+
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
65
|
+
*/
|
|
66
|
+
onChangeInput?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
67
|
+
/**
|
|
68
|
+
* `items` 内に存在しないアイテムが追加されたときに発火するコールバック関数
|
|
69
|
+
*/
|
|
70
|
+
onAdd?: (label: ReactNode) => void;
|
|
71
|
+
/**
|
|
72
|
+
* アイテムが選択された時に発火するコールバック関数
|
|
73
|
+
*/
|
|
74
|
+
onSelect?: (item: ComboBoxItem<T>) => void;
|
|
75
|
+
/**
|
|
76
|
+
* input 要素の `value` が変わった時に発火するコールバック関数
|
|
77
|
+
* @deprecated `onChange` は非推奨なため、 代わりに `onChangeInput` を使用してください。
|
|
78
|
+
*/
|
|
79
|
+
onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
|
|
80
|
+
};
|
|
@@ -5,7 +5,7 @@ type Props<T> = {
|
|
|
5
5
|
options: Array<ComboBoxOption<T>>;
|
|
6
6
|
dropdownHelpMessage?: ReactNode;
|
|
7
7
|
dropdownWidth?: string | number;
|
|
8
|
-
onAdd?: (label:
|
|
8
|
+
onAdd?: (label: ReactNode) => void;
|
|
9
9
|
onSelect: (item: ComboBoxItem<T>) => void;
|
|
10
10
|
isExpanded: boolean;
|
|
11
11
|
isLoading?: boolean;
|
|
@@ -1,7 +1,11 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
2
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
6
|
exports.useOptions = void 0;
|
|
4
7
|
const react_1 = require("react");
|
|
8
|
+
const react_innertext_1 = __importDefault(require("react-innertext"));
|
|
5
9
|
const useId_1 = require("../../hooks/useId");
|
|
6
10
|
const comboBoxHelper_1 = require("./comboBoxHelper");
|
|
7
11
|
function useOptions({ items, selected, creatable, inputValue = '', isFilteringDisabled = false, }) {
|
|
@@ -44,7 +48,7 @@ function useOptions({ items, selected, creatable, inputValue = '', isFilteringDi
|
|
|
44
48
|
return allOptions.filter(({ item: { label } }) => {
|
|
45
49
|
if (!inputValue)
|
|
46
50
|
return true;
|
|
47
|
-
return (0, comboBoxHelper_1.convertMatchableString)(label).includes((0, comboBoxHelper_1.convertMatchableString)(inputValue));
|
|
51
|
+
return (0, comboBoxHelper_1.convertMatchableString)((0, react_innertext_1.default)(label)).includes((0, comboBoxHelper_1.convertMatchableString)(inputValue));
|
|
48
52
|
});
|
|
49
53
|
}, [allOptions, inputValue, isFilteringDisabled]);
|
|
50
54
|
return {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useOptions.js","sourceRoot":"","sources":["../../../src/components/ComboBox/useOptions.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useOptions.js","sourceRoot":"","sources":["../../../src/components/ComboBox/useOptions.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "smarthr-ui",
|
|
3
3
|
"description": "SmartHR ui components built with React.",
|
|
4
|
-
"version": "30.
|
|
4
|
+
"version": "30.7.0",
|
|
5
5
|
"author": "SmartHR-UI Team",
|
|
6
6
|
"dependencies": {
|
|
7
7
|
"@smarthr/wareki": "^1.2.0",
|
|
@@ -16,8 +16,8 @@
|
|
|
16
16
|
},
|
|
17
17
|
"devDependencies": {
|
|
18
18
|
"@babel/core": "^7.21.4",
|
|
19
|
-
"@commitlint/cli": "^17.
|
|
20
|
-
"@commitlint/config-conventional": "^17.
|
|
19
|
+
"@commitlint/cli": "^17.6.1",
|
|
20
|
+
"@commitlint/config-conventional": "^17.6.1",
|
|
21
21
|
"@storybook/addon-a11y": "^6.5.16",
|
|
22
22
|
"@storybook/addon-essentials": "^6.5.16",
|
|
23
23
|
"@storybook/addon-interactions": "^6.5.16",
|
|
@@ -31,14 +31,14 @@
|
|
|
31
31
|
"@storybook/test-runner": "^0.9.4",
|
|
32
32
|
"@storybook/testing-library": "^0.0.13",
|
|
33
33
|
"@storybook/theming": "^6.5.16",
|
|
34
|
-
"@swc/core": "^1.3.
|
|
35
|
-
"@swc/jest": "^0.2.
|
|
34
|
+
"@swc/core": "^1.3.53",
|
|
35
|
+
"@swc/jest": "^0.2.26",
|
|
36
36
|
"@testing-library/react-hooks": "^8.0.1",
|
|
37
|
-
"@types/jest": "^29.5.
|
|
37
|
+
"@types/jest": "^29.5.1",
|
|
38
38
|
"@types/lodash.merge": "^4.6.7",
|
|
39
39
|
"@types/lodash.range": "^3.2.7",
|
|
40
40
|
"@types/node": "^14.18.42",
|
|
41
|
-
"@types/react": "^18.0.
|
|
41
|
+
"@types/react": "^18.0.38",
|
|
42
42
|
"@types/react-dom": "^18.0.11",
|
|
43
43
|
"@types/react-test-renderer": "^17.0.2",
|
|
44
44
|
"@types/react-transition-group": "^4.4.5",
|
|
@@ -52,6 +52,7 @@
|
|
|
52
52
|
"eslint": "^8.36.0",
|
|
53
53
|
"eslint-config-smarthr": "^6.8.3",
|
|
54
54
|
"fs-extra": "^11.1.1",
|
|
55
|
+
"glob": "^9.3.5",
|
|
55
56
|
"http-server": "^14.1.1",
|
|
56
57
|
"husky": "^8.0.3",
|
|
57
58
|
"jest": "^29.5.0",
|
|
@@ -62,7 +63,7 @@
|
|
|
62
63
|
"npm-run-all": "^4.1.5",
|
|
63
64
|
"postcss-jsx": "^0.36.4",
|
|
64
65
|
"postcss-syntax": "^0.36.2",
|
|
65
|
-
"prettier": "^2.8.
|
|
66
|
+
"prettier": "^2.8.8",
|
|
66
67
|
"prettier-config-smarthr": "^1.0.0",
|
|
67
68
|
"puppeteer": "^19.8.5",
|
|
68
69
|
"react": "^18.2.0",
|
|
@@ -72,7 +73,7 @@
|
|
|
72
73
|
"smarthr-normalize-css": "^1.1.0",
|
|
73
74
|
"standard-version": "^9.3.2",
|
|
74
75
|
"storycap": "^4.0.0",
|
|
75
|
-
"styled-components": "^5.3.
|
|
76
|
+
"styled-components": "^5.3.10",
|
|
76
77
|
"styled-reset": "^4.4.6",
|
|
77
78
|
"stylelint": "^15.3.0",
|
|
78
79
|
"stylelint-config-prettier": "^9.0.5",
|
|
@@ -149,16 +150,18 @@
|
|
|
149
150
|
"e2e": "ts-node scripts/e2e.ts",
|
|
150
151
|
"e2e:dev": "testcafe chrome --host localhost --skip-js-errors",
|
|
151
152
|
"prepare": "husky install",
|
|
152
|
-
"chromatic": "chromatic"
|
|
153
|
+
"chromatic": "chromatic",
|
|
154
|
+
"write:ui-props": "ts-node scripts/exportUIProps.ts",
|
|
155
|
+
"export:ui-props": "run-s build:lib write:ui-props"
|
|
153
156
|
},
|
|
154
157
|
"sideEffects": false,
|
|
155
158
|
"typings": "lib/index.d.ts",
|
|
156
159
|
"resolutions": {
|
|
157
160
|
"@babel/helper-compilation-targets": "^7.20.7",
|
|
158
|
-
"@types/react": "^18.0.
|
|
161
|
+
"@types/react": "^18.0.38",
|
|
159
162
|
"minimist": "1.2.8",
|
|
160
163
|
"react": "^18.2.0",
|
|
161
164
|
"react-dom": "^18.2.0",
|
|
162
|
-
"stylelint/postcss": "8.4.
|
|
165
|
+
"stylelint/postcss": "8.4.23"
|
|
163
166
|
}
|
|
164
167
|
}
|