phx-react 1.3.392 → 1.3.393
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/cjs/components/SelectBox/SelectBox.d.ts +2 -2
- package/dist/cjs/components/SelectBox/SelectBox.js +7 -6
- package/dist/cjs/components/SelectBox/SelectBox.js.map +1 -1
- package/dist/esm/components/SelectBox/SelectBox.d.ts +2 -2
- package/dist/esm/components/SelectBox/SelectBox.js +8 -7
- package/dist/esm/components/SelectBox/SelectBox.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
type TData = {
|
|
3
|
-
id:
|
|
3
|
+
id: any;
|
|
4
4
|
value: string;
|
|
5
5
|
};
|
|
6
6
|
type TInputSelectSearch = {
|
|
7
7
|
data: Array<TData>;
|
|
8
8
|
label: string;
|
|
9
|
-
setValue: React.Dispatch<React.SetStateAction<any>>;
|
|
10
9
|
defaultValue?: TData;
|
|
10
|
+
onChange(value: any): void;
|
|
11
11
|
};
|
|
12
12
|
export declare const PHXSelectBox: (props: TInputSelectSearch) => React.JSX.Element;
|
|
13
13
|
export {};
|
|
@@ -13,7 +13,7 @@ function classNames() {
|
|
|
13
13
|
return classes.filter(Boolean).join(' ');
|
|
14
14
|
}
|
|
15
15
|
var PHXSelectBox = function (props) {
|
|
16
|
-
var data = props.data, defaultValue = props.defaultValue, label = props.label,
|
|
16
|
+
var data = props.data, defaultValue = props.defaultValue, label = props.label, onChange = props.onChange;
|
|
17
17
|
var _a = (0, react_2.useState)(''), query = _a[0], setQuery = _a[1];
|
|
18
18
|
var comboBtn = (0, react_2.useRef)(null);
|
|
19
19
|
var _b = (0, react_2.useState)(defaultValue ? defaultValue : null), selectedPerson = _b[0], setSelectedPerson = _b[1];
|
|
@@ -22,10 +22,11 @@ var PHXSelectBox = function (props) {
|
|
|
22
22
|
var _a;
|
|
23
23
|
(_a = comboBtn.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
24
24
|
};
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
25
|
+
var onChangeValue = function (value) {
|
|
26
|
+
setSelectedPerson(value);
|
|
27
|
+
onChange(value);
|
|
28
|
+
};
|
|
29
|
+
return (react_2["default"].createElement(react_1.Combobox, { as: 'div', onChange: onChangeValue, value: selectedPerson },
|
|
29
30
|
react_2["default"].createElement(react_1.Combobox.Label, { className: 'mb-1 flex text-xs font-normal text-gray-700' }, label),
|
|
30
31
|
react_2["default"].createElement("div", { className: 'relative' },
|
|
31
32
|
react_2["default"].createElement(react_1.Combobox.Input, { className: classNames('block w-full rounded-lg border border-gray-500 px-3 py-1.5 text-xs font-light shadow-sm hover:bg-gray-50 focus:border-gray-500 focus:bg-gray-50 focus:outline-none focus:outline-offset-1 focus:outline-indigo-500 focus:ring-transparent', filteredPeople.length === 0
|
|
@@ -33,7 +34,7 @@ var PHXSelectBox = function (props) {
|
|
|
33
34
|
: ''), displayValue: function (person) { return person === null || person === void 0 ? void 0 : person.value; }, onChange: function (event) { return setQuery(event.target.value); }, onFocus: function () { return handlerFocusInput(); } }),
|
|
34
35
|
react_2["default"].createElement(react_1.Combobox.Button, { ref: comboBtn, className: 'hidden' },
|
|
35
36
|
react_2["default"].createElement(solid_1.ChevronUpDownIcon, { "aria-hidden": 'true', className: 'h-5 w-5 text-gray-400' })),
|
|
36
|
-
filteredPeople.length > 0 && (react_2["default"].createElement(react_1.Combobox.Options, { className: '
|
|
37
|
+
filteredPeople.length > 0 && (react_2["default"].createElement(react_1.Combobox.Options, { className: 'fixed z-10 mt-2 max-h-60 w-fit overflow-auto rounded-lg bg-white px-2 py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm' }, filteredPeople.map(function (person) { return (react_2["default"].createElement(react_1.Combobox.Option, { key: person.id, className: function (_a) {
|
|
37
38
|
var active = _a.active;
|
|
38
39
|
return classNames('relative mb-1 cursor-pointer select-none rounded-lg py-2 pl-3 pr-9', person.id === (selectedPerson === null || selectedPerson === void 0 ? void 0 : selectedPerson.id) ? 'bg-zinc-200' : 'text-gray-900 ', active ? 'bg-zinc-100' : 'text-gray-900 ');
|
|
39
40
|
}, value: person }, function (_a) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectBox.js","sourceRoot":"","sources":["../../../../src/components/SelectBox/SelectBox.tsx"],"names":[],"mappings":";;;;AAAA,2CAA4C;AAC5C,mDAAwE;AACxE,
|
|
1
|
+
{"version":3,"file":"SelectBox.js","sourceRoot":"","sources":["../../../../src/components/SelectBox/SelectBox.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
type TData = {
|
|
3
|
-
id:
|
|
3
|
+
id: any;
|
|
4
4
|
value: string;
|
|
5
5
|
};
|
|
6
6
|
type TInputSelectSearch = {
|
|
7
7
|
data: Array<TData>;
|
|
8
8
|
label: string;
|
|
9
|
-
setValue: React.Dispatch<React.SetStateAction<any>>;
|
|
10
9
|
defaultValue?: TData;
|
|
10
|
+
onChange(value: any): void;
|
|
11
11
|
};
|
|
12
12
|
export declare const PHXSelectBox: (props: TInputSelectSearch) => React.JSX.Element;
|
|
13
13
|
export {};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Combobox } from '@headlessui/react';
|
|
2
2
|
import { CheckIcon, ChevronUpDownIcon } from '@heroicons/react/24/solid';
|
|
3
|
-
import React, {
|
|
3
|
+
import React, { useRef, useState } from 'react';
|
|
4
4
|
function classNames() {
|
|
5
5
|
var classes = [];
|
|
6
6
|
for (var _i = 0; _i < arguments.length; _i++) {
|
|
@@ -9,7 +9,7 @@ function classNames() {
|
|
|
9
9
|
return classes.filter(Boolean).join(' ');
|
|
10
10
|
}
|
|
11
11
|
export var PHXSelectBox = function (props) {
|
|
12
|
-
var data = props.data, defaultValue = props.defaultValue, label = props.label,
|
|
12
|
+
var data = props.data, defaultValue = props.defaultValue, label = props.label, onChange = props.onChange;
|
|
13
13
|
var _a = useState(''), query = _a[0], setQuery = _a[1];
|
|
14
14
|
var comboBtn = useRef(null);
|
|
15
15
|
var _b = useState(defaultValue ? defaultValue : null), selectedPerson = _b[0], setSelectedPerson = _b[1];
|
|
@@ -18,10 +18,11 @@ export var PHXSelectBox = function (props) {
|
|
|
18
18
|
var _a;
|
|
19
19
|
(_a = comboBtn.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
20
20
|
};
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
21
|
+
var onChangeValue = function (value) {
|
|
22
|
+
setSelectedPerson(value);
|
|
23
|
+
onChange(value);
|
|
24
|
+
};
|
|
25
|
+
return (React.createElement(Combobox, { as: 'div', onChange: onChangeValue, value: selectedPerson },
|
|
25
26
|
React.createElement(Combobox.Label, { className: 'mb-1 flex text-xs font-normal text-gray-700' }, label),
|
|
26
27
|
React.createElement("div", { className: 'relative' },
|
|
27
28
|
React.createElement(Combobox.Input, { className: classNames('block w-full rounded-lg border border-gray-500 px-3 py-1.5 text-xs font-light shadow-sm hover:bg-gray-50 focus:border-gray-500 focus:bg-gray-50 focus:outline-none focus:outline-offset-1 focus:outline-indigo-500 focus:ring-transparent', filteredPeople.length === 0
|
|
@@ -29,7 +30,7 @@ export var PHXSelectBox = function (props) {
|
|
|
29
30
|
: ''), displayValue: function (person) { return person === null || person === void 0 ? void 0 : person.value; }, onChange: function (event) { return setQuery(event.target.value); }, onFocus: function () { return handlerFocusInput(); } }),
|
|
30
31
|
React.createElement(Combobox.Button, { ref: comboBtn, className: 'hidden' },
|
|
31
32
|
React.createElement(ChevronUpDownIcon, { "aria-hidden": 'true', className: 'h-5 w-5 text-gray-400' })),
|
|
32
|
-
filteredPeople.length > 0 && (React.createElement(Combobox.Options, { className: '
|
|
33
|
+
filteredPeople.length > 0 && (React.createElement(Combobox.Options, { className: 'fixed z-10 mt-2 max-h-60 w-fit overflow-auto rounded-lg bg-white px-2 py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none sm:text-sm' }, filteredPeople.map(function (person) { return (React.createElement(Combobox.Option, { key: person.id, className: function (_a) {
|
|
33
34
|
var active = _a.active;
|
|
34
35
|
return classNames('relative mb-1 cursor-pointer select-none rounded-lg py-2 pl-3 pr-9', person.id === (selectedPerson === null || selectedPerson === void 0 ? void 0 : selectedPerson.id) ? 'bg-zinc-200' : 'text-gray-900 ', active ? 'bg-zinc-100' : 'text-gray-900 ');
|
|
35
36
|
}, value: person }, function (_a) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectBox.js","sourceRoot":"","sources":["../../../../src/components/SelectBox/SelectBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAA;AACxE,OAAO,KAAK,EAAE,EAAE,
|
|
1
|
+
{"version":3,"file":"SelectBox.js","sourceRoot":"","sources":["../../../../src/components/SelectBox/SelectBox.tsx"],"names":[],"mappings":"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"}
|