@coveord/plasma-mantine 52.26.3 → 52.26.4
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/.turbo/turbo-build.log +3 -3
- package/.turbo/turbo-test.log +34 -128
- package/dist/.tsbuildinfo +1 -1
- package/dist/esm/components/action-icon/ActionIcon.js +29 -80
- package/dist/esm/components/action-icon/ActionIcon.js.map +1 -1
- package/dist/esm/components/action-icon/index.js +1 -1
- package/dist/esm/components/blank-slate/BlankSlate.js +3 -6
- package/dist/esm/components/blank-slate/BlankSlate.js.map +1 -1
- package/dist/esm/components/blank-slate/index.js +1 -1
- package/dist/esm/components/browser-preview/BrowserPreview.js +16 -28
- package/dist/esm/components/browser-preview/BrowserPreview.js.map +1 -1
- package/dist/esm/components/browser-preview/BrowserPreview.styles.js +6 -8
- package/dist/esm/components/browser-preview/BrowserPreview.styles.js.map +1 -1
- package/dist/esm/components/browser-preview/index.js +1 -1
- package/dist/esm/components/button/Button.js +29 -80
- package/dist/esm/components/button/Button.js.map +1 -1
- package/dist/esm/components/button/ButtonWithDisabledTooltip.js +16 -28
- package/dist/esm/components/button/ButtonWithDisabledTooltip.js.map +1 -1
- package/dist/esm/components/button/index.js +1 -1
- package/dist/esm/components/code-editor/CodeEditor.js +76 -144
- package/dist/esm/components/code-editor/CodeEditor.js.map +1 -1
- package/dist/esm/components/code-editor/index.js +1 -1
- package/dist/esm/components/code-editor/languages/xml.js +18 -32
- package/dist/esm/components/code-editor/languages/xml.js.map +1 -1
- package/dist/esm/components/code-editor/search/Search.js +6 -13
- package/dist/esm/components/code-editor/search/Search.js.map +1 -1
- package/dist/esm/components/code-editor/search/index.js +1 -1
- package/dist/esm/components/collection/Collection.js +57 -110
- package/dist/esm/components/collection/Collection.js.map +1 -1
- package/dist/esm/components/collection/Collection.styles.js +7 -9
- package/dist/esm/components/collection/Collection.styles.js.map +1 -1
- package/dist/esm/components/collection/CollectionItem.js +47 -54
- package/dist/esm/components/collection/CollectionItem.js.map +1 -1
- package/dist/esm/components/collection/index.js +1 -1
- package/dist/esm/components/copyToClipboard/CopyToClipboard.js +19 -29
- package/dist/esm/components/copyToClipboard/CopyToClipboard.js.map +1 -1
- package/dist/esm/components/copyToClipboard/index.js +1 -1
- package/dist/esm/components/date-range-picker/DateRangePickerInlineCalendar.js +29 -32
- package/dist/esm/components/date-range-picker/DateRangePickerInlineCalendar.js.map +1 -1
- package/dist/esm/components/date-range-picker/DateRangePickerPopoverCalendar.js +22 -29
- package/dist/esm/components/date-range-picker/DateRangePickerPopoverCalendar.js.map +1 -1
- package/dist/esm/components/date-range-picker/DateRangePickerPresetSelect.js +19 -30
- package/dist/esm/components/date-range-picker/DateRangePickerPresetSelect.js.map +1 -1
- package/dist/esm/components/date-range-picker/EditableDateRangePicker.js +21 -22
- package/dist/esm/components/date-range-picker/EditableDateRangePicker.js.map +1 -1
- package/dist/esm/components/date-range-picker/index.js +3 -3
- package/dist/esm/components/header/Header.js +28 -48
- package/dist/esm/components/header/Header.js.map +1 -1
- package/dist/esm/components/header/Header.styles.js +7 -10
- package/dist/esm/components/header/Header.styles.js.map +1 -1
- package/dist/esm/components/header/HeaderActions/HeaderActions.js +16 -25
- package/dist/esm/components/header/HeaderActions/HeaderActions.js.map +1 -1
- package/dist/esm/components/header/HeaderActions/HeaderActions.styles.js +3 -7
- package/dist/esm/components/header/HeaderActions/HeaderActions.styles.js.map +1 -1
- package/dist/esm/components/header/HeaderBreadcrumbs/HeaderBreadcrumbs.js +13 -22
- package/dist/esm/components/header/HeaderBreadcrumbs/HeaderBreadcrumbs.js.map +1 -1
- package/dist/esm/components/header/HeaderBreadcrumbs/HeaderBreadcrumbs.styles.js +3 -7
- package/dist/esm/components/header/HeaderBreadcrumbs/HeaderBreadcrumbs.styles.js.map +1 -1
- package/dist/esm/components/header/HeaderDocAnchor/HeaderDocAnchor.js +17 -28
- package/dist/esm/components/header/HeaderDocAnchor/HeaderDocAnchor.js.map +1 -1
- package/dist/esm/components/header/HeaderDocAnchor/HeaderDocAnchor.styles.js +4 -8
- package/dist/esm/components/header/HeaderDocAnchor/HeaderDocAnchor.styles.js.map +1 -1
- package/dist/esm/components/header/index.js +1 -1
- package/dist/esm/components/index.js +15 -15
- package/dist/esm/components/inline-confirm/InlineConfirm.js +14 -20
- package/dist/esm/components/inline-confirm/InlineConfirm.js.map +1 -1
- package/dist/esm/components/inline-confirm/InlineConfirmButton.js +11 -17
- package/dist/esm/components/inline-confirm/InlineConfirmButton.js.map +1 -1
- package/dist/esm/components/inline-confirm/InlineConfirmContext.js +2 -2
- package/dist/esm/components/inline-confirm/InlineConfirmContext.js.map +1 -1
- package/dist/esm/components/inline-confirm/InlineConfirmMenuItem.js +11 -17
- package/dist/esm/components/inline-confirm/InlineConfirmMenuItem.js.map +1 -1
- package/dist/esm/components/inline-confirm/InlineConfirmPrompt.js +8 -9
- package/dist/esm/components/inline-confirm/InlineConfirmPrompt.js.map +1 -1
- package/dist/esm/components/inline-confirm/index.js +3 -3
- package/dist/esm/components/inline-confirm/useInlineConfirm.js +5 -5
- package/dist/esm/components/inline-confirm/useInlineConfirm.js.map +1 -1
- package/dist/esm/components/menu/Menu.js +13 -21
- package/dist/esm/components/menu/Menu.js.map +1 -1
- package/dist/esm/components/menu/index.js +1 -1
- package/dist/esm/components/modal-wizard/ModalWizard.js +57 -108
- package/dist/esm/components/modal-wizard/ModalWizard.js.map +1 -1
- package/dist/esm/components/modal-wizard/ModalWizardStep.js +1 -4
- package/dist/esm/components/modal-wizard/ModalWizardStep.js.map +1 -1
- package/dist/esm/components/modal-wizard/index.js +1 -1
- package/dist/esm/components/prompt/Prompt.js +29 -41
- package/dist/esm/components/prompt/Prompt.js.map +1 -1
- package/dist/esm/components/prompt/PromptFooter.js +4 -11
- package/dist/esm/components/prompt/PromptFooter.js.map +1 -1
- package/dist/esm/components/prompt/index.js +1 -1
- package/dist/esm/components/sticky-footer/StickyFooter.js +21 -35
- package/dist/esm/components/sticky-footer/StickyFooter.js.map +1 -1
- package/dist/esm/components/sticky-footer/index.js +1 -1
- package/dist/esm/components/table/Table.js +94 -123
- package/dist/esm/components/table/Table.js.map +1 -1
- package/dist/esm/components/table/Table.styles.js +11 -13
- package/dist/esm/components/table/Table.styles.js.map +1 -1
- package/dist/esm/components/table/TableContext.js +5 -5
- package/dist/esm/components/table/TableContext.js.map +1 -1
- package/dist/esm/components/table/index.js +3 -3
- package/dist/esm/components/table/layouts/RowLayout.js +59 -79
- package/dist/esm/components/table/layouts/RowLayout.js.map +1 -1
- package/dist/esm/components/table/layouts/RowLayout.styles.js +27 -28
- package/dist/esm/components/table/layouts/RowLayout.styles.js.map +1 -1
- package/dist/esm/components/table/layouts/TableLayoutControl.js +10 -13
- package/dist/esm/components/table/layouts/TableLayoutControl.js.map +1 -1
- package/dist/esm/components/table/layouts/TableLayouts.js +2 -2
- package/dist/esm/components/table/layouts/TableLayouts.js.map +1 -1
- package/dist/esm/components/table/table-actions/TableActions.js +17 -26
- package/dist/esm/components/table/table-actions/TableActions.js.map +1 -1
- package/dist/esm/components/table/table-actions/TableActions.styles.js +5 -7
- package/dist/esm/components/table/table-actions/TableActions.styles.js.map +1 -1
- package/dist/esm/components/table/table-column/TableCollapsibleColumn.js +19 -23
- package/dist/esm/components/table/table-column/TableCollapsibleColumn.js.map +1 -1
- package/dist/esm/components/table/table-column/TableSelectableColumn.js +9 -13
- package/dist/esm/components/table/table-column/TableSelectableColumn.js.map +1 -1
- package/dist/esm/components/table/table-consumer/TableConsumer.js +1 -4
- package/dist/esm/components/table/table-consumer/TableConsumer.js.map +1 -1
- package/dist/esm/components/table/table-date-range-picker/TableDateRangePicker.js +28 -43
- package/dist/esm/components/table/table-date-range-picker/TableDateRangePicker.js.map +1 -1
- package/dist/esm/components/table/table-date-range-picker/TableDateRangePicker.styles.js +3 -5
- package/dist/esm/components/table/table-date-range-picker/TableDateRangePicker.styles.js.map +1 -1
- package/dist/esm/components/table/table-filter/TableFilter.js +30 -40
- package/dist/esm/components/table/table-filter/TableFilter.js.map +1 -1
- package/dist/esm/components/table/table-filter/TableFilter.styles.js +4 -6
- package/dist/esm/components/table/table-filter/TableFilter.styles.js.map +1 -1
- package/dist/esm/components/table/table-footer/TableFooter.js +5 -13
- package/dist/esm/components/table/table-footer/TableFooter.js.map +1 -1
- package/dist/esm/components/table/table-header/TableHeader.js +20 -29
- package/dist/esm/components/table/table-header/TableHeader.js.map +1 -1
- package/dist/esm/components/table/table-header/TableHeader.styles.js +8 -10
- package/dist/esm/components/table/table-header/TableHeader.styles.js.map +1 -1
- package/dist/esm/components/table/table-header/Th.js +27 -35
- package/dist/esm/components/table/table-header/Th.js.map +1 -1
- package/dist/esm/components/table/table-header/Th.styles.js +13 -16
- package/dist/esm/components/table/table-header/Th.styles.js.map +1 -1
- package/dist/esm/components/table/table-last-updated/TableLastUpdated.js +24 -35
- package/dist/esm/components/table/table-last-updated/TableLastUpdated.js.map +1 -1
- package/dist/esm/components/table/table-last-updated/TableLastUpdated.styles.js +4 -6
- package/dist/esm/components/table/table-last-updated/TableLastUpdated.styles.js.map +1 -1
- package/dist/esm/components/table/table-loading/TableLoading.js +4 -7
- package/dist/esm/components/table/table-loading/TableLoading.js.map +1 -1
- package/dist/esm/components/table/table-pagination/TablePagination.js +21 -25
- package/dist/esm/components/table/table-pagination/TablePagination.js.map +1 -1
- package/dist/esm/components/table/table-per-page/TablePerPage.js +15 -24
- package/dist/esm/components/table/table-per-page/TablePerPage.js.map +1 -1
- package/dist/esm/components/table/table-predicate/TablePredicate.js +25 -35
- package/dist/esm/components/table/table-predicate/TablePredicate.js.map +1 -1
- package/dist/esm/components/table/table-predicate/TablePredicate.styles.js +3 -5
- package/dist/esm/components/table/table-predicate/TablePredicate.styles.js.map +1 -1
- package/dist/esm/form/FormProvider.js +9 -10
- package/dist/esm/form/FormProvider.js.map +1 -1
- package/dist/esm/form/index.js +2 -2
- package/dist/esm/form/useForm.js +18 -25
- package/dist/esm/form/useForm.js.map +1 -1
- package/dist/esm/hooks/index.js +2 -2
- package/dist/esm/hooks/useControlledList.js +24 -30
- package/dist/esm/hooks/useControlledList.js.map +1 -1
- package/dist/esm/hooks/useParentHeight.js +10 -11
- package/dist/esm/hooks/useParentHeight.js.map +1 -1
- package/dist/esm/hooks/useRowSelection.js +33 -44
- package/dist/esm/hooks/useRowSelection.js.map +1 -1
- package/dist/esm/index.js +11 -11
- package/dist/esm/theme/PlasmaColors.js +13 -15
- package/dist/esm/theme/PlasmaColors.js.map +1 -1
- package/dist/esm/theme/Plasmantine.js +3 -6
- package/dist/esm/theme/Plasmantine.js.map +1 -1
- package/dist/esm/theme/Theme.js +142 -171
- package/dist/esm/theme/Theme.js.map +1 -1
- package/dist/esm/theme/index.js +1 -1
- package/dist/esm/utils/createPolymorphicComponent.js +2 -2
- package/dist/esm/utils/createPolymorphicComponent.js.map +1 -1
- package/dist/esm/utils/index.js +2 -2
- package/dist/esm/utils/overrideComponent.js +2 -8
- package/dist/esm/utils/overrideComponent.js.map +1 -1
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/copyToClipboard/CopyToClipboard.tsx"],"sourcesContent":["import {CheckSize16Px, CopySize16Px} from '@coveord/plasma-react-icons';\nimport {ActionIcon, CopyButton, createStyles, TextInput, Tooltip} from '@mantine/core';\n\nexport interface CopyToClipboardProps {\n /**\n * The value to be copied to the clipboard.\n */\n value: string;\n /**\n * Whether to display the string to be copied alongside the button.\n *\n * @default false\n */\n withLabel?: boolean;\n /**\n * Called each time the value is copied to the clipboard\n */\n onCopy?: () => void;\n}\n\nconst useStyles = createStyles((theme) => ({\n input: {\n color: theme.colors.gray[7],\n },\n}));\n\nconst CopyToClipboardButton: React.FunctionComponent<Omit<CopyToClipboardProps, 'withLabel'>> = ({value, onCopy}) => (\n <CopyButton value={value} timeout={2000}>\n {({copied, copy}) => (\n <Tooltip label={copied ? 'Copied' : 'Copy'}>\n <ActionIcon\n color={copied ? 'success' : 'gray'}\n onClick={() => {\n copy();\n onCopy?.();\n }}\n >\n {copied ? <CheckSize16Px height={16} /> : <CopySize16Px height={16} />}\n </ActionIcon>\n </Tooltip>\n )}\n </CopyButton>\n);\n\nexport const CopyToClipboard: React.FunctionComponent<CopyToClipboardProps> = ({withLabel, ...others}) => {\n const {classes} = useStyles();\n\n return withLabel ? (\n <TextInput\n classNames={{\n input: classes.input,\n }}\n value={others.value}\n readOnly\n autoComplete=\"off\"\n rightSection={<CopyToClipboardButton {...others} />}\n />\n ) : (\n <CopyToClipboardButton {...others} />\n );\n};\n"],"names":["CheckSize16Px","CopySize16Px","ActionIcon","CopyButton","createStyles","TextInput","Tooltip","useStyles","theme","input","color","colors","gray","CopyToClipboardButton","value","onCopy","timeout","copied","copy","label","onClick","height","CopyToClipboard","withLabel","others","classes","classNames","readOnly","autoComplete","rightSection"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/copyToClipboard/CopyToClipboard.tsx"],"sourcesContent":["import {CheckSize16Px, CopySize16Px} from '@coveord/plasma-react-icons';\nimport {ActionIcon, CopyButton, createStyles, TextInput, Tooltip} from '@mantine/core';\n\nexport interface CopyToClipboardProps {\n /**\n * The value to be copied to the clipboard.\n */\n value: string;\n /**\n * Whether to display the string to be copied alongside the button.\n *\n * @default false\n */\n withLabel?: boolean;\n /**\n * Called each time the value is copied to the clipboard\n */\n onCopy?: () => void;\n}\n\nconst useStyles = createStyles((theme) => ({\n input: {\n color: theme.colors.gray[7],\n },\n}));\n\nconst CopyToClipboardButton: React.FunctionComponent<Omit<CopyToClipboardProps, 'withLabel'>> = ({value, onCopy}) => (\n <CopyButton value={value} timeout={2000}>\n {({copied, copy}) => (\n <Tooltip label={copied ? 'Copied' : 'Copy'}>\n <ActionIcon\n color={copied ? 'success' : 'gray'}\n onClick={() => {\n copy();\n onCopy?.();\n }}\n >\n {copied ? <CheckSize16Px height={16} /> : <CopySize16Px height={16} />}\n </ActionIcon>\n </Tooltip>\n )}\n </CopyButton>\n);\n\nexport const CopyToClipboard: React.FunctionComponent<CopyToClipboardProps> = ({withLabel, ...others}) => {\n const {classes} = useStyles();\n\n return withLabel ? (\n <TextInput\n classNames={{\n input: classes.input,\n }}\n value={others.value}\n readOnly\n autoComplete=\"off\"\n rightSection={<CopyToClipboardButton {...others} />}\n />\n ) : (\n <CopyToClipboardButton {...others} />\n );\n};\n"],"names":["CheckSize16Px","CopySize16Px","ActionIcon","CopyButton","createStyles","TextInput","Tooltip","useStyles","theme","input","color","colors","gray","CopyToClipboardButton","value","onCopy","timeout","copied","copy","label","onClick","height","CopyToClipboard","withLabel","others","classes","classNames","readOnly","autoComplete","rightSection"],"mappings":";AAAA,SAAQA,aAAa,EAAEC,YAAY,QAAO,8BAA8B;AACxE,SAAQC,UAAU,EAAEC,UAAU,EAAEC,YAAY,EAAEC,SAAS,EAAEC,OAAO,QAAO,gBAAgB;AAmBvF,MAAMC,YAAYH,aAAa,CAACI,QAAW,CAAA;QACvCC,OAAO;YACHC,OAAOF,MAAMG,MAAM,CAACC,IAAI,CAAC,EAAE;QAC/B;IACJ,CAAA;AAEA,MAAMC,wBAA0F,CAAC,EAACC,KAAK,EAAEC,MAAM,EAAC,iBAC5G,KAACZ;QAAWW,OAAOA;QAAOE,SAAS;kBAC9B,CAAC,EAACC,MAAM,EAAEC,IAAI,EAAC,iBACZ,KAACZ;gBAAQa,OAAOF,SAAS,WAAW;0BAChC,cAAA,KAACf;oBACGQ,OAAOO,SAAS,YAAY;oBAC5BG,SAAS;wBACLF;wBACAH;oBACJ;8BAECE,uBAAS,KAACjB;wBAAcqB,QAAQ;uCAAS,KAACpB;wBAAaoB,QAAQ;;;;;AAOpF,OAAO,MAAMC,kBAAiE,CAAC,EAACC,SAAS,EAAE,GAAGC,QAAO;IACjG,MAAM,EAACC,OAAO,EAAC,GAAGlB;IAElB,OAAOgB,0BACH,KAAClB;QACGqB,YAAY;YACRjB,OAAOgB,QAAQhB,KAAK;QACxB;QACAK,OAAOU,OAAOV,KAAK;QACnBa,QAAQ;QACRC,cAAa;QACbC,4BAAc,KAAChB;YAAuB,GAAGW,MAAM;;uBAGnD,KAACX;QAAuB,GAAGW,MAAM;;AAEzC,EAAE"}
|
|
@@ -1,21 +1,18 @@
|
|
|
1
|
-
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
2
|
-
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
3
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
4
|
-
import { Center, Group, Space } from
|
|
5
|
-
import { DatePicker } from
|
|
6
|
-
import { useForm } from
|
|
7
|
-
import { Button } from
|
|
8
|
-
import { DateRangePickerPresetSelect } from
|
|
9
|
-
import { EditableDateRangePicker } from
|
|
10
|
-
export
|
|
11
|
-
|
|
12
|
-
var form = useForm({
|
|
2
|
+
import { Center, Group, Space } from '@mantine/core';
|
|
3
|
+
import { DatePicker } from '@mantine/dates';
|
|
4
|
+
import { useForm } from '@mantine/form';
|
|
5
|
+
import { Button } from '../button';
|
|
6
|
+
import { DateRangePickerPresetSelect } from './DateRangePickerPresetSelect';
|
|
7
|
+
import { EditableDateRangePicker } from './EditableDateRangePicker';
|
|
8
|
+
export const DateRangePickerInlineCalendar = ({ initialRange, onApply, onCancel, presets, startProps, endProps, rangeCalendarProps })=>{
|
|
9
|
+
const form = useForm({
|
|
13
10
|
initialValues: {
|
|
14
11
|
dates: initialRange
|
|
15
12
|
}
|
|
16
13
|
});
|
|
17
|
-
|
|
18
|
-
|
|
14
|
+
const calendarInputProps = form.getInputProps('dates');
|
|
15
|
+
const onCalendarApply = ()=>{
|
|
19
16
|
if (!form.values.dates[1]) {
|
|
20
17
|
form.values.dates[1] = form.values.dates[0]; // when date range is the same day
|
|
21
18
|
}
|
|
@@ -29,24 +26,24 @@ export var DateRangePickerInlineCalendar = function(param) {
|
|
|
29
26
|
grow: true,
|
|
30
27
|
px: "md",
|
|
31
28
|
py: "sm",
|
|
32
|
-
sx:
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
};
|
|
36
|
-
},
|
|
29
|
+
sx: (theme)=>({
|
|
30
|
+
borderBottom: `1px solid ${theme.colors.gray[2]}`
|
|
31
|
+
}),
|
|
37
32
|
children: [
|
|
38
|
-
/*#__PURE__*/ _jsx(EditableDateRangePicker,
|
|
33
|
+
/*#__PURE__*/ _jsx(EditableDateRangePicker, {
|
|
34
|
+
...calendarInputProps,
|
|
39
35
|
startProps: startProps,
|
|
40
36
|
endProps: endProps
|
|
41
|
-
})
|
|
37
|
+
}),
|
|
42
38
|
presets ? /*#__PURE__*/ _jsxs(_Fragment, {
|
|
43
39
|
children: [
|
|
44
40
|
/*#__PURE__*/ _jsx(Space, {
|
|
45
41
|
w: "sm"
|
|
46
42
|
}),
|
|
47
|
-
/*#__PURE__*/ _jsx(DateRangePickerPresetSelect,
|
|
48
|
-
presets: presets
|
|
49
|
-
|
|
43
|
+
/*#__PURE__*/ _jsx(DateRangePickerPresetSelect, {
|
|
44
|
+
presets: presets,
|
|
45
|
+
...calendarInputProps
|
|
46
|
+
})
|
|
50
47
|
]
|
|
51
48
|
}) : null
|
|
52
49
|
]
|
|
@@ -54,30 +51,30 @@ export var DateRangePickerInlineCalendar = function(param) {
|
|
|
54
51
|
/*#__PURE__*/ _jsx(Center, {
|
|
55
52
|
py: "sm",
|
|
56
53
|
px: "md",
|
|
57
|
-
children: /*#__PURE__*/ _jsx(DatePicker,
|
|
54
|
+
children: /*#__PURE__*/ _jsx(DatePicker, {
|
|
58
55
|
numberOfColumns: 2,
|
|
59
56
|
type: "range",
|
|
60
57
|
styles: {
|
|
61
58
|
calendar: {
|
|
62
59
|
cell: {
|
|
63
|
-
textAlign:
|
|
60
|
+
textAlign: 'center'
|
|
64
61
|
}
|
|
65
62
|
}
|
|
66
63
|
},
|
|
67
64
|
firstDayOfWeek: 0,
|
|
68
|
-
allowSingleDateInRange: true
|
|
69
|
-
|
|
65
|
+
allowSingleDateInRange: true,
|
|
66
|
+
...rangeCalendarProps,
|
|
67
|
+
...calendarInputProps
|
|
68
|
+
})
|
|
70
69
|
}),
|
|
71
70
|
/*#__PURE__*/ _jsxs(Group, {
|
|
72
71
|
position: "right",
|
|
73
72
|
spacing: "xs",
|
|
74
73
|
px: "md",
|
|
75
74
|
py: "sm",
|
|
76
|
-
sx:
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
};
|
|
80
|
-
},
|
|
75
|
+
sx: (theme)=>({
|
|
76
|
+
borderTop: `1px solid ${theme.colors.gray[2]}`
|
|
77
|
+
}),
|
|
81
78
|
children: [
|
|
82
79
|
/*#__PURE__*/ _jsx(Button, {
|
|
83
80
|
variant: "outline",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/date-range-picker/DateRangePickerInlineCalendar.tsx"],"sourcesContent":["import {Center, Group, Space} from '@mantine/core';\nimport {DatePicker, DatePickerBaseProps} from '@mantine/dates';\nimport {useForm} from '@mantine/form';\n\nimport {Button} from '../button';\nimport {DateRangePickerPreset, DateRangePickerPresetSelect} from './DateRangePickerPresetSelect';\nimport {EditableDateRangePicker, EditableDateRangePickerProps} from './EditableDateRangePicker';\n\nexport type DateRangePickerValue = [Date | null, Date | null];\nexport interface DateRangePickerInlineCalendarProps\n extends Pick<EditableDateRangePickerProps, 'startProps' | 'endProps'> {\n /**\n * Initial selected range\n */\n initialRange: DateRangePickerValue;\n /**\n * Function called when the user applies the new date range\n *\n * @param range the newly selected dates\n */\n onApply: (range: DateRangePickerValue) => void;\n /**\n * Function called when the user click on the cancel button\n */\n onCancel: () => void;\n /**\n * The presets to display\n *\n * @default {}\n * @example\n * {\n * january: {label: 'January', range: [new Date(2022, 0, 1), new Date(2022, 0, 31)]},\n * february: {label: 'February', range: [new Date(2022, 1, 1), new Date(2022, 1, 28)]}\n * }\n */\n presets?: Record<string, DateRangePickerPreset>;\n /**\n * Props for RangeCalendar displayed in the popover\n */\n rangeCalendarProps?: Omit<\n DatePickerBaseProps,\n 'value' | 'onChange' | 'isDateInRange' | 'isDateFirstInRange' | 'isDateLastInRange'\n >;\n}\n\nexport const DateRangePickerInlineCalendar = ({\n initialRange,\n onApply,\n onCancel,\n presets,\n startProps,\n endProps,\n rangeCalendarProps,\n}: DateRangePickerInlineCalendarProps) => {\n const form = useForm({\n initialValues: {\n dates: initialRange,\n },\n });\n const calendarInputProps = form.getInputProps('dates');\n\n const onCalendarApply = () => {\n if (!form.values.dates[1]) {\n form.values.dates[1] = form.values.dates[0]; // when date range is the same day\n }\n onApply(form.values.dates);\n };\n\n return (\n <>\n <Group\n align=\"center\"\n spacing=\"xs\"\n grow\n px=\"md\"\n py=\"sm\"\n sx={(theme) => ({\n borderBottom: `1px solid ${theme.colors.gray[2]}`,\n })}\n >\n <EditableDateRangePicker {...calendarInputProps} startProps={startProps} endProps={endProps} />\n {presets ? (\n <>\n <Space w=\"sm\" />\n <DateRangePickerPresetSelect presets={presets} {...calendarInputProps} />\n </>\n ) : null}\n </Group>\n\n <Center py=\"sm\" px=\"md\">\n <DatePicker\n numberOfColumns={2}\n type=\"range\"\n styles={{calendar: {cell: {textAlign: 'center'}}}}\n firstDayOfWeek={0}\n allowSingleDateInRange\n {...rangeCalendarProps}\n {...calendarInputProps}\n />\n </Center>\n\n <Group\n position=\"right\"\n spacing=\"xs\"\n px=\"md\"\n py=\"sm\"\n sx={(theme) => ({\n borderTop: `1px solid ${theme.colors.gray[2]}`,\n })}\n >\n <Button variant=\"outline\" size=\"xs\" onClick={onCancel}>\n Cancel\n </Button>\n <Button size=\"xs\" onClick={onCalendarApply}>\n Apply\n </Button>\n </Group>\n </>\n );\n};\n"],"names":["Center","Group","Space","DatePicker","useForm","Button","DateRangePickerPresetSelect","EditableDateRangePicker","DateRangePickerInlineCalendar","initialRange","onApply","onCancel","presets","startProps","endProps","rangeCalendarProps","form","initialValues","dates","calendarInputProps","getInputProps","onCalendarApply","values","align","spacing","grow","px","py","sx","theme","borderBottom","colors","gray","w","numberOfColumns","type","styles","calendar","cell","textAlign","firstDayOfWeek","allowSingleDateInRange","position","borderTop","variant","size","onClick"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/date-range-picker/DateRangePickerInlineCalendar.tsx"],"sourcesContent":["import {Center, Group, Space} from '@mantine/core';\nimport {DatePicker, DatePickerBaseProps} from '@mantine/dates';\nimport {useForm} from '@mantine/form';\n\nimport {Button} from '../button';\nimport {DateRangePickerPreset, DateRangePickerPresetSelect} from './DateRangePickerPresetSelect';\nimport {EditableDateRangePicker, EditableDateRangePickerProps} from './EditableDateRangePicker';\n\nexport type DateRangePickerValue = [Date | null, Date | null];\nexport interface DateRangePickerInlineCalendarProps\n extends Pick<EditableDateRangePickerProps, 'startProps' | 'endProps'> {\n /**\n * Initial selected range\n */\n initialRange: DateRangePickerValue;\n /**\n * Function called when the user applies the new date range\n *\n * @param range the newly selected dates\n */\n onApply: (range: DateRangePickerValue) => void;\n /**\n * Function called when the user click on the cancel button\n */\n onCancel: () => void;\n /**\n * The presets to display\n *\n * @default {}\n * @example\n * {\n * january: {label: 'January', range: [new Date(2022, 0, 1), new Date(2022, 0, 31)]},\n * february: {label: 'February', range: [new Date(2022, 1, 1), new Date(2022, 1, 28)]}\n * }\n */\n presets?: Record<string, DateRangePickerPreset>;\n /**\n * Props for RangeCalendar displayed in the popover\n */\n rangeCalendarProps?: Omit<\n DatePickerBaseProps,\n 'value' | 'onChange' | 'isDateInRange' | 'isDateFirstInRange' | 'isDateLastInRange'\n >;\n}\n\nexport const DateRangePickerInlineCalendar = ({\n initialRange,\n onApply,\n onCancel,\n presets,\n startProps,\n endProps,\n rangeCalendarProps,\n}: DateRangePickerInlineCalendarProps) => {\n const form = useForm({\n initialValues: {\n dates: initialRange,\n },\n });\n const calendarInputProps = form.getInputProps('dates');\n\n const onCalendarApply = () => {\n if (!form.values.dates[1]) {\n form.values.dates[1] = form.values.dates[0]; // when date range is the same day\n }\n onApply(form.values.dates);\n };\n\n return (\n <>\n <Group\n align=\"center\"\n spacing=\"xs\"\n grow\n px=\"md\"\n py=\"sm\"\n sx={(theme) => ({\n borderBottom: `1px solid ${theme.colors.gray[2]}`,\n })}\n >\n <EditableDateRangePicker {...calendarInputProps} startProps={startProps} endProps={endProps} />\n {presets ? (\n <>\n <Space w=\"sm\" />\n <DateRangePickerPresetSelect presets={presets} {...calendarInputProps} />\n </>\n ) : null}\n </Group>\n\n <Center py=\"sm\" px=\"md\">\n <DatePicker\n numberOfColumns={2}\n type=\"range\"\n styles={{calendar: {cell: {textAlign: 'center'}}}}\n firstDayOfWeek={0}\n allowSingleDateInRange\n {...rangeCalendarProps}\n {...calendarInputProps}\n />\n </Center>\n\n <Group\n position=\"right\"\n spacing=\"xs\"\n px=\"md\"\n py=\"sm\"\n sx={(theme) => ({\n borderTop: `1px solid ${theme.colors.gray[2]}`,\n })}\n >\n <Button variant=\"outline\" size=\"xs\" onClick={onCancel}>\n Cancel\n </Button>\n <Button size=\"xs\" onClick={onCalendarApply}>\n Apply\n </Button>\n </Group>\n </>\n );\n};\n"],"names":["Center","Group","Space","DatePicker","useForm","Button","DateRangePickerPresetSelect","EditableDateRangePicker","DateRangePickerInlineCalendar","initialRange","onApply","onCancel","presets","startProps","endProps","rangeCalendarProps","form","initialValues","dates","calendarInputProps","getInputProps","onCalendarApply","values","align","spacing","grow","px","py","sx","theme","borderBottom","colors","gray","w","numberOfColumns","type","styles","calendar","cell","textAlign","firstDayOfWeek","allowSingleDateInRange","position","borderTop","variant","size","onClick"],"mappings":";AAAA,SAAQA,MAAM,EAAEC,KAAK,EAAEC,KAAK,QAAO,gBAAgB;AACnD,SAAQC,UAAU,QAA4B,iBAAiB;AAC/D,SAAQC,OAAO,QAAO,gBAAgB;AAEtC,SAAQC,MAAM,QAAO,YAAY;AACjC,SAA+BC,2BAA2B,QAAO,gCAAgC;AACjG,SAAQC,uBAAuB,QAAqC,4BAA4B;AAuChG,OAAO,MAAMC,gCAAgC,CAAC,EAC1CC,YAAY,EACZC,OAAO,EACPC,QAAQ,EACRC,OAAO,EACPC,UAAU,EACVC,QAAQ,EACRC,kBAAkB,EACe;IACjC,MAAMC,OAAOZ,QAAQ;QACjBa,eAAe;YACXC,OAAOT;QACX;IACJ;IACA,MAAMU,qBAAqBH,KAAKI,aAAa,CAAC;IAE9C,MAAMC,kBAAkB;QACpB,IAAI,CAACL,KAAKM,MAAM,CAACJ,KAAK,CAAC,EAAE,EAAE;YACvBF,KAAKM,MAAM,CAACJ,KAAK,CAAC,EAAE,GAAGF,KAAKM,MAAM,CAACJ,KAAK,CAAC,EAAE,EAAE,kCAAkC;QACnF;QACAR,QAAQM,KAAKM,MAAM,CAACJ,KAAK;IAC7B;IAEA,qBACI;;0BACI,MAACjB;gBACGsB,OAAM;gBACNC,SAAQ;gBACRC,IAAI;gBACJC,IAAG;gBACHC,IAAG;gBACHC,IAAI,CAACC,QAAW,CAAA;wBACZC,cAAc,CAAC,UAAU,EAAED,MAAME,MAAM,CAACC,IAAI,CAAC,EAAE,CAAC,CAAC;oBACrD,CAAA;;kCAEA,KAACzB;wBAAyB,GAAGY,kBAAkB;wBAAEN,YAAYA;wBAAYC,UAAUA;;oBAClFF,wBACG;;0CACI,KAACV;gCAAM+B,GAAE;;0CACT,KAAC3B;gCAA4BM,SAASA;gCAAU,GAAGO,kBAAkB;;;yBAEzE;;;0BAGR,KAACnB;gBAAO2B,IAAG;gBAAKD,IAAG;0BACf,cAAA,KAACvB;oBACG+B,iBAAiB;oBACjBC,MAAK;oBACLC,QAAQ;wBAACC,UAAU;4BAACC,MAAM;gCAACC,WAAW;4BAAQ;wBAAC;oBAAC;oBAChDC,gBAAgB;oBAChBC,sBAAsB;oBACrB,GAAG1B,kBAAkB;oBACrB,GAAGI,kBAAkB;;;0BAI9B,MAAClB;gBACGyC,UAAS;gBACTlB,SAAQ;gBACRE,IAAG;gBACHC,IAAG;gBACHC,IAAI,CAACC,QAAW,CAAA;wBACZc,WAAW,CAAC,UAAU,EAAEd,MAAME,MAAM,CAACC,IAAI,CAAC,EAAE,CAAC,CAAC;oBAClD,CAAA;;kCAEA,KAAC3B;wBAAOuC,SAAQ;wBAAUC,MAAK;wBAAKC,SAASnC;kCAAU;;kCAGvD,KAACN;wBAAOwC,MAAK;wBAAKC,SAASzB;kCAAiB;;;;;;AAM5D,EAAE"}
|
|
@@ -1,30 +1,24 @@
|
|
|
1
|
-
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
2
|
-
import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
|
|
3
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
4
|
-
import { Group, Popover, Space } from
|
|
5
|
-
import { DatePicker } from
|
|
6
|
-
import { useClickOutside, useUncontrolled } from
|
|
7
|
-
import { useState } from
|
|
8
|
-
import { DateRangePickerPresetSelect } from
|
|
9
|
-
import { EditableDateRangePicker } from
|
|
10
|
-
export
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
value: value,
|
|
18
|
-
defaultValue: defaultValue,
|
|
19
|
-
onChange: onChange,
|
|
2
|
+
import { Group, Popover, Space } from '@mantine/core';
|
|
3
|
+
import { DatePicker } from '@mantine/dates';
|
|
4
|
+
import { useClickOutside, useUncontrolled } from '@mantine/hooks';
|
|
5
|
+
import { useState } from 'react';
|
|
6
|
+
import { DateRangePickerPresetSelect } from './DateRangePickerPresetSelect';
|
|
7
|
+
import { EditableDateRangePicker } from './EditableDateRangePicker';
|
|
8
|
+
export const DateRangePickerPopoverCalendar = ({ presets, value, defaultValue, onChange, startProps, endProps, rangeCalendarProps })=>{
|
|
9
|
+
const [opened, setOpened] = useState(false);
|
|
10
|
+
const ref = useClickOutside(()=>setOpened(false));
|
|
11
|
+
const [_value, handleChange] = useUncontrolled({
|
|
12
|
+
value,
|
|
13
|
+
defaultValue,
|
|
14
|
+
onChange,
|
|
20
15
|
finalValue: [
|
|
21
16
|
null,
|
|
22
17
|
null
|
|
23
18
|
]
|
|
24
|
-
})
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
(_handleChange = handleChange) === null || _handleChange === void 0 ? void 0 : _handleChange(dates);
|
|
19
|
+
});
|
|
20
|
+
const onCalendarChange = (dates)=>{
|
|
21
|
+
handleChange?.(dates);
|
|
28
22
|
if (dates[1] !== null) {
|
|
29
23
|
setOpened(false);
|
|
30
24
|
}
|
|
@@ -37,9 +31,7 @@ export var DateRangePickerPopoverCalendar = function(param) {
|
|
|
37
31
|
/*#__PURE__*/ _jsx(EditableDateRangePicker, {
|
|
38
32
|
value: _value,
|
|
39
33
|
onChange: handleChange,
|
|
40
|
-
onFocus:
|
|
41
|
-
return setOpened(true);
|
|
42
|
-
},
|
|
34
|
+
onFocus: ()=>setOpened(true),
|
|
43
35
|
startProps: startProps,
|
|
44
36
|
endProps: endProps
|
|
45
37
|
}),
|
|
@@ -62,13 +54,13 @@ export var DateRangePickerPopoverCalendar = function(param) {
|
|
|
62
54
|
onChange: setOpened,
|
|
63
55
|
trapFocus: true,
|
|
64
56
|
children: /*#__PURE__*/ _jsx(Popover.Dropdown, {
|
|
65
|
-
children: /*#__PURE__*/ _jsx(DatePicker,
|
|
57
|
+
children: /*#__PURE__*/ _jsx(DatePicker, {
|
|
66
58
|
ref: ref,
|
|
67
59
|
type: "range",
|
|
68
60
|
styles: {
|
|
69
61
|
calendar: {
|
|
70
62
|
cell: {
|
|
71
|
-
textAlign:
|
|
63
|
+
textAlign: 'center'
|
|
72
64
|
}
|
|
73
65
|
}
|
|
74
66
|
},
|
|
@@ -76,8 +68,9 @@ export var DateRangePickerPopoverCalendar = function(param) {
|
|
|
76
68
|
firstDayOfWeek: 0,
|
|
77
69
|
allowSingleDateInRange: true,
|
|
78
70
|
value: _value,
|
|
79
|
-
onChange: onCalendarChange
|
|
80
|
-
|
|
71
|
+
onChange: onCalendarChange,
|
|
72
|
+
...rangeCalendarProps
|
|
73
|
+
})
|
|
81
74
|
})
|
|
82
75
|
})
|
|
83
76
|
]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/date-range-picker/DateRangePickerPopoverCalendar.tsx"],"sourcesContent":["import {Group, Popover, Space} from '@mantine/core';\nimport {CalendarBaseProps, DatePicker} from '@mantine/dates';\nimport {useClickOutside, useUncontrolled} from '@mantine/hooks';\nimport {useState} from 'react';\n\nimport {DateRangePickerValue} from './DateRangePickerInlineCalendar';\nimport {DateRangePickerPreset, DateRangePickerPresetSelect} from './DateRangePickerPresetSelect';\nimport {EditableDateRangePicker, EditableDateRangePickerProps} from './EditableDateRangePicker';\n\ninterface DateRangePickerPopoverCalendarProps<T> extends Pick<EditableDateRangePickerProps, 'startProps' | 'endProps'> {\n /** Default value for uncontrolled input */\n defaultValue?: DateRangePickerValue;\n /** Value for controlled input */\n value?: DateRangePickerValue;\n /** onChange value for controlled input */\n onChange?(value: DateRangePickerValue): void;\n /**\n * The presets to display\n *\n * @default {}\n * @example\n * {\n * january: {label: 'January', range: [new Date(2022, 0, 1), new Date(2022, 0, 31)]},\n * february: {label: 'February', range: [new Date(2022, 1, 1), new Date(2022, 1, 28)]}\n * }\n */\n presets?: Record<string, DateRangePickerPreset>;\n\n /**\n * Props for RangeCalendar\n */\n rangeCalendarProps?: Omit<\n CalendarBaseProps,\n 'value' | 'onChange' | 'isDateInRange' | 'isDateFirstInRange' | 'isDateLastInRange'\n >;\n}\n\nexport const DateRangePickerPopoverCalendar = <T extends unknown>({\n presets,\n value,\n defaultValue,\n onChange,\n startProps,\n endProps,\n rangeCalendarProps,\n}: DateRangePickerPopoverCalendarProps<T>) => {\n const [opened, setOpened] = useState(false);\n const ref = useClickOutside(() => setOpened(false));\n\n const [_value, handleChange] = useUncontrolled<DateRangePickerValue>({\n value,\n defaultValue,\n onChange,\n finalValue: [null, null],\n });\n\n const onCalendarChange = (dates: DateRangePickerValue) => {\n handleChange?.(dates);\n if (dates[1] !== null) {\n setOpened(false);\n }\n };\n\n return (\n <>\n <Group align=\"center\">\n <EditableDateRangePicker\n value={_value}\n onChange={handleChange}\n onFocus={() => setOpened(true)}\n startProps={startProps}\n endProps={endProps}\n />\n {presets ? (\n <>\n <Space w=\"sm\" />\n <DateRangePickerPresetSelect presets={presets} value={_value} onChange={handleChange} />\n </>\n ) : null}\n </Group>\n\n <Popover opened={opened} onChange={setOpened} trapFocus>\n <Popover.Dropdown>\n <DatePicker\n ref={ref}\n type=\"range\"\n styles={{calendar: {cell: {textAlign: 'center'}}}}\n numberOfColumns={2}\n firstDayOfWeek={0}\n allowSingleDateInRange\n value={_value}\n onChange={onCalendarChange}\n {...rangeCalendarProps}\n />\n </Popover.Dropdown>\n </Popover>\n </>\n );\n};\n"],"names":["Group","Popover","Space","DatePicker","useClickOutside","useUncontrolled","useState","DateRangePickerPresetSelect","EditableDateRangePicker","DateRangePickerPopoverCalendar","presets","value","defaultValue","onChange","startProps","endProps","rangeCalendarProps","opened","setOpened","ref","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/date-range-picker/DateRangePickerPopoverCalendar.tsx"],"sourcesContent":["import {Group, Popover, Space} from '@mantine/core';\nimport {CalendarBaseProps, DatePicker} from '@mantine/dates';\nimport {useClickOutside, useUncontrolled} from '@mantine/hooks';\nimport {useState} from 'react';\n\nimport {DateRangePickerValue} from './DateRangePickerInlineCalendar';\nimport {DateRangePickerPreset, DateRangePickerPresetSelect} from './DateRangePickerPresetSelect';\nimport {EditableDateRangePicker, EditableDateRangePickerProps} from './EditableDateRangePicker';\n\ninterface DateRangePickerPopoverCalendarProps<T> extends Pick<EditableDateRangePickerProps, 'startProps' | 'endProps'> {\n /** Default value for uncontrolled input */\n defaultValue?: DateRangePickerValue;\n /** Value for controlled input */\n value?: DateRangePickerValue;\n /** onChange value for controlled input */\n onChange?(value: DateRangePickerValue): void;\n /**\n * The presets to display\n *\n * @default {}\n * @example\n * {\n * january: {label: 'January', range: [new Date(2022, 0, 1), new Date(2022, 0, 31)]},\n * february: {label: 'February', range: [new Date(2022, 1, 1), new Date(2022, 1, 28)]}\n * }\n */\n presets?: Record<string, DateRangePickerPreset>;\n\n /**\n * Props for RangeCalendar\n */\n rangeCalendarProps?: Omit<\n CalendarBaseProps,\n 'value' | 'onChange' | 'isDateInRange' | 'isDateFirstInRange' | 'isDateLastInRange'\n >;\n}\n\nexport const DateRangePickerPopoverCalendar = <T extends unknown>({\n presets,\n value,\n defaultValue,\n onChange,\n startProps,\n endProps,\n rangeCalendarProps,\n}: DateRangePickerPopoverCalendarProps<T>) => {\n const [opened, setOpened] = useState(false);\n const ref = useClickOutside(() => setOpened(false));\n\n const [_value, handleChange] = useUncontrolled<DateRangePickerValue>({\n value,\n defaultValue,\n onChange,\n finalValue: [null, null],\n });\n\n const onCalendarChange = (dates: DateRangePickerValue) => {\n handleChange?.(dates);\n if (dates[1] !== null) {\n setOpened(false);\n }\n };\n\n return (\n <>\n <Group align=\"center\">\n <EditableDateRangePicker\n value={_value}\n onChange={handleChange}\n onFocus={() => setOpened(true)}\n startProps={startProps}\n endProps={endProps}\n />\n {presets ? (\n <>\n <Space w=\"sm\" />\n <DateRangePickerPresetSelect presets={presets} value={_value} onChange={handleChange} />\n </>\n ) : null}\n </Group>\n\n <Popover opened={opened} onChange={setOpened} trapFocus>\n <Popover.Dropdown>\n <DatePicker\n ref={ref}\n type=\"range\"\n styles={{calendar: {cell: {textAlign: 'center'}}}}\n numberOfColumns={2}\n firstDayOfWeek={0}\n allowSingleDateInRange\n value={_value}\n onChange={onCalendarChange}\n {...rangeCalendarProps}\n />\n </Popover.Dropdown>\n </Popover>\n </>\n );\n};\n"],"names":["Group","Popover","Space","DatePicker","useClickOutside","useUncontrolled","useState","DateRangePickerPresetSelect","EditableDateRangePicker","DateRangePickerPopoverCalendar","presets","value","defaultValue","onChange","startProps","endProps","rangeCalendarProps","opened","setOpened","ref","_value","handleChange","finalValue","onCalendarChange","dates","align","onFocus","w","trapFocus","Dropdown","type","styles","calendar","cell","textAlign","numberOfColumns","firstDayOfWeek","allowSingleDateInRange"],"mappings":";AAAA,SAAQA,KAAK,EAAEC,OAAO,EAAEC,KAAK,QAAO,gBAAgB;AACpD,SAA2BC,UAAU,QAAO,iBAAiB;AAC7D,SAAQC,eAAe,EAAEC,eAAe,QAAO,iBAAiB;AAChE,SAAQC,QAAQ,QAAO,QAAQ;AAG/B,SAA+BC,2BAA2B,QAAO,gCAAgC;AACjG,SAAQC,uBAAuB,QAAqC,4BAA4B;AA8BhG,OAAO,MAAMC,iCAAiC,CAAoB,EAC9DC,OAAO,EACPC,KAAK,EACLC,YAAY,EACZC,QAAQ,EACRC,UAAU,EACVC,QAAQ,EACRC,kBAAkB,EACmB;IACrC,MAAM,CAACC,QAAQC,UAAU,GAAGZ,SAAS;IACrC,MAAMa,MAAMf,gBAAgB,IAAMc,UAAU;IAE5C,MAAM,CAACE,QAAQC,aAAa,GAAGhB,gBAAsC;QACjEM;QACAC;QACAC;QACAS,YAAY;YAAC;YAAM;SAAK;IAC5B;IAEA,MAAMC,mBAAmB,CAACC;QACtBH,eAAeG;QACf,IAAIA,KAAK,CAAC,EAAE,KAAK,MAAM;YACnBN,UAAU;QACd;IACJ;IAEA,qBACI;;0BACI,MAAClB;gBAAMyB,OAAM;;kCACT,KAACjB;wBACGG,OAAOS;wBACPP,UAAUQ;wBACVK,SAAS,IAAMR,UAAU;wBACzBJ,YAAYA;wBACZC,UAAUA;;oBAEbL,wBACG;;0CACI,KAACR;gCAAMyB,GAAE;;0CACT,KAACpB;gCAA4BG,SAASA;gCAASC,OAAOS;gCAAQP,UAAUQ;;;yBAE5E;;;0BAGR,KAACpB;gBAAQgB,QAAQA;gBAAQJ,UAAUK;gBAAWU,SAAS;0BACnD,cAAA,KAAC3B,QAAQ4B,QAAQ;8BACb,cAAA,KAAC1B;wBACGgB,KAAKA;wBACLW,MAAK;wBACLC,QAAQ;4BAACC,UAAU;gCAACC,MAAM;oCAACC,WAAW;gCAAQ;4BAAC;wBAAC;wBAChDC,iBAAiB;wBACjBC,gBAAgB;wBAChBC,sBAAsB;wBACtB1B,OAAOS;wBACPP,UAAUU;wBACT,GAAGP,kBAAkB;;;;;;AAM9C,EAAE"}
|
|
@@ -1,54 +1,43 @@
|
|
|
1
|
-
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
2
|
-
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
3
|
-
import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
|
|
4
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
import { Select } from
|
|
6
|
-
import dayjs from
|
|
7
|
-
import { useEffect, useState } from
|
|
8
|
-
export
|
|
9
|
-
|
|
10
|
-
var selectData = Object.entries(presets).map(function(param) {
|
|
11
|
-
var _param = _sliced_to_array(param, 2), val = _param[0], label = _param[1].label;
|
|
12
|
-
return {
|
|
2
|
+
import { Select } from '@mantine/core';
|
|
3
|
+
import dayjs from 'dayjs';
|
|
4
|
+
import { useEffect, useState } from 'react';
|
|
5
|
+
export const DateRangePickerPresetSelect = ({ presets, value, onChange, selectProps = {} })=>{
|
|
6
|
+
const selectData = Object.entries(presets).map(([val, { label }])=>({
|
|
13
7
|
value: val,
|
|
14
|
-
label
|
|
15
|
-
};
|
|
16
|
-
|
|
17
|
-
var getSelectedPreset = function() {
|
|
8
|
+
label
|
|
9
|
+
}));
|
|
10
|
+
const getSelectedPreset = ()=>{
|
|
18
11
|
if (value[0] !== null && value[1] !== null && dayjs(value[0]).unix() !== dayjs(value[1]).unix()) {
|
|
19
|
-
|
|
20
|
-
var _param = _sliced_to_array(param, 2), id = _param[0], range = _param[1].range;
|
|
21
|
-
return dayjs(range[0]).isSame(value[0]) && dayjs(value[1]).isSame(value[1]);
|
|
22
|
-
});
|
|
12
|
+
const selected = Object.entries(presets).find(([id, { range }])=>dayjs(range[0]).isSame(value[0]) && dayjs(value[1]).isSame(value[1]));
|
|
23
13
|
if (selected) {
|
|
24
14
|
return selected[0];
|
|
25
15
|
}
|
|
26
16
|
}
|
|
27
17
|
return null;
|
|
28
18
|
};
|
|
29
|
-
|
|
30
|
-
useEffect(
|
|
31
|
-
|
|
19
|
+
const [selectedPreset, setSelectedPreset] = useState(getSelectedPreset());
|
|
20
|
+
useEffect(()=>{
|
|
21
|
+
const newPreset = getSelectedPreset();
|
|
32
22
|
if (newPreset !== selectedPreset) {
|
|
33
23
|
setSelectedPreset(newPreset);
|
|
34
24
|
}
|
|
35
25
|
}, [
|
|
36
26
|
value
|
|
37
27
|
]);
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
(_onChange = onChange) === null || _onChange === void 0 ? void 0 : _onChange(range);
|
|
28
|
+
const onChangePreset = (presetId)=>{
|
|
29
|
+
const range = presets[presetId].range;
|
|
30
|
+
onChange?.(range);
|
|
42
31
|
};
|
|
43
|
-
return /*#__PURE__*/ _jsx(Select,
|
|
32
|
+
return /*#__PURE__*/ _jsx(Select, {
|
|
44
33
|
label: "Date range",
|
|
45
|
-
placeholder: "Select a date range"
|
|
46
|
-
|
|
34
|
+
placeholder: "Select a date range",
|
|
35
|
+
...selectProps,
|
|
47
36
|
value: selectedPreset,
|
|
48
37
|
onChange: onChangePreset,
|
|
49
38
|
data: selectData,
|
|
50
39
|
maxDropdownHeight: 240
|
|
51
|
-
})
|
|
40
|
+
});
|
|
52
41
|
};
|
|
53
42
|
|
|
54
43
|
//# sourceMappingURL=DateRangePickerPresetSelect.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/date-range-picker/DateRangePickerPresetSelect.tsx"],"sourcesContent":["import {Select, SelectItem, SelectProps} from '@mantine/core';\nimport dayjs from 'dayjs';\nimport {useEffect, useState} from 'react';\nimport {DateRangePickerValue} from './DateRangePickerInlineCalendar';\n\nexport interface DateRangePickerPreset {\n label: string;\n range: DateRangePickerValue;\n}\n\ninterface DateRangePickerPresetsSelectProps<T> {\n presets: Record<string, DateRangePickerPreset>;\n value: DateRangePickerValue;\n onChange?(value: DateRangePickerValue): void;\n selectProps?: Partial<Omit<SelectProps, 'data' | 'value' | 'onChange'>>;\n}\n\nexport const DateRangePickerPresetSelect = <T extends unknown>({\n presets,\n value,\n onChange,\n selectProps = {},\n}: DateRangePickerPresetsSelectProps<T>) => {\n const selectData: SelectItem[] = Object.entries(presets).map(([val, {label}]) => ({value: val, label}));\n\n const getSelectedPreset = () => {\n if (value[0] !== null && value[1] !== null && dayjs(value[0]).unix() !== dayjs(value[1]).unix()) {\n const selected = Object.entries(presets).find(\n ([id, {range}]) => dayjs(range[0]!).isSame(value[0]) && dayjs(value[1]!).isSame(value[1]!),\n );\n if (selected) {\n return selected[0];\n }\n }\n return null;\n };\n\n const [selectedPreset, setSelectedPreset] = useState<string | null>(getSelectedPreset());\n\n useEffect(() => {\n const newPreset = getSelectedPreset();\n if (newPreset !== selectedPreset) {\n setSelectedPreset(newPreset);\n }\n }, [value]);\n\n const onChangePreset = (presetId: keyof typeof presets) => {\n const range = presets[presetId].range as any;\n onChange?.(range);\n };\n\n return (\n <Select\n label=\"Date range\"\n placeholder=\"Select a date range\"\n {...selectProps}\n value={selectedPreset}\n onChange={onChangePreset}\n data={selectData}\n maxDropdownHeight={240}\n />\n );\n};\n"],"names":["Select","dayjs","useEffect","useState","DateRangePickerPresetSelect","presets","value","onChange","selectProps","selectData","Object","entries","map","val","label","getSelectedPreset","unix","selected","find","id","range","isSame","selectedPreset","setSelectedPreset","newPreset","onChangePreset","presetId","placeholder","data","maxDropdownHeight"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/date-range-picker/DateRangePickerPresetSelect.tsx"],"sourcesContent":["import {Select, SelectItem, SelectProps} from '@mantine/core';\nimport dayjs from 'dayjs';\nimport {useEffect, useState} from 'react';\nimport {DateRangePickerValue} from './DateRangePickerInlineCalendar';\n\nexport interface DateRangePickerPreset {\n label: string;\n range: DateRangePickerValue;\n}\n\ninterface DateRangePickerPresetsSelectProps<T> {\n presets: Record<string, DateRangePickerPreset>;\n value: DateRangePickerValue;\n onChange?(value: DateRangePickerValue): void;\n selectProps?: Partial<Omit<SelectProps, 'data' | 'value' | 'onChange'>>;\n}\n\nexport const DateRangePickerPresetSelect = <T extends unknown>({\n presets,\n value,\n onChange,\n selectProps = {},\n}: DateRangePickerPresetsSelectProps<T>) => {\n const selectData: SelectItem[] = Object.entries(presets).map(([val, {label}]) => ({value: val, label}));\n\n const getSelectedPreset = () => {\n if (value[0] !== null && value[1] !== null && dayjs(value[0]).unix() !== dayjs(value[1]).unix()) {\n const selected = Object.entries(presets).find(\n ([id, {range}]) => dayjs(range[0]!).isSame(value[0]) && dayjs(value[1]!).isSame(value[1]!),\n );\n if (selected) {\n return selected[0];\n }\n }\n return null;\n };\n\n const [selectedPreset, setSelectedPreset] = useState<string | null>(getSelectedPreset());\n\n useEffect(() => {\n const newPreset = getSelectedPreset();\n if (newPreset !== selectedPreset) {\n setSelectedPreset(newPreset);\n }\n }, [value]);\n\n const onChangePreset = (presetId: keyof typeof presets) => {\n const range = presets[presetId].range as any;\n onChange?.(range);\n };\n\n return (\n <Select\n label=\"Date range\"\n placeholder=\"Select a date range\"\n {...selectProps}\n value={selectedPreset}\n onChange={onChangePreset}\n data={selectData}\n maxDropdownHeight={240}\n />\n );\n};\n"],"names":["Select","dayjs","useEffect","useState","DateRangePickerPresetSelect","presets","value","onChange","selectProps","selectData","Object","entries","map","val","label","getSelectedPreset","unix","selected","find","id","range","isSame","selectedPreset","setSelectedPreset","newPreset","onChangePreset","presetId","placeholder","data","maxDropdownHeight"],"mappings":";AAAA,SAAQA,MAAM,QAAgC,gBAAgB;AAC9D,OAAOC,WAAW,QAAQ;AAC1B,SAAQC,SAAS,EAAEC,QAAQ,QAAO,QAAQ;AAe1C,OAAO,MAAMC,8BAA8B,CAAoB,EAC3DC,OAAO,EACPC,KAAK,EACLC,QAAQ,EACRC,cAAc,CAAC,CAAC,EACmB;IACnC,MAAMC,aAA2BC,OAAOC,OAAO,CAACN,SAASO,GAAG,CAAC,CAAC,CAACC,KAAK,EAACC,KAAK,EAAC,CAAC,GAAM,CAAA;YAACR,OAAOO;YAAKC;QAAK,CAAA;IAEpG,MAAMC,oBAAoB;QACtB,IAAIT,KAAK,CAAC,EAAE,KAAK,QAAQA,KAAK,CAAC,EAAE,KAAK,QAAQL,MAAMK,KAAK,CAAC,EAAE,EAAEU,IAAI,OAAOf,MAAMK,KAAK,CAAC,EAAE,EAAEU,IAAI,IAAI;YAC7F,MAAMC,WAAWP,OAAOC,OAAO,CAACN,SAASa,IAAI,CACzC,CAAC,CAACC,IAAI,EAACC,KAAK,EAAC,CAAC,GAAKnB,MAAMmB,KAAK,CAAC,EAAE,EAAGC,MAAM,CAACf,KAAK,CAAC,EAAE,KAAKL,MAAMK,KAAK,CAAC,EAAE,EAAGe,MAAM,CAACf,KAAK,CAAC,EAAE;YAE5F,IAAIW,UAAU;gBACV,OAAOA,QAAQ,CAAC,EAAE;YACtB;QACJ;QACA,OAAO;IACX;IAEA,MAAM,CAACK,gBAAgBC,kBAAkB,GAAGpB,SAAwBY;IAEpEb,UAAU;QACN,MAAMsB,YAAYT;QAClB,IAAIS,cAAcF,gBAAgB;YAC9BC,kBAAkBC;QACtB;IACJ,GAAG;QAAClB;KAAM;IAEV,MAAMmB,iBAAiB,CAACC;QACpB,MAAMN,QAAQf,OAAO,CAACqB,SAAS,CAACN,KAAK;QACrCb,WAAWa;IACf;IAEA,qBACI,KAACpB;QACGc,OAAM;QACNa,aAAY;QACX,GAAGnB,WAAW;QACfF,OAAOgB;QACPf,UAAUkB;QACVG,MAAMnB;QACNoB,mBAAmB;;AAG/B,EAAE"}
|
|
@@ -1,22 +1,17 @@
|
|
|
1
|
-
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
2
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
-
import { DateInput } from
|
|
4
|
-
import dayjs from
|
|
5
|
-
export
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
(_onChange = onChange) === null || _onChange === void 0 ? void 0 : _onChange([
|
|
11
|
-
dayjs(date).startOf("day").toDate(),
|
|
12
|
-
(_value = value) === null || _value === void 0 ? void 0 : _value[1]
|
|
2
|
+
import { DateInput } from '@mantine/dates';
|
|
3
|
+
import dayjs from 'dayjs';
|
|
4
|
+
export const EditableDateRangePicker = ({ value, onChange, onFocus, separator = 'to', startProps = {}, endProps = {} })=>{
|
|
5
|
+
const onChangeStart = (date)=>{
|
|
6
|
+
onChange?.([
|
|
7
|
+
dayjs(date).startOf('day').toDate(),
|
|
8
|
+
value?.[1]
|
|
13
9
|
]);
|
|
14
10
|
};
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
(
|
|
19
|
-
dayjs(date).endOf("day").toDate()
|
|
11
|
+
const onChangeEnd = (date)=>{
|
|
12
|
+
onChange?.([
|
|
13
|
+
value?.[0],
|
|
14
|
+
dayjs(date).endOf('day').toDate()
|
|
20
15
|
]);
|
|
21
16
|
};
|
|
22
17
|
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
@@ -24,33 +19,37 @@ export var EditableDateRangePicker = function(param) {
|
|
|
24
19
|
/*#__PURE__*/ _jsx(DateInput, {
|
|
25
20
|
clearable: false,
|
|
26
21
|
label: "Start",
|
|
27
|
-
value:
|
|
22
|
+
value: value?.[0],
|
|
28
23
|
onChange: onChangeStart,
|
|
29
24
|
onFocus: onFocus,
|
|
30
25
|
popoverProps: {
|
|
31
26
|
styles: {
|
|
32
27
|
dropdown: {
|
|
33
|
-
display:
|
|
28
|
+
display: 'none'
|
|
34
29
|
}
|
|
35
30
|
}
|
|
36
31
|
},
|
|
37
|
-
styles:
|
|
32
|
+
styles: {
|
|
33
|
+
...startProps.styles
|
|
34
|
+
}
|
|
38
35
|
}),
|
|
39
36
|
separator,
|
|
40
37
|
/*#__PURE__*/ _jsx(DateInput, {
|
|
41
38
|
clearable: false,
|
|
42
39
|
label: "End",
|
|
43
|
-
value:
|
|
40
|
+
value: value?.[1],
|
|
44
41
|
onChange: onChangeEnd,
|
|
45
42
|
onFocus: onFocus,
|
|
46
43
|
popoverProps: {
|
|
47
44
|
styles: {
|
|
48
45
|
dropdown: {
|
|
49
|
-
display:
|
|
46
|
+
display: 'none'
|
|
50
47
|
}
|
|
51
48
|
}
|
|
52
49
|
},
|
|
53
|
-
styles:
|
|
50
|
+
styles: {
|
|
51
|
+
...endProps.styles
|
|
52
|
+
}
|
|
54
53
|
})
|
|
55
54
|
]
|
|
56
55
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/date-range-picker/EditableDateRangePicker.tsx"],"sourcesContent":["import {DateInput, DatePickerProps} from '@mantine/dates';\nimport dayjs from 'dayjs';\nimport {ReactNode} from 'react';\nimport {DateRangePickerValue} from './DateRangePickerInlineCalendar';\n\nexport interface EditableDateRangePickerProps {\n value: DateRangePickerValue;\n onChange?(value: DateRangePickerValue): void;\n onFocus?: () => void;\n separator?: ReactNode;\n /**\n * Props for the start input\n */\n startProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n /**\n * Props for the end input\n */\n endProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n}\n\nexport const EditableDateRangePicker = ({\n value,\n onChange,\n onFocus,\n separator = 'to',\n startProps = {},\n endProps = {},\n}: EditableDateRangePickerProps) => {\n const onChangeStart = (date: Date) => {\n onChange?.([dayjs(date).startOf('day').toDate(), value?.[1]]);\n };\n const onChangeEnd = (date: Date) => {\n onChange?.([value?.[0], dayjs(date).endOf('day').toDate()]);\n };\n\n return (\n <>\n <DateInput\n clearable={false}\n label=\"Start\"\n value={value?.[0]}\n onChange={onChangeStart}\n onFocus={onFocus}\n popoverProps={{styles: {dropdown: {display: 'none'}}}}\n styles={{...startProps.styles}}\n />\n {separator}\n <DateInput\n clearable={false}\n label=\"End\"\n value={value?.[1]}\n onChange={onChangeEnd}\n onFocus={onFocus}\n popoverProps={{styles: {dropdown: {display: 'none'}}}}\n styles={{...endProps.styles}}\n />\n </>\n );\n};\n"],"names":["DateInput","dayjs","EditableDateRangePicker","value","onChange","onFocus","separator","startProps","endProps","onChangeStart","date","startOf","toDate","onChangeEnd","endOf","clearable","label","popoverProps","styles","dropdown","display"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/date-range-picker/EditableDateRangePicker.tsx"],"sourcesContent":["import {DateInput, DatePickerProps} from '@mantine/dates';\nimport dayjs from 'dayjs';\nimport {ReactNode} from 'react';\nimport {DateRangePickerValue} from './DateRangePickerInlineCalendar';\n\nexport interface EditableDateRangePickerProps {\n value: DateRangePickerValue;\n onChange?(value: DateRangePickerValue): void;\n onFocus?: () => void;\n separator?: ReactNode;\n /**\n * Props for the start input\n */\n startProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n /**\n * Props for the end input\n */\n endProps?: Omit<Partial<DatePickerProps>, 'value' | 'onChange' | 'onFocus'>;\n}\n\nexport const EditableDateRangePicker = ({\n value,\n onChange,\n onFocus,\n separator = 'to',\n startProps = {},\n endProps = {},\n}: EditableDateRangePickerProps) => {\n const onChangeStart = (date: Date) => {\n onChange?.([dayjs(date).startOf('day').toDate(), value?.[1]]);\n };\n const onChangeEnd = (date: Date) => {\n onChange?.([value?.[0], dayjs(date).endOf('day').toDate()]);\n };\n\n return (\n <>\n <DateInput\n clearable={false}\n label=\"Start\"\n value={value?.[0]}\n onChange={onChangeStart}\n onFocus={onFocus}\n popoverProps={{styles: {dropdown: {display: 'none'}}}}\n styles={{...startProps.styles}}\n />\n {separator}\n <DateInput\n clearable={false}\n label=\"End\"\n value={value?.[1]}\n onChange={onChangeEnd}\n onFocus={onFocus}\n popoverProps={{styles: {dropdown: {display: 'none'}}}}\n styles={{...endProps.styles}}\n />\n </>\n );\n};\n"],"names":["DateInput","dayjs","EditableDateRangePicker","value","onChange","onFocus","separator","startProps","endProps","onChangeStart","date","startOf","toDate","onChangeEnd","endOf","clearable","label","popoverProps","styles","dropdown","display"],"mappings":";AAAA,SAAQA,SAAS,QAAwB,iBAAiB;AAC1D,OAAOC,WAAW,QAAQ;AAmB1B,OAAO,MAAMC,0BAA0B,CAAC,EACpCC,KAAK,EACLC,QAAQ,EACRC,OAAO,EACPC,YAAY,IAAI,EAChBC,aAAa,CAAC,CAAC,EACfC,WAAW,CAAC,CAAC,EACc;IAC3B,MAAMC,gBAAgB,CAACC;QACnBN,WAAW;YAACH,MAAMS,MAAMC,OAAO,CAAC,OAAOC,MAAM;YAAIT,OAAO,CAAC,EAAE;SAAC;IAChE;IACA,MAAMU,cAAc,CAACH;QACjBN,WAAW;YAACD,OAAO,CAAC,EAAE;YAAEF,MAAMS,MAAMI,KAAK,CAAC,OAAOF,MAAM;SAAG;IAC9D;IAEA,qBACI;;0BACI,KAACZ;gBACGe,WAAW;gBACXC,OAAM;gBACNb,OAAOA,OAAO,CAAC,EAAE;gBACjBC,UAAUK;gBACVJ,SAASA;gBACTY,cAAc;oBAACC,QAAQ;wBAACC,UAAU;4BAACC,SAAS;wBAAM;oBAAC;gBAAC;gBACpDF,QAAQ;oBAAC,GAAGX,WAAWW,MAAM;gBAAA;;YAEhCZ;0BACD,KAACN;gBACGe,WAAW;gBACXC,OAAM;gBACNb,OAAOA,OAAO,CAAC,EAAE;gBACjBC,UAAUS;gBACVR,SAASA;gBACTY,cAAc;oBAACC,QAAQ;wBAACC,UAAU;4BAACC,SAAS;wBAAM;oBAAC;gBAAC;gBACpDF,QAAQ;oBAAC,GAAGV,SAASU,MAAM;gBAAA;;;;AAI3C,EAAE"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export * from
|
|
2
|
-
export * from
|
|
3
|
-
export * from
|
|
1
|
+
export * from './DateRangePickerInlineCalendar';
|
|
2
|
+
export * from './DateRangePickerPopoverCalendar';
|
|
3
|
+
export * from './DateRangePickerPresetSelect';
|
|
4
4
|
|
|
5
5
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,62 +1,42 @@
|
|
|
1
|
-
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
2
|
-
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
3
|
-
import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
|
|
4
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
5
|
-
import { Divider, Group, Stack, Text, Title, useComponentDefaultProps } from
|
|
6
|
-
import { Children } from
|
|
7
|
-
import { useStyles } from
|
|
8
|
-
import { HeaderActions } from
|
|
9
|
-
import { HeaderBreadcrumbs } from
|
|
10
|
-
import { HeaderDocAnchor } from
|
|
11
|
-
|
|
12
|
-
variant:
|
|
13
|
-
position:
|
|
2
|
+
import { Divider, Group, Stack, Text, Title, useComponentDefaultProps } from '@mantine/core';
|
|
3
|
+
import { Children } from 'react';
|
|
4
|
+
import { useStyles } from './Header.styles';
|
|
5
|
+
import { HeaderActions } from './HeaderActions/HeaderActions';
|
|
6
|
+
import { HeaderBreadcrumbs } from './HeaderBreadcrumbs/HeaderBreadcrumbs';
|
|
7
|
+
import { HeaderDocAnchor } from './HeaderDocAnchor/HeaderDocAnchor';
|
|
8
|
+
const defaultProps = {
|
|
9
|
+
variant: 'page',
|
|
10
|
+
position: 'apart',
|
|
14
11
|
noWrap: true
|
|
15
12
|
};
|
|
16
|
-
export
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
"unstyled",
|
|
21
|
-
"className",
|
|
22
|
-
"description",
|
|
23
|
-
"borderBottom",
|
|
24
|
-
"variant",
|
|
25
|
-
"children"
|
|
26
|
-
]);
|
|
27
|
-
var _useStyles = useStyles({
|
|
28
|
-
variant: variant
|
|
13
|
+
export const Header = (props)=>{
|
|
14
|
+
const { classNames, styles, unstyled, className, description, borderBottom, variant, children, ...others } = useComponentDefaultProps('PlasmaHeader', defaultProps, props);
|
|
15
|
+
const { classes, cx } = useStyles({
|
|
16
|
+
variant
|
|
29
17
|
}, {
|
|
30
|
-
name:
|
|
31
|
-
classNames
|
|
32
|
-
styles
|
|
33
|
-
unstyled
|
|
34
|
-
}), classes = _useStyles.classes, cx = _useStyles.cx;
|
|
35
|
-
var convertedChildren = Children.toArray(children);
|
|
36
|
-
var breadcrumbs = convertedChildren.find(function(child) {
|
|
37
|
-
return child.type === HeaderBreadcrumbs;
|
|
38
|
-
});
|
|
39
|
-
var actions = convertedChildren.find(function(child) {
|
|
40
|
-
return child.type === HeaderActions;
|
|
41
|
-
});
|
|
42
|
-
var docAnchor = convertedChildren.find(function(child) {
|
|
43
|
-
return child.type === HeaderDocAnchor;
|
|
44
|
-
});
|
|
45
|
-
var otherChildren = convertedChildren.filter(function(child) {
|
|
46
|
-
return child.type !== HeaderBreadcrumbs && child.type !== HeaderActions && child.type !== HeaderDocAnchor;
|
|
18
|
+
name: 'PlasmaHeader',
|
|
19
|
+
classNames,
|
|
20
|
+
styles,
|
|
21
|
+
unstyled
|
|
47
22
|
});
|
|
23
|
+
const convertedChildren = Children.toArray(children);
|
|
24
|
+
const breadcrumbs = convertedChildren.find((child)=>child.type === HeaderBreadcrumbs);
|
|
25
|
+
const actions = convertedChildren.find((child)=>child.type === HeaderActions);
|
|
26
|
+
const docAnchor = convertedChildren.find((child)=>child.type === HeaderDocAnchor);
|
|
27
|
+
const otherChildren = convertedChildren.filter((child)=>child.type !== HeaderBreadcrumbs && child.type !== HeaderActions && child.type !== HeaderDocAnchor);
|
|
48
28
|
return /*#__PURE__*/ _jsxs(_Fragment, {
|
|
49
29
|
children: [
|
|
50
|
-
/*#__PURE__*/ _jsxs(Group,
|
|
51
|
-
className: cx(className, classes.root)
|
|
52
|
-
|
|
30
|
+
/*#__PURE__*/ _jsxs(Group, {
|
|
31
|
+
className: cx(className, classes.root),
|
|
32
|
+
...others,
|
|
53
33
|
children: [
|
|
54
34
|
/*#__PURE__*/ _jsxs(Stack, {
|
|
55
35
|
spacing: 0,
|
|
56
36
|
children: [
|
|
57
37
|
breadcrumbs,
|
|
58
38
|
/*#__PURE__*/ _jsxs(Title, {
|
|
59
|
-
order: variant ===
|
|
39
|
+
order: variant === 'page' ? 1 : 3,
|
|
60
40
|
className: classes.title,
|
|
61
41
|
children: [
|
|
62
42
|
otherChildren,
|
|
@@ -65,14 +45,14 @@ export var Header = function(props) {
|
|
|
65
45
|
}),
|
|
66
46
|
/*#__PURE__*/ _jsx(Text, {
|
|
67
47
|
className: classes.description,
|
|
68
|
-
size: variant ===
|
|
48
|
+
size: variant === 'page' ? 'md' : 'sm',
|
|
69
49
|
children: description
|
|
70
50
|
})
|
|
71
51
|
]
|
|
72
52
|
}),
|
|
73
53
|
actions
|
|
74
54
|
]
|
|
75
|
-
})
|
|
55
|
+
}),
|
|
76
56
|
borderBottom ? /*#__PURE__*/ _jsx(Divider, {
|
|
77
57
|
className: classes.divider,
|
|
78
58
|
size: "xs"
|