@cuemath/leap 3.2.21-as111 → 3.2.21-as222
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.
@@ -1,117 +1,124 @@
|
|
1
|
-
import { jsxs as
|
2
|
-
import { useMemo as
|
3
|
-
import
|
4
|
-
import
|
5
|
-
import
|
6
|
-
import { Input as
|
7
|
-
import { Container as
|
8
|
-
import
|
9
|
-
import
|
10
|
-
const
|
1
|
+
import { jsxs as V, jsx as t } from "react/jsx-runtime";
|
2
|
+
import { useMemo as G, useRef as A, useCallback as d } from "react";
|
3
|
+
import J from "../../../../assets/line-icons/icons/cross.js";
|
4
|
+
import K from "../../hooks/use-context-menu-click-handler.js";
|
5
|
+
import N from "../base-input/base-input.js";
|
6
|
+
import { Input as P } from "../text-input/text-input-styled.js";
|
7
|
+
import { Container as Q, OptionsContainer as U, OptionsWrapper as Y, StyledChevronDownIcon as Z, StyledDownIcon as _ } from "./base-select-input-styled.js";
|
8
|
+
import ee from "./select-option/select-option.js";
|
9
|
+
import ne from "./select-section/select-section.js";
|
10
|
+
const he = (E) => {
|
11
11
|
const {
|
12
|
-
label:
|
12
|
+
label: g,
|
13
13
|
value: r,
|
14
14
|
options: u,
|
15
15
|
searchable: n = !1,
|
16
|
-
searchText:
|
17
|
-
onCloseWithoutSelection:
|
18
|
-
onSearchTextChange:
|
19
|
-
onChange:
|
16
|
+
searchText: b,
|
17
|
+
onCloseWithoutSelection: L,
|
18
|
+
onSearchTextChange: i,
|
19
|
+
onChange: v,
|
20
20
|
renderAs: h,
|
21
|
-
width:
|
22
|
-
widthX:
|
23
|
-
disabled:
|
24
|
-
willShowMessage:
|
25
|
-
mandatory:
|
26
|
-
size:
|
27
|
-
shape:
|
21
|
+
width: R,
|
22
|
+
widthX: j,
|
23
|
+
disabled: p,
|
24
|
+
willShowMessage: z,
|
25
|
+
mandatory: B,
|
26
|
+
size: w = "regular",
|
27
|
+
shape: m,
|
28
28
|
theme: f = "light",
|
29
29
|
isTransparent: S = !1,
|
30
|
-
renderOptionsAs:
|
31
|
-
errorMessage:
|
30
|
+
renderOptionsAs: I = "list",
|
31
|
+
errorMessage: D,
|
32
32
|
getSectionInputLabel: C
|
33
|
-
} =
|
33
|
+
} = E, s = I === "section-list" && u, l = I === "list" && u, $ = G(() => {
|
34
34
|
var e;
|
35
|
-
if (n) return
|
36
|
-
if (
|
37
|
-
|
38
|
-
|
35
|
+
if (n) return b;
|
36
|
+
if (s) {
|
37
|
+
let o, a;
|
38
|
+
for (const T of s) {
|
39
|
+
const y = T.data.find(({ id: q }) => q === r);
|
40
|
+
if (y) {
|
41
|
+
o = T, a = y;
|
42
|
+
break;
|
43
|
+
}
|
44
|
+
}
|
45
|
+
return o && C ? C(o, a) : (a == null ? void 0 : a.label) || "";
|
39
46
|
}
|
40
|
-
if (l) return (e = l.find((
|
41
|
-
}, [n,
|
42
|
-
|
47
|
+
if (l) return (e = l.find((o) => o.id === r)) == null ? void 0 : e.label;
|
48
|
+
}, [n, b, s, l, C, r]), k = A(null), x = A(null), { menuVisible: c, onMenuClick: F, hideMenu: M } = K(
|
49
|
+
k,
|
43
50
|
void 0,
|
44
51
|
!n,
|
45
|
-
|
46
|
-
|
47
|
-
),
|
52
|
+
L,
|
53
|
+
p
|
54
|
+
), W = d(
|
48
55
|
(e) => {
|
49
|
-
n &&
|
56
|
+
n && i && i(e.target.value);
|
50
57
|
},
|
51
|
-
[
|
52
|
-
),
|
53
|
-
(e,
|
54
|
-
M(),
|
58
|
+
[i, n]
|
59
|
+
), O = d(
|
60
|
+
(e, o) => {
|
61
|
+
M(), v(e, o);
|
55
62
|
},
|
56
|
-
[M,
|
57
|
-
),
|
63
|
+
[M, v]
|
64
|
+
), X = d((e) => {
|
58
65
|
e.target.select(), setTimeout(() => {
|
59
66
|
e.target.scrollIntoView({
|
60
67
|
behavior: "smooth"
|
61
68
|
});
|
62
69
|
}, 300);
|
63
|
-
}, []),
|
70
|
+
}, []), H = d(() => {
|
64
71
|
var e;
|
65
|
-
|
66
|
-
}, [
|
67
|
-
return /* @__PURE__ */
|
68
|
-
/* @__PURE__ */
|
69
|
-
|
72
|
+
i && (i(""), (e = x.current) == null || e.focus());
|
73
|
+
}, [i]);
|
74
|
+
return /* @__PURE__ */ V(Q, { ref: k, $width: R, $widthX: j, onClick: F, children: [
|
75
|
+
/* @__PURE__ */ t(
|
76
|
+
N,
|
70
77
|
{
|
71
78
|
renderAs: h,
|
72
|
-
label:
|
79
|
+
label: g,
|
73
80
|
stickyLabel: !0,
|
74
|
-
disabled:
|
75
|
-
willShowMessage:
|
76
|
-
size:
|
77
|
-
mandatory:
|
78
|
-
shape:
|
81
|
+
disabled: p,
|
82
|
+
willShowMessage: z,
|
83
|
+
size: w,
|
84
|
+
mandatory: B,
|
85
|
+
shape: m,
|
79
86
|
isTransparent: S,
|
80
|
-
inputElement: /* @__PURE__ */
|
81
|
-
|
87
|
+
inputElement: /* @__PURE__ */ t(
|
88
|
+
P,
|
82
89
|
{
|
83
|
-
ref:
|
90
|
+
ref: x,
|
84
91
|
$renderAs: h,
|
85
|
-
$size:
|
86
|
-
placeholder:
|
87
|
-
disabled:
|
92
|
+
$size: w,
|
93
|
+
placeholder: $ ? "" : g,
|
94
|
+
disabled: p,
|
88
95
|
readOnly: !n,
|
89
|
-
value:
|
90
|
-
onFocus: n ?
|
91
|
-
onChange: n ?
|
96
|
+
value: $ ?? "",
|
97
|
+
onFocus: n ? X : void 0,
|
98
|
+
onChange: n ? W : void 0,
|
92
99
|
$isTransparent: S
|
93
100
|
}
|
94
101
|
),
|
95
|
-
siblingElement: n &&
|
96
|
-
errorMessage:
|
102
|
+
siblingElement: n && c ? /* @__PURE__ */ t(J, { onClick: H }) : m === "curved" || m === "borderLess" ? /* @__PURE__ */ t(Z, { $menuVisible: c, pointerEvents: "none" }) : /* @__PURE__ */ t(_, { $menuVisible: c, pointerEvents: "none" }),
|
103
|
+
errorMessage: D
|
97
104
|
}
|
98
105
|
),
|
99
|
-
u.length > 0 && /* @__PURE__ */
|
100
|
-
|
101
|
-
|
106
|
+
u.length > 0 && /* @__PURE__ */ t(U, { $visible: c, children: /* @__PURE__ */ V(Y, { $renderAs: h, $theme: f, children: [
|
107
|
+
s && /* @__PURE__ */ t(
|
108
|
+
ne,
|
102
109
|
{
|
103
|
-
sectionOptions:
|
110
|
+
sectionOptions: s,
|
104
111
|
theme: f,
|
105
112
|
value: r,
|
106
|
-
onChange:
|
113
|
+
onChange: O
|
107
114
|
}
|
108
115
|
),
|
109
|
-
l && l.map((e) => /* @__PURE__ */
|
110
|
-
|
116
|
+
l && l.map((e) => /* @__PURE__ */ t(
|
117
|
+
ee,
|
111
118
|
{
|
112
119
|
option: e,
|
113
120
|
selected: e.id === r,
|
114
|
-
onChange:
|
121
|
+
onChange: O,
|
115
122
|
theme: f
|
116
123
|
},
|
117
124
|
e.id
|
@@ -120,6 +127,6 @@ const ue = (A) => {
|
|
120
127
|
] });
|
121
128
|
};
|
122
129
|
export {
|
123
|
-
|
130
|
+
he as default
|
124
131
|
};
|
125
132
|
//# sourceMappingURL=base-select-input.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"base-select-input.js","sources":["../../../../../src/features/ui/inputs/base-select-input/base-select-input.tsx"],"sourcesContent":["import type { ISectionOption } from '../../section-list/section-list-types';\nimport type { IBaseSelectInputProps, ISelectOption } from './base-select-input-types';\nimport type { ChangeEvent, FocusEvent, ReactElement } from 'react';\n\nimport { useCallback, useMemo, useRef } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport useContextMenuClickHandler from '../../hooks/use-context-menu-click-handler';\nimport BaseInput from '../base-input/base-input';\nimport { Input } from '../text-input/text-input-styled';\nimport * as Styled from './base-select-input-styled';\nimport SelectOption from './select-option/select-option';\nimport SelectSection from './select-section/select-section';\n\nconst BaseSelectInput = <IDType extends string | number>(\n props: IBaseSelectInputProps<IDType>,\n): ReactElement => {\n const {\n label,\n value,\n options,\n searchable = false,\n searchText,\n onCloseWithoutSelection,\n onSearchTextChange,\n onChange,\n renderAs,\n width,\n widthX,\n disabled,\n willShowMessage,\n mandatory,\n size = 'regular',\n shape,\n theme = 'light',\n isTransparent = false,\n renderOptionsAs = 'list',\n errorMessage,\n getSectionInputLabel,\n } = props;\n\n const sectionOptions =\n renderOptionsAs === 'section-list' && (options as ISectionOption<ISelectOption<IDType>>[]);\n const selectOptions = renderOptionsAs === 'list' && (options as ISelectOption<IDType>[]);\n\n const inputValue = useMemo(() => {\n if (searchable) return searchText;\n\n if (sectionOptions) {\n const section
|
1
|
+
{"version":3,"file":"base-select-input.js","sources":["../../../../../src/features/ui/inputs/base-select-input/base-select-input.tsx"],"sourcesContent":["import type { ISectionOption } from '../../section-list/section-list-types';\nimport type { IBaseSelectInputProps, ISelectOption } from './base-select-input-types';\nimport type { ChangeEvent, FocusEvent, ReactElement } from 'react';\n\nimport { useCallback, useMemo, useRef } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport useContextMenuClickHandler from '../../hooks/use-context-menu-click-handler';\nimport BaseInput from '../base-input/base-input';\nimport { Input } from '../text-input/text-input-styled';\nimport * as Styled from './base-select-input-styled';\nimport SelectOption from './select-option/select-option';\nimport SelectSection from './select-section/select-section';\n\nconst BaseSelectInput = <IDType extends string | number>(\n props: IBaseSelectInputProps<IDType>,\n): ReactElement => {\n const {\n label,\n value,\n options,\n searchable = false,\n searchText,\n onCloseWithoutSelection,\n onSearchTextChange,\n onChange,\n renderAs,\n width,\n widthX,\n disabled,\n willShowMessage,\n mandatory,\n size = 'regular',\n shape,\n theme = 'light',\n isTransparent = false,\n renderOptionsAs = 'list',\n errorMessage,\n getSectionInputLabel,\n } = props;\n\n const sectionOptions =\n renderOptionsAs === 'section-list' && (options as ISectionOption<ISelectOption<IDType>>[]);\n const selectOptions = renderOptionsAs === 'list' && (options as ISelectOption<IDType>[]);\n\n const inputValue = useMemo(() => {\n if (searchable) return searchText;\n\n if (sectionOptions) {\n let foundSection, foundOption;\n\n for (const section of sectionOptions) {\n const option = section.data.find(({ id }) => id === value);\n\n if (option) {\n foundSection = section;\n foundOption = option;\n\n break;\n }\n }\n\n if (foundSection && getSectionInputLabel)\n return getSectionInputLabel(foundSection, foundOption);\n\n return foundOption?.label || '';\n }\n\n if (selectOptions) return selectOptions.find(option => option.id === value)?.label;\n }, [searchable, searchText, sectionOptions, selectOptions, getSectionInputLabel, value]);\n\n const containerRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const inputRef = useRef<HTMLInputElement>(null) as React.RefObject<HTMLInputElement>;\n const { menuVisible, onMenuClick, hideMenu } = useContextMenuClickHandler(\n containerRef,\n undefined,\n !searchable,\n onCloseWithoutSelection,\n disabled,\n );\n\n const handleTextChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n if (searchable && onSearchTextChange) {\n onSearchTextChange(e.target.value);\n }\n },\n [onSearchTextChange, searchable],\n );\n\n const handleChange = useCallback<IBaseSelectInputProps<IDType>['onChange']>(\n (id, option) => {\n hideMenu();\n onChange(id, option);\n },\n [hideMenu, onChange],\n );\n\n const handleFocus = useCallback((e: FocusEvent<HTMLInputElement>) => {\n e.target.select();\n setTimeout(() => {\n e.target.scrollIntoView({\n behavior: 'smooth',\n });\n }, 300);\n }, []);\n\n const handleClear = useCallback(() => {\n if (onSearchTextChange) {\n onSearchTextChange('');\n inputRef.current?.focus();\n }\n }, [onSearchTextChange]);\n\n const downIcon =\n shape === 'curved' || shape === 'borderLess' ? (\n <Styled.StyledChevronDownIcon $menuVisible={menuVisible} pointerEvents=\"none\" />\n ) : (\n <Styled.StyledDownIcon $menuVisible={menuVisible} pointerEvents=\"none\" />\n );\n\n return (\n <Styled.Container ref={containerRef} $width={width} $widthX={widthX} onClick={onMenuClick}>\n <BaseInput\n renderAs={renderAs}\n label={label}\n stickyLabel={true}\n disabled={disabled}\n willShowMessage={willShowMessage}\n size={size}\n mandatory={mandatory}\n shape={shape}\n isTransparent={isTransparent}\n inputElement={\n <Input\n ref={inputRef}\n $renderAs={renderAs}\n $size={size}\n placeholder={inputValue ? '' : label}\n disabled={disabled}\n readOnly={!searchable}\n value={inputValue ?? ''}\n onFocus={searchable ? handleFocus : undefined}\n onChange={searchable ? handleTextChange : undefined}\n $isTransparent={isTransparent}\n />\n }\n siblingElement={searchable && menuVisible ? <CrossIcon onClick={handleClear} /> : downIcon}\n errorMessage={errorMessage}\n />\n\n {options.length > 0 && (\n <Styled.OptionsContainer $visible={menuVisible}>\n <Styled.OptionsWrapper $renderAs={renderAs} $theme={theme}>\n {sectionOptions && (\n <SelectSection<IDType>\n sectionOptions={sectionOptions}\n theme={theme}\n value={value}\n onChange={handleChange}\n />\n )}\n\n {selectOptions &&\n selectOptions.map(option => (\n <SelectOption<IDType>\n key={option.id}\n option={option}\n selected={option.id === value}\n onChange={handleChange}\n theme={theme}\n />\n ))}\n </Styled.OptionsWrapper>\n </Styled.OptionsContainer>\n )}\n </Styled.Container>\n );\n};\n\nexport default BaseSelectInput;\n"],"names":["BaseSelectInput","props","label","value","options","searchable","searchText","onCloseWithoutSelection","onSearchTextChange","onChange","renderAs","width","widthX","disabled","willShowMessage","mandatory","size","shape","theme","isTransparent","renderOptionsAs","errorMessage","getSectionInputLabel","sectionOptions","selectOptions","inputValue","useMemo","foundSection","foundOption","section","option","id","_a","containerRef","useRef","inputRef","menuVisible","onMenuClick","hideMenu","useContextMenuClickHandler","handleTextChange","useCallback","handleChange","handleFocus","handleClear","jsxs","Styled.Container","jsx","BaseInput","Input","CrossIcon","Styled.StyledChevronDownIcon","Styled.StyledDownIcon","Styled.OptionsContainer","Styled.OptionsWrapper","SelectSection","SelectOption"],"mappings":"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"}
|