@tecsinapse/cortex-react 1.2.2-beta.0 → 1.2.2-beta.2
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/BaseSnackbar.js +13 -0
- package/dist/cjs/components/Calendar.js +22 -0
- package/dist/cjs/components/CalendarCell.js +51 -0
- package/dist/cjs/components/CalendarGrid.js +23 -0
- package/dist/cjs/components/CalendarGridBodyRows.js +12 -0
- package/dist/cjs/components/CalendarGridHeaderRow.js +12 -0
- package/dist/cjs/components/CalendarHeader.js +40 -0
- package/dist/cjs/components/DefaultSnack.js +27 -0
- package/dist/cjs/components/GroupButton.js +2 -1
- package/dist/cjs/components/ProgressBar.js +2 -1
- package/dist/cjs/components/RangeCalendar.js +44 -0
- package/dist/cjs/components/SearchInput.js +19 -12
- package/dist/cjs/components/Select.js +4 -4
- package/dist/cjs/components/Skeleton.js +1 -0
- package/dist/cjs/components/Table.js +8 -14
- package/dist/cjs/hooks/useCalendar.js +27 -0
- package/dist/cjs/hooks/useCalendarCell.js +35 -0
- package/dist/cjs/hooks/useCalendarGrid.js +14 -0
- package/dist/cjs/index.js +35 -20
- package/dist/cjs/service/SnackbarSonner.js +54 -0
- package/dist/cjs/styles/calendar-cell.js +40 -0
- package/dist/esm/components/BaseSnackbar.js +11 -0
- package/dist/esm/components/Calendar.js +20 -0
- package/dist/esm/components/CalendarCell.js +49 -0
- package/dist/esm/components/CalendarGrid.js +21 -0
- package/dist/esm/components/CalendarGridBodyRows.js +10 -0
- package/dist/esm/components/CalendarGridHeaderRow.js +10 -0
- package/dist/esm/components/CalendarHeader.js +38 -0
- package/dist/esm/components/DefaultSnack.js +25 -0
- package/dist/esm/components/GroupButton.js +2 -1
- package/dist/esm/components/ProgressBar.js +2 -1
- package/dist/esm/components/RangeCalendar.js +42 -0
- package/dist/esm/components/SearchInput.js +19 -12
- package/dist/esm/components/Select.js +4 -4
- package/dist/esm/components/Skeleton.js +1 -0
- package/dist/esm/components/Table.js +9 -14
- package/dist/esm/hooks/useCalendar.js +25 -0
- package/dist/esm/hooks/useCalendarCell.js +33 -0
- package/dist/esm/hooks/useCalendarGrid.js +12 -0
- package/dist/esm/index.js +17 -9
- package/dist/esm/service/SnackbarSonner.js +52 -0
- package/dist/esm/styles/calendar-cell.js +38 -0
- package/dist/types/components/BaseSnackbar.d.ts +9 -0
- package/dist/types/components/Calendar.d.ts +6 -0
- package/dist/types/components/CalendarCell.d.ts +8 -0
- package/dist/types/components/CalendarGrid.d.ts +6 -0
- package/dist/types/components/CalendarGridBodyRows.d.ts +6 -0
- package/dist/types/components/CalendarGridHeaderRow.d.ts +5 -0
- package/dist/types/components/CalendarHeader.d.ts +6 -0
- package/dist/types/components/DefaultSnack.d.ts +6 -0
- package/dist/types/components/RangeCalendar.d.ts +10 -0
- package/dist/types/components/Table.d.ts +0 -1
- package/dist/types/components/index.d.ts +12 -9
- package/dist/types/hooks/index.d.ts +3 -0
- package/dist/types/hooks/useCalendar.d.ts +10 -0
- package/dist/types/hooks/useCalendarCell.d.ts +18 -0
- package/dist/types/hooks/useCalendarGrid.d.ts +10 -0
- package/dist/types/index.d.ts +2 -0
- package/dist/types/provider/SnackbarProvider.d.ts +10 -0
- package/dist/types/service/ISnackbar.d.ts +7 -0
- package/dist/types/service/SnackbarSonner.d.ts +7 -0
- package/dist/types/service/index.d.ts +2 -0
- package/dist/types/styles/calendar-cell.d.ts +199 -0
- package/dist/types/styles/index.d.ts +2 -1
- package/dist/types/tests/Calendar.test.d.ts +1 -0
- package/dist/types/tests/CalendarCell.test.d.ts +1 -0
- package/dist/types/tests/CalendarGridBodyRows.test.d.ts +1 -0
- package/dist/types/tests/CalendarGridHeaderRow.test.d.ts +1 -0
- package/dist/types/tests/CalendarHeader.test.d.ts +1 -0
- package/dist/types/tests/DefaultSnack.test.d.ts +1 -0
- package/dist/types/tests/SearchInput.test.d.ts +1 -0
- package/dist/types/tests/Select.test.d.ts +1 -0
- package/dist/types/tests/Skeleton.test.d.ts +1 -0
- package/dist/types/tests/Snackbar.test.d.ts +1 -0
- package/dist/types/tests/Table.test.d.ts +1 -0
- package/dist/types/tests/useCalendarCell.test.d.ts +1 -0
- package/dist/types/tests/useDebouncedState.test.d.ts +1 -0
- package/package.json +7 -4
- package/dist/cjs/components/Snackbar.js +0 -18
- package/dist/esm/components/Snackbar.js +0 -16
- package/dist/types/components/Snackbar.d.ts +0 -9
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var cortexCore = require('@tecsinapse/cortex-core');
|
|
5
|
+
|
|
6
|
+
const BaseSnackbar = React.forwardRef(
|
|
7
|
+
(props, ref) => {
|
|
8
|
+
const { children, show, variants } = props;
|
|
9
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, show ? /* @__PURE__ */ React.createElement("div", { className: cortexCore.snackbar(variants), ref, "data-testid": "snackbar" }, children) : /* @__PURE__ */ React.createElement(React.Fragment, null));
|
|
10
|
+
}
|
|
11
|
+
);
|
|
12
|
+
|
|
13
|
+
exports.BaseSnackbar = BaseSnackbar;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var useCalendar = require('../hooks/useCalendar.js');
|
|
5
|
+
require('@internationalized/date');
|
|
6
|
+
require('react-aria');
|
|
7
|
+
var CalendarGrid = require('./CalendarGrid.js');
|
|
8
|
+
var CalendarHeader = require('./CalendarHeader.js');
|
|
9
|
+
|
|
10
|
+
const Calendar = ({ value, onChange }) => {
|
|
11
|
+
const { calendarProps, title, state } = useCalendar.useCalendar({ value, onChange });
|
|
12
|
+
return /* @__PURE__ */ React.createElement("div", { ...calendarProps, className: "calendar", "data-testid": "calendar-div" }, /* @__PURE__ */ React.createElement(
|
|
13
|
+
CalendarHeader.CalendarHeader,
|
|
14
|
+
{
|
|
15
|
+
onClickPrevButton: () => state.focusPreviousPage(),
|
|
16
|
+
onClickNextButton: () => state.focusNextPage(),
|
|
17
|
+
title
|
|
18
|
+
}
|
|
19
|
+
), /* @__PURE__ */ React.createElement(CalendarGrid.CalendarGrid, { state }));
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
exports.Calendar = Calendar;
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
require('@internationalized/date');
|
|
5
|
+
require('react-aria');
|
|
6
|
+
require('react-stately');
|
|
7
|
+
var useCalendarCell = require('../hooks/useCalendarCell.js');
|
|
8
|
+
var calendarCell = require('../styles/calendar-cell.js');
|
|
9
|
+
require('../styles/groupButton.js');
|
|
10
|
+
require('../styles/progressBar.js');
|
|
11
|
+
var Table = require('./Table.js');
|
|
12
|
+
|
|
13
|
+
const { cell, button } = calendarCell.calendarCell();
|
|
14
|
+
const CalendarCell = ({ state, date }) => {
|
|
15
|
+
const {
|
|
16
|
+
ref,
|
|
17
|
+
cellProps,
|
|
18
|
+
buttonProps,
|
|
19
|
+
isSelected,
|
|
20
|
+
isOutsideVisibleRange,
|
|
21
|
+
formattedDate,
|
|
22
|
+
isSelectionStart,
|
|
23
|
+
isSelectionEnd,
|
|
24
|
+
inRange
|
|
25
|
+
} = useCalendarCell.useCalendarCell({ state, date });
|
|
26
|
+
return /* @__PURE__ */ React.createElement(
|
|
27
|
+
Table.Td,
|
|
28
|
+
{
|
|
29
|
+
...cellProps,
|
|
30
|
+
"data-testid": "calendar-cell-td",
|
|
31
|
+
className: cell({
|
|
32
|
+
isOutsideVisibleRange,
|
|
33
|
+
isSelected,
|
|
34
|
+
isSelectionStart,
|
|
35
|
+
isSelectionEnd,
|
|
36
|
+
inRange
|
|
37
|
+
})
|
|
38
|
+
},
|
|
39
|
+
/* @__PURE__ */ React.createElement(
|
|
40
|
+
"div",
|
|
41
|
+
{
|
|
42
|
+
...buttonProps,
|
|
43
|
+
ref,
|
|
44
|
+
className: button({ isOutsideVisibleRange })
|
|
45
|
+
},
|
|
46
|
+
formattedDate
|
|
47
|
+
)
|
|
48
|
+
);
|
|
49
|
+
};
|
|
50
|
+
|
|
51
|
+
exports.CalendarCell = CalendarCell;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
require('@internationalized/date');
|
|
5
|
+
require('react-aria');
|
|
6
|
+
require('react-stately');
|
|
7
|
+
var useCalendarGrid = require('../hooks/useCalendarGrid.js');
|
|
8
|
+
var CalendarGridBodyRows = require('./CalendarGridBodyRows.js');
|
|
9
|
+
var CalendarGridHeaderRow = require('./CalendarGridHeaderRow.js');
|
|
10
|
+
|
|
11
|
+
const CalendarGrid = ({ state }) => {
|
|
12
|
+
const { gridProps, headerProps, weekDays } = useCalendarGrid.useCalendarGrid({ state });
|
|
13
|
+
return /* @__PURE__ */ React.createElement(
|
|
14
|
+
"div",
|
|
15
|
+
{
|
|
16
|
+
className: "bg-white rounded-micro px-deca py-mili",
|
|
17
|
+
"data-testid": "calendar-grid"
|
|
18
|
+
},
|
|
19
|
+
/* @__PURE__ */ React.createElement("table", { ...gridProps, className: "border-separate border-spacing-y-nano" }, /* @__PURE__ */ React.createElement("thead", { ...headerProps }, /* @__PURE__ */ React.createElement(CalendarGridHeaderRow.CalendarGridHeaderRow, { weekDays })), /* @__PURE__ */ React.createElement("tbody", null, /* @__PURE__ */ React.createElement(CalendarGridBodyRows.CalendarGridBodyRows, { state })))
|
|
20
|
+
);
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
exports.CalendarGrid = CalendarGrid;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var CalendarCell = require('./CalendarCell.js');
|
|
5
|
+
|
|
6
|
+
const CalendarGridBodyRows = ({ state }) => {
|
|
7
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, [...new Array(6).keys()].map((weekIndex) => /* @__PURE__ */ React.createElement("tr", { key: weekIndex, className: "shadow-0 px-deca" }, state.getDatesInWeek(weekIndex).map((date, i) => {
|
|
8
|
+
return date ? /* @__PURE__ */ React.createElement(CalendarCell.CalendarCell, { key: i, state, date }) : /* @__PURE__ */ React.createElement("td", { key: i });
|
|
9
|
+
}))));
|
|
10
|
+
};
|
|
11
|
+
|
|
12
|
+
exports.CalendarGridBodyRows = CalendarGridBodyRows;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var Table = require('./Table.js');
|
|
5
|
+
|
|
6
|
+
const CalendarGridHeaderRow = ({
|
|
7
|
+
weekDays
|
|
8
|
+
}) => {
|
|
9
|
+
return /* @__PURE__ */ React.createElement("tr", { "data-testid": "calendar-grid-header-row" }, weekDays.map((day, index) => /* @__PURE__ */ React.createElement(Table.THeadCell, { key: index }, day)));
|
|
10
|
+
};
|
|
11
|
+
|
|
12
|
+
exports.CalendarGridHeaderRow = CalendarGridHeaderRow;
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var fa = require('react-icons/fa');
|
|
5
|
+
var Button = require('./Button.js');
|
|
6
|
+
|
|
7
|
+
const CalendarHeader = ({
|
|
8
|
+
onClickPrevButton,
|
|
9
|
+
onClickNextButton,
|
|
10
|
+
title
|
|
11
|
+
}) => {
|
|
12
|
+
return /* @__PURE__ */ React.createElement(
|
|
13
|
+
"div",
|
|
14
|
+
{
|
|
15
|
+
className: "flex flex-row justify-between items-center gap-x-deca bg-miscellaneous-body p-mili",
|
|
16
|
+
"data-testid": "calendar-header"
|
|
17
|
+
},
|
|
18
|
+
/* @__PURE__ */ React.createElement(
|
|
19
|
+
Button.Button,
|
|
20
|
+
{
|
|
21
|
+
onClick: onClickPrevButton,
|
|
22
|
+
variants: { variant: "text", intent: "secondary", size: "small" },
|
|
23
|
+
"data-testid": "calendar-header-prev-button"
|
|
24
|
+
},
|
|
25
|
+
/* @__PURE__ */ React.createElement(fa.FaChevronLeft, null)
|
|
26
|
+
),
|
|
27
|
+
/* @__PURE__ */ React.createElement("span", { className: "font-bold capitalize" }, title),
|
|
28
|
+
/* @__PURE__ */ React.createElement(
|
|
29
|
+
Button.Button,
|
|
30
|
+
{
|
|
31
|
+
onClick: onClickNextButton,
|
|
32
|
+
variants: { variant: "text", intent: "secondary", size: "small" },
|
|
33
|
+
"data-testid": "calendar-header-next-button"
|
|
34
|
+
},
|
|
35
|
+
/* @__PURE__ */ React.createElement(fa.FaChevronRight, null)
|
|
36
|
+
)
|
|
37
|
+
);
|
|
38
|
+
};
|
|
39
|
+
|
|
40
|
+
exports.CalendarHeader = CalendarHeader;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var React = require('react');
|
|
4
|
+
var BaseSnackbar = require('./BaseSnackbar.js');
|
|
5
|
+
var io = require('react-icons/io');
|
|
6
|
+
|
|
7
|
+
const DefaultSnack = ({
|
|
8
|
+
text,
|
|
9
|
+
onDismiss,
|
|
10
|
+
variants
|
|
11
|
+
}) => /* @__PURE__ */ React.createElement(BaseSnackbar.BaseSnackbar, { show: true, variants: { intent: variants?.intent } }, /* @__PURE__ */ React.createElement("div", { className: "flex justify-between items-center flex-row gap-x-mili" }, /* @__PURE__ */ React.createElement(
|
|
12
|
+
io.IoMdInformationCircleOutline,
|
|
13
|
+
{
|
|
14
|
+
className: "w-[20px] h-[20px] shrink-0",
|
|
15
|
+
"data-testid": "icon-info"
|
|
16
|
+
}
|
|
17
|
+
), /* @__PURE__ */ React.createElement("p", null, text), /* @__PURE__ */ React.createElement(
|
|
18
|
+
io.IoMdClose,
|
|
19
|
+
{
|
|
20
|
+
"data-testid": "icon-close",
|
|
21
|
+
onClick: onDismiss,
|
|
22
|
+
size: 24,
|
|
23
|
+
className: "cursor-pointer w-[20px] h-[20px] shrink-0"
|
|
24
|
+
}
|
|
25
|
+
)));
|
|
26
|
+
|
|
27
|
+
exports.DefaultSnack = DefaultSnack;
|
|
@@ -2,8 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
var clsx = require('clsx');
|
|
4
4
|
var React = require('react');
|
|
5
|
-
require('../styles/
|
|
5
|
+
require('../styles/calendar-cell.js');
|
|
6
6
|
var groupButton = require('../styles/groupButton.js');
|
|
7
|
+
require('../styles/progressBar.js');
|
|
7
8
|
|
|
8
9
|
const { button, container, active, inactive, firstButton, lastButton } = groupButton.groupButton();
|
|
9
10
|
const GroupButton = (props) => {
|
|
@@ -2,8 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
var clsx = require('clsx');
|
|
4
4
|
var React = require('react');
|
|
5
|
-
|
|
5
|
+
require('../styles/calendar-cell.js');
|
|
6
6
|
require('../styles/groupButton.js');
|
|
7
|
+
var progressBar = require('../styles/progressBar.js');
|
|
7
8
|
|
|
8
9
|
const ProgressBar = ({
|
|
9
10
|
segments: _segments = 1,
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var date = require('@internationalized/date');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
var reactAria = require('react-aria');
|
|
6
|
+
var reactStately = require('react-stately');
|
|
7
|
+
var CalendarGrid = require('./CalendarGrid.js');
|
|
8
|
+
var CalendarHeader = require('./CalendarHeader.js');
|
|
9
|
+
|
|
10
|
+
const RangeCalendar = ({ value, onChange }) => {
|
|
11
|
+
const { locale } = reactAria.useLocale();
|
|
12
|
+
const state = reactStately.useRangeCalendarState({
|
|
13
|
+
locale,
|
|
14
|
+
createCalendar: date.createCalendar,
|
|
15
|
+
defaultValue: {
|
|
16
|
+
start: new date.CalendarDate(
|
|
17
|
+
value.start.getFullYear(),
|
|
18
|
+
value.start.getMonth(),
|
|
19
|
+
value.start.getDate()
|
|
20
|
+
),
|
|
21
|
+
end: new date.CalendarDate(
|
|
22
|
+
value.end.getFullYear(),
|
|
23
|
+
value.end.getMonth(),
|
|
24
|
+
value.end.getDate()
|
|
25
|
+
)
|
|
26
|
+
},
|
|
27
|
+
onChange: (value2) => onChange({
|
|
28
|
+
start: value2.start.toDate(date.getLocalTimeZone()),
|
|
29
|
+
end: value2.end.toDate(date.getLocalTimeZone())
|
|
30
|
+
})
|
|
31
|
+
});
|
|
32
|
+
const ref = React.useRef(null);
|
|
33
|
+
const { calendarProps, title } = reactAria.useRangeCalendar({}, state, ref);
|
|
34
|
+
return /* @__PURE__ */ React.createElement("div", { ...calendarProps, className: "calendar", ref }, /* @__PURE__ */ React.createElement(
|
|
35
|
+
CalendarHeader.CalendarHeader,
|
|
36
|
+
{
|
|
37
|
+
onClickPrevButton: () => state.focusPreviousPage(),
|
|
38
|
+
onClickNextButton: () => state.focusNextPage(),
|
|
39
|
+
title
|
|
40
|
+
}
|
|
41
|
+
), /* @__PURE__ */ React.createElement(CalendarGrid.CalendarGrid, { state }));
|
|
42
|
+
};
|
|
43
|
+
|
|
44
|
+
exports.RangeCalendar = RangeCalendar;
|
|
@@ -1,26 +1,33 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
|
+
require('clsx');
|
|
4
5
|
require('./Badge.js');
|
|
5
|
-
|
|
6
|
+
require('./BaseSnackbar.js');
|
|
7
|
+
require('react-icons/md');
|
|
6
8
|
require('./Card.js');
|
|
9
|
+
var Button = require('./Button.js');
|
|
10
|
+
require('@internationalized/date');
|
|
11
|
+
require('react-aria');
|
|
12
|
+
require('react-stately');
|
|
13
|
+
var useDebouncedState = require('../hooks/useDebouncedState.js');
|
|
14
|
+
require('./CalendarCell.js');
|
|
15
|
+
require('@tecsinapse/cortex-core');
|
|
16
|
+
require('react-icons/fa');
|
|
17
|
+
require('react-icons/io');
|
|
18
|
+
require('./GroupButton.js');
|
|
7
19
|
require('./Hint.js');
|
|
8
20
|
var Input = require('./Input.js');
|
|
9
21
|
require('./Modal.js');
|
|
22
|
+
require('../styles/calendar-cell.js');
|
|
23
|
+
require('../styles/groupButton.js');
|
|
24
|
+
require('../styles/progressBar.js');
|
|
10
25
|
require('./Select.js');
|
|
11
|
-
require('./Snackbar.js');
|
|
12
26
|
require('./Tag.js');
|
|
13
|
-
require('./Toggle.js');
|
|
14
27
|
require('./TextArea.js');
|
|
15
|
-
require('
|
|
16
|
-
require('react-icons/md');
|
|
17
|
-
require('clsx');
|
|
18
|
-
require('../styles/progressBar.js');
|
|
19
|
-
require('../styles/groupButton.js');
|
|
20
|
-
require('./GroupButton.js');
|
|
28
|
+
require('./Toggle.js');
|
|
21
29
|
var ai = require('react-icons/ai');
|
|
22
30
|
var io5 = require('react-icons/io5');
|
|
23
|
-
var useDebouncedState = require('../hooks/useDebouncedState.js');
|
|
24
31
|
|
|
25
32
|
const inputFace = "bg-white w-full";
|
|
26
33
|
const inputLeft = "flex items-center";
|
|
@@ -48,7 +55,7 @@ const SearchInput = ({
|
|
|
48
55
|
onClick(searchInput);
|
|
49
56
|
}
|
|
50
57
|
};
|
|
51
|
-
return /* @__PURE__ */ React.createElement("div", { className: "flex flex-row w-full space-x-mili" }, /* @__PURE__ */ React.createElement(Input.Input.Face, { variants: { className: inputFace } }, !onClick && /* @__PURE__ */ React.createElement(Input.Input.Left, { className: inputLeft }, /* @__PURE__ */ React.createElement(io5.IoSearchOutline,
|
|
58
|
+
return /* @__PURE__ */ React.createElement("div", { className: "flex flex-row w-full space-x-mili" }, /* @__PURE__ */ React.createElement(Input.Input.Face, { variants: { className: inputFace } }, !onClick && /* @__PURE__ */ React.createElement(Input.Input.Left, { className: inputLeft }, /* @__PURE__ */ React.createElement(io5.IoSearchOutline, { "data-testid": "icon-search-left" })), /* @__PURE__ */ React.createElement(
|
|
52
59
|
Input.Input.Box,
|
|
53
60
|
{
|
|
54
61
|
placeholder,
|
|
@@ -68,7 +75,7 @@ const SearchInput = ({
|
|
|
68
75
|
onClick: () => onClick(searchInput),
|
|
69
76
|
disabled: !searchInput || isSubmitting
|
|
70
77
|
},
|
|
71
|
-
isSubmitting ? /* @__PURE__ */ React.createElement("div", { className: "animate-spin" }, /* @__PURE__ */ React.createElement(ai.AiOutlineLoading,
|
|
78
|
+
isSubmitting ? /* @__PURE__ */ React.createElement("div", { className: "animate-spin" }, /* @__PURE__ */ React.createElement(ai.AiOutlineLoading, { "data-testid": "icon-loading" })) : /* @__PURE__ */ React.createElement(io5.IoSearchOutline, { "data-testid": "icon-search-button" })
|
|
72
79
|
));
|
|
73
80
|
};
|
|
74
81
|
|
|
@@ -4,9 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var cortexCore = require('@tecsinapse/cortex-core');
|
|
6
6
|
var React = require('react');
|
|
7
|
-
var Hint = require('./Hint.js');
|
|
8
|
-
var io5 = require('react-icons/io5');
|
|
9
7
|
var io = require('react-icons/io');
|
|
8
|
+
var io5 = require('react-icons/io5');
|
|
9
|
+
var Hint = require('./Hint.js');
|
|
10
10
|
var SearchInput = require('./SearchInput.js');
|
|
11
11
|
|
|
12
12
|
const { button, dropdown, groupedTitle, containerGrouped, hintBody } = cortexCore.selectVariants();
|
|
@@ -68,7 +68,7 @@ const Select = (props) => {
|
|
|
68
68
|
onClick: () => setOpen((prevState) => !prevState),
|
|
69
69
|
disabled
|
|
70
70
|
},
|
|
71
|
-
/* @__PURE__ */ React.createElement("span",
|
|
71
|
+
/* @__PURE__ */ React.createElement("span", { "data-testid": "select-placeholder" }, placeholder),
|
|
72
72
|
/* @__PURE__ */ React.createElement(io5.IoChevronDownOutline, null)
|
|
73
73
|
), /* @__PURE__ */ React.createElement(
|
|
74
74
|
"ul",
|
|
@@ -93,7 +93,7 @@ const Select = (props) => {
|
|
|
93
93
|
intent: variant
|
|
94
94
|
}
|
|
95
95
|
},
|
|
96
|
-
/* @__PURE__ */ React.createElement("div", { className: hintBody() }, variant === "error" ? /* @__PURE__ */ React.createElement(io.IoIosCloseCircleOutline,
|
|
96
|
+
/* @__PURE__ */ React.createElement("div", { className: hintBody() }, variant === "error" ? /* @__PURE__ */ React.createElement(io.IoIosCloseCircleOutline, { "data-testid": "select-hint-error-icon" }) : /* @__PURE__ */ React.createElement(React.Fragment, null), /* @__PURE__ */ React.createElement("span", null, hint))
|
|
97
97
|
));
|
|
98
98
|
};
|
|
99
99
|
|
|
@@ -7,46 +7,40 @@ const THead = ({
|
|
|
7
7
|
children,
|
|
8
8
|
className,
|
|
9
9
|
...rest
|
|
10
|
-
}) => /* @__PURE__ */ React.createElement("thead", { className: cortexCore.tHead({ className }), ...rest }, children);
|
|
10
|
+
}) => /* @__PURE__ */ React.createElement("thead", { className: cortexCore.tHead({ className }), "data-testid": "thead", ...rest }, children);
|
|
11
11
|
const TRow = ({
|
|
12
12
|
children,
|
|
13
13
|
className,
|
|
14
14
|
...rest
|
|
15
|
-
}) => /* @__PURE__ */ React.createElement("tr", { className: cortexCore.tRow({ className }), ...rest }, children);
|
|
15
|
+
}) => /* @__PURE__ */ React.createElement("tr", { className: cortexCore.tRow({ className }), "data-testid": "trow", ...rest }, children);
|
|
16
16
|
const THeadCell = ({
|
|
17
17
|
children,
|
|
18
18
|
className,
|
|
19
19
|
...rest
|
|
20
|
-
}) => /* @__PURE__ */ React.createElement("th", { className: cortexCore.tHeadCell({ className }), ...rest }, children);
|
|
20
|
+
}) => /* @__PURE__ */ React.createElement("th", { className: cortexCore.tHeadCell({ className }), "data-testid": "thead-cell", ...rest }, children);
|
|
21
21
|
const TRowHeader = ({
|
|
22
22
|
children
|
|
23
|
-
}) => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("tr", { className: cortexCore.tRow() }, children), /* @__PURE__ */ React.createElement("tr", { className: cortexCore.tRow() }, /* @__PURE__ */ React.createElement("td", { colSpan: 99 }, /* @__PURE__ */ React.createElement("hr", { className: cortexCore.hr() }))));
|
|
23
|
+
}) => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("tr", { className: cortexCore.tRow(), "data-testid": "trow-header" }, children), /* @__PURE__ */ React.createElement("tr", { className: cortexCore.tRow() }, /* @__PURE__ */ React.createElement("td", { colSpan: 99 }, /* @__PURE__ */ React.createElement("hr", { className: cortexCore.hr() }))));
|
|
24
24
|
const TCell = ({
|
|
25
25
|
children,
|
|
26
26
|
className,
|
|
27
27
|
...rest
|
|
28
|
-
}) => /* @__PURE__ */ React.createElement("td", { className: cortexCore.tCell({ className }), ...rest }, children);
|
|
28
|
+
}) => /* @__PURE__ */ React.createElement("td", { className: cortexCore.tCell({ className }), "data-testid": "tcell", ...rest }, children);
|
|
29
29
|
const TFoot = ({
|
|
30
30
|
children,
|
|
31
31
|
className,
|
|
32
32
|
...rest
|
|
33
|
-
}) => /* @__PURE__ */ React.createElement("tfoot", { className: cortexCore.tFoot({ className }), ...rest }, children);
|
|
33
|
+
}) => /* @__PURE__ */ React.createElement("tfoot", { className: cortexCore.tFoot({ className }), "data-testid": "tfoot", ...rest }, children);
|
|
34
34
|
const Table = ({
|
|
35
35
|
children,
|
|
36
36
|
className,
|
|
37
37
|
...rest
|
|
38
|
-
}) => /* @__PURE__ */ React.createElement("table", { className: cortexCore.tRoot({ className }), ...rest }, children);
|
|
39
|
-
const Hr = ({
|
|
40
|
-
children,
|
|
41
|
-
className,
|
|
42
|
-
...rest
|
|
43
|
-
}) => /* @__PURE__ */ React.createElement("hr", { className: cortexCore.hr({ className }), ...rest }, children);
|
|
38
|
+
}) => /* @__PURE__ */ React.createElement("table", { className: cortexCore.tRoot({ className }), "data-testid": "table", ...rest }, children);
|
|
44
39
|
const Td = ({
|
|
45
40
|
children,
|
|
46
41
|
...rest
|
|
47
|
-
}) => /* @__PURE__ */ React.createElement("td", { ...rest }, children);
|
|
42
|
+
}) => /* @__PURE__ */ React.createElement("td", { ...rest, "data-testid": "td" }, children);
|
|
48
43
|
|
|
49
|
-
exports.Hr = Hr;
|
|
50
44
|
exports.TCell = TCell;
|
|
51
45
|
exports.TFoot = TFoot;
|
|
52
46
|
exports.THead = THead;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var date = require('@internationalized/date');
|
|
4
|
+
var reactAria = require('react-aria');
|
|
5
|
+
var reactStately = require('react-stately');
|
|
6
|
+
|
|
7
|
+
const useCalendar = ({ value, onChange }) => {
|
|
8
|
+
const { locale } = reactAria.useLocale();
|
|
9
|
+
const state = reactStately.useCalendarState({
|
|
10
|
+
locale,
|
|
11
|
+
createCalendar: date.createCalendar,
|
|
12
|
+
defaultValue: new date.CalendarDate(
|
|
13
|
+
value.getFullYear(),
|
|
14
|
+
value.getMonth(),
|
|
15
|
+
value.getDate()
|
|
16
|
+
),
|
|
17
|
+
onChange: (value2) => onChange(value2.toDate(date.getLocalTimeZone()))
|
|
18
|
+
});
|
|
19
|
+
const { calendarProps, title } = reactAria.useCalendar({}, state);
|
|
20
|
+
return {
|
|
21
|
+
calendarProps,
|
|
22
|
+
title,
|
|
23
|
+
state
|
|
24
|
+
};
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
exports.useCalendar = useCalendar;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var date = require('@internationalized/date');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
var reactAria = require('react-aria');
|
|
6
|
+
|
|
7
|
+
const useCalendarCell = ({ state, date: date$1 }) => {
|
|
8
|
+
const ref = React.useRef(null);
|
|
9
|
+
const {
|
|
10
|
+
cellProps,
|
|
11
|
+
buttonProps,
|
|
12
|
+
isSelected,
|
|
13
|
+
isOutsideVisibleRange,
|
|
14
|
+
formattedDate
|
|
15
|
+
} = reactAria.useCalendarCell({ date: date$1 }, state, ref);
|
|
16
|
+
const rangeStateHighlitedRange = state?.highlightedRange;
|
|
17
|
+
const isSameDayStart = rangeStateHighlitedRange ? date.isSameDay(date$1, state?.highlightedRange?.start) : void 0;
|
|
18
|
+
const isSameDayEnd = rangeStateHighlitedRange ? date.isSameDay(date$1, state?.highlightedRange?.end) : void 0;
|
|
19
|
+
const isSelectionStart = isSameDayStart && !isSameDayEnd;
|
|
20
|
+
const isSelectionEnd = isSameDayEnd && !isSameDayStart;
|
|
21
|
+
const inRange = date$1 > rangeStateHighlitedRange?.start && date$1 < rangeStateHighlitedRange?.end;
|
|
22
|
+
return {
|
|
23
|
+
ref,
|
|
24
|
+
cellProps,
|
|
25
|
+
buttonProps,
|
|
26
|
+
isSelected,
|
|
27
|
+
isOutsideVisibleRange,
|
|
28
|
+
formattedDate,
|
|
29
|
+
isSelectionStart,
|
|
30
|
+
isSelectionEnd,
|
|
31
|
+
inRange
|
|
32
|
+
};
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
exports.useCalendarCell = useCalendarCell;
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var reactAria = require('react-aria');
|
|
4
|
+
|
|
5
|
+
const useCalendarGrid = ({ state }) => {
|
|
6
|
+
const { gridProps, headerProps, weekDays } = reactAria.useCalendarGrid({}, state);
|
|
7
|
+
return {
|
|
8
|
+
gridProps,
|
|
9
|
+
headerProps,
|
|
10
|
+
weekDays
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
exports.useCalendarGrid = useCalendarGrid;
|
package/dist/cjs/index.js
CHANGED
|
@@ -1,30 +1,45 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var Avatar = require('./components/Avatar.js');
|
|
3
4
|
var Badge = require('./components/Badge.js');
|
|
5
|
+
var BaseSnackbar = require('./components/BaseSnackbar.js');
|
|
6
|
+
var Breadcrumbs = require('./components/Breadcrumbs.js');
|
|
4
7
|
var Button = require('./components/Button.js');
|
|
8
|
+
var Calendar = require('./components/Calendar.js');
|
|
5
9
|
var Card = require('./components/Card.js');
|
|
10
|
+
var DefaultSnack = require('./components/DefaultSnack.js');
|
|
11
|
+
var Drawer = require('./components/Drawer.js');
|
|
12
|
+
var GroupButton = require('./components/GroupButton.js');
|
|
6
13
|
var Hint = require('./components/Hint.js');
|
|
7
14
|
var Input = require('./components/Input.js');
|
|
8
15
|
var Modal = require('./components/Modal.js');
|
|
16
|
+
var ProgressBar = require('./components/ProgressBar.js');
|
|
17
|
+
var RangeCalendar = require('./components/RangeCalendar.js');
|
|
9
18
|
var Select = require('./components/Select.js');
|
|
10
|
-
var
|
|
19
|
+
var Skeleton = require('./components/Skeleton.js');
|
|
20
|
+
var Table = require('./components/Table.js');
|
|
11
21
|
var Tag = require('./components/Tag.js');
|
|
12
|
-
var Toggle = require('./components/Toggle.js');
|
|
13
22
|
var TextArea = require('./components/TextArea.js');
|
|
14
|
-
var
|
|
15
|
-
var
|
|
16
|
-
var
|
|
17
|
-
var
|
|
18
|
-
var
|
|
19
|
-
var
|
|
20
|
-
var GroupButton = require('./components/GroupButton.js');
|
|
23
|
+
var Toggle = require('./components/Toggle.js');
|
|
24
|
+
var SnackbarSonner = require('./service/SnackbarSonner.js');
|
|
25
|
+
var useCalendar = require('./hooks/useCalendar.js');
|
|
26
|
+
var useCalendarCell = require('./hooks/useCalendarCell.js');
|
|
27
|
+
var useCalendarGrid = require('./hooks/useCalendarGrid.js');
|
|
28
|
+
var useDebouncedState = require('./hooks/useDebouncedState.js');
|
|
21
29
|
|
|
22
30
|
|
|
23
31
|
|
|
32
|
+
exports.Avatar = Avatar.Avatar;
|
|
24
33
|
exports.Badge = Badge.Badge;
|
|
25
34
|
exports.BadgeAnchor = Badge.BadgeAnchor;
|
|
35
|
+
exports.BaseSnackbar = BaseSnackbar.BaseSnackbar;
|
|
36
|
+
exports.Breadcrumbs = Breadcrumbs.Breadcrumbs;
|
|
26
37
|
exports.Button = Button.Button;
|
|
38
|
+
exports.Calendar = Calendar.Calendar;
|
|
27
39
|
exports.Card = Card.Card;
|
|
40
|
+
exports.DefaultSnack = DefaultSnack.DefaultSnack;
|
|
41
|
+
exports.Drawer = Drawer.Drawer;
|
|
42
|
+
exports.GroupButton = GroupButton.GroupButton;
|
|
28
43
|
exports.Hint = Hint.Hint;
|
|
29
44
|
exports.Box = Input.Box;
|
|
30
45
|
exports.Face = Input.Face;
|
|
@@ -33,12 +48,10 @@ exports.Left = Input.Left;
|
|
|
33
48
|
exports.Right = Input.Right;
|
|
34
49
|
exports.Root = Input.Root;
|
|
35
50
|
exports.Modal = Modal.Modal;
|
|
51
|
+
exports.ProgressBar = ProgressBar.ProgressBar;
|
|
52
|
+
exports.RangeCalendar = RangeCalendar.RangeCalendar;
|
|
36
53
|
exports.Select = Select.Select;
|
|
37
|
-
exports.
|
|
38
|
-
exports.Tag = Tag.Tag;
|
|
39
|
-
exports.Toggle = Toggle.Toggle;
|
|
40
|
-
exports.TextArea = TextArea.TextArea;
|
|
41
|
-
exports.Hr = Table.Hr;
|
|
54
|
+
exports.Skeleton = Skeleton.Skeleton;
|
|
42
55
|
exports.TCell = Table.TCell;
|
|
43
56
|
exports.TFoot = Table.TFoot;
|
|
44
57
|
exports.THead = Table.THead;
|
|
@@ -47,9 +60,11 @@ exports.TRow = Table.TRow;
|
|
|
47
60
|
exports.TRowHeader = Table.TRowHeader;
|
|
48
61
|
exports.Table = Table.Table;
|
|
49
62
|
exports.Td = Table.Td;
|
|
50
|
-
exports.
|
|
51
|
-
exports.
|
|
52
|
-
exports.
|
|
53
|
-
exports.
|
|
54
|
-
exports.
|
|
55
|
-
exports.
|
|
63
|
+
exports.Tag = Tag.Tag;
|
|
64
|
+
exports.TextArea = TextArea.TextArea;
|
|
65
|
+
exports.Toggle = Toggle.Toggle;
|
|
66
|
+
exports.SnackbarSonner = SnackbarSonner.SnackbarSonner;
|
|
67
|
+
exports.useCalendar = useCalendar.useCalendar;
|
|
68
|
+
exports.useCalendarCell = useCalendarCell.useCalendarCell;
|
|
69
|
+
exports.useCalendarGrid = useCalendarGrid.useCalendarGrid;
|
|
70
|
+
exports.useDebouncedState = useDebouncedState.useDebouncedState;
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var sonner = require('sonner');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
require('clsx');
|
|
6
|
+
require('../components/Badge.js');
|
|
7
|
+
require('../components/BaseSnackbar.js');
|
|
8
|
+
require('react-icons/md');
|
|
9
|
+
require('../components/Card.js');
|
|
10
|
+
require('../components/Button.js');
|
|
11
|
+
require('@internationalized/date');
|
|
12
|
+
require('react-aria');
|
|
13
|
+
require('react-stately');
|
|
14
|
+
require('../components/CalendarCell.js');
|
|
15
|
+
require('@tecsinapse/cortex-core');
|
|
16
|
+
require('react-icons/fa');
|
|
17
|
+
var DefaultSnack = require('../components/DefaultSnack.js');
|
|
18
|
+
require('../components/GroupButton.js');
|
|
19
|
+
require('../components/Hint.js');
|
|
20
|
+
require('../components/Input.js');
|
|
21
|
+
require('../components/Modal.js');
|
|
22
|
+
require('../styles/calendar-cell.js');
|
|
23
|
+
require('../styles/groupButton.js');
|
|
24
|
+
require('../styles/progressBar.js');
|
|
25
|
+
require('../components/Select.js');
|
|
26
|
+
require('../components/Tag.js');
|
|
27
|
+
require('../components/TextArea.js');
|
|
28
|
+
require('../components/Toggle.js');
|
|
29
|
+
|
|
30
|
+
class SnackbarSonner {
|
|
31
|
+
custom(Component, options) {
|
|
32
|
+
return sonner.toast.custom(() => Component, {
|
|
33
|
+
...options,
|
|
34
|
+
duration: options?.duration ?? 5e3
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
show(type, message, options) {
|
|
38
|
+
return sonner.toast.custom(
|
|
39
|
+
(t) => {
|
|
40
|
+
return /* @__PURE__ */ React.createElement(
|
|
41
|
+
DefaultSnack.DefaultSnack,
|
|
42
|
+
{
|
|
43
|
+
text: message,
|
|
44
|
+
variants: { intent: type },
|
|
45
|
+
onDismiss: () => sonner.toast.dismiss(t)
|
|
46
|
+
}
|
|
47
|
+
);
|
|
48
|
+
},
|
|
49
|
+
{ ...options, duration: options?.duration ?? 5e3 }
|
|
50
|
+
);
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
exports.SnackbarSonner = SnackbarSonner;
|