@frontify/fondue 12.0.0-beta.178 → 12.0.0-beta.179

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import { IconSize as r } from "../../foundation/Icon/IconSize.es.js";
1
+ import { IconSize as a } from "../../foundation/Icon/IconSize.es.js";
2
2
  import { format as v, getYear as A } from "date-fns";
3
3
  import e, { forwardRef as H, useState as T } from "react";
4
4
  import V from "react-datepicker";
@@ -10,11 +10,11 @@ import J from "../../foundation/Icon/Generated/IconCaretLeft.es.js";
10
10
  import K from "../../foundation/Icon/Generated/IconCaretRight.es.js";
11
11
  import O from "../../foundation/Icon/Generated/IconCaretRightDouble.es.js";
12
12
  import { Button as i } from "../Button/Button.es.js";
13
- import { ButtonStyle as n, ButtonSize as o, ButtonEmphasis as s } from "../Button/ButtonTypes.es.js";
14
- const Q = (m, a) => m === "single" ? a < new Date() ? "past-date" : "future-date" : "range-day", U = H(
13
+ import { ButtonStyle as o, ButtonSize as s, ButtonEmphasis as n } from "../Button/ButtonTypes.es.js";
14
+ const Q = (m, r) => m === "single" ? r < new Date() ? "past-date" : "future-date" : "range-day", U = H(
15
15
  ({
16
16
  placeHolder: m = "Select a date",
17
- isClearable: a,
17
+ isClearable: r,
18
18
  shouldCloseOnSelect: u,
19
19
  onChange: d,
20
20
  onOpen: l,
@@ -22,9 +22,9 @@ const Q = (m, a) => m === "single" ? a < new Date() ? "past-date" : "future-date
22
22
  onBlur: w,
23
23
  onKeyDown: y,
24
24
  dateFormat: D = "dd MMM yyyy",
25
- value: k,
26
- startDate: E,
27
- endDate: g,
25
+ value: g,
26
+ startDate: k,
27
+ endDate: E,
28
28
  minDate: z,
29
29
  maxDate: C,
30
30
  validation: M = q.Default,
@@ -32,84 +32,87 @@ const Q = (m, a) => m === "single" ? a < new Date() ? "past-date" : "future-date
32
32
  children: S = /* @__PURE__ */ e.createElement(e.Fragment, null),
33
33
  hasPopperArrow: I = !0,
34
34
  preventOpenOnFocus: b = !1,
35
- filterDate: N = () => !0,
36
- variant: f = "single"
37
- }, R) => {
38
- const [W, p] = T(!1), x = () => {
39
- p(!0), l == null || l();
40
- }, B = () => {
41
- p(!1), c == null || c();
35
+ filterDate: x = () => !0,
36
+ variant: p = "single"
37
+ }, N) => {
38
+ const [P, f] = T(!1), R = () => {
39
+ f(!0), l == null || l();
40
+ }, W = () => {
41
+ f(!1), c == null || c();
42
42
  };
43
43
  return /* @__PURE__ */ e.createElement("div", { "data-test-id": "date-picker" }, /* @__PURE__ */ e.createElement(
44
44
  V,
45
45
  {
46
46
  calendarClassName: "tw-rounded-sm tw-border tw-border-line-x-strong react-datepicker-wrap",
47
- selected: k,
48
- startDate: E,
49
- endDate: g,
47
+ selected: g,
48
+ startDate: k,
49
+ endDate: E,
50
50
  minDate: z,
51
51
  maxDate: C,
52
52
  calendarStartDay: 1,
53
53
  onChange: d,
54
54
  onKeyDown: y,
55
55
  onBlur: w,
56
- selectsRange: f === "range",
56
+ selectsRange: p === "range",
57
57
  showPopperArrow: I,
58
58
  preventOpenOnFocus: b,
59
- filterDate: N,
59
+ filterDate: x,
60
60
  customInput: h ?? /* @__PURE__ */ e.createElement(
61
61
  Y,
62
62
  {
63
- isCalendarOpen: W,
64
- isClearable: a,
63
+ isCalendarOpen: P,
64
+ isClearable: r,
65
65
  placeHolder: m,
66
66
  validation: M,
67
67
  onDateChanged: d
68
68
  }
69
69
  ),
70
- ref: R,
70
+ ref: N,
71
71
  formatWeekDay: (t) => t.slice(0, 1),
72
- isClearable: a,
72
+ isClearable: r,
73
73
  dateFormat: D,
74
- onCalendarClose: B,
75
- onCalendarOpen: x,
74
+ onCalendarClose: W,
75
+ onCalendarOpen: R,
76
76
  shouldCloseOnSelect: u,
77
- dayClassName: (t) => Q(f, t),
78
- renderCustomHeader: ({ date: t, decreaseMonth: P, increaseMonth: F, increaseYear: L, decreaseYear: j }) => /* @__PURE__ */ e.createElement("div", { className: "tw-flex tw-justify-between tw-pb-4 tw-px-0" }, /* @__PURE__ */ e.createElement(
77
+ dayClassName: (t) => Q(p, t),
78
+ popperProps: {
79
+ strategy: "fixed"
80
+ },
81
+ renderCustomHeader: ({ date: t, decreaseMonth: B, increaseMonth: F, increaseYear: L, decreaseYear: j }) => /* @__PURE__ */ e.createElement("div", { className: "tw-flex tw-justify-between tw-pb-4 tw-px-0" }, /* @__PURE__ */ e.createElement(
79
82
  i,
80
83
  {
81
- style: n.Default,
82
- size: o.Medium,
84
+ style: o.Default,
85
+ size: s.Medium,
83
86
  onClick: j,
84
- emphasis: s.Weak,
85
- icon: /* @__PURE__ */ e.createElement(G, { size: r.Size20 })
87
+ emphasis: n.Weak,
88
+ icon: /* @__PURE__ */ e.createElement(G, { size: a.Size20 })
86
89
  }
87
90
  ), /* @__PURE__ */ e.createElement(
88
91
  i,
89
92
  {
90
- style: n.Default,
91
- size: o.Medium,
92
- onClick: P,
93
- emphasis: s.Weak,
94
- icon: /* @__PURE__ */ e.createElement(J, { size: r.Size20 })
93
+ style: o.Default,
94
+ size: s.Medium,
95
+ onClick: B,
96
+ emphasis: n.Weak,
97
+ icon: /* @__PURE__ */ e.createElement(J, { size: a.Size20 })
95
98
  }
96
99
  ), /* @__PURE__ */ e.createElement("p", { className: "tw-font-sans tw-font-semibold tw-grow tw-self-center" }, v(t, "MMMM"), " ", A(t)), /* @__PURE__ */ e.createElement(
97
100
  i,
98
101
  {
99
- style: n.Default,
100
- size: o.Medium,
102
+ style: o.Default,
103
+ size: s.Medium,
101
104
  onClick: F,
102
- emphasis: s.Weak,
103
- icon: /* @__PURE__ */ e.createElement(K, { size: r.Size20 })
105
+ emphasis: n.Weak,
106
+ icon: /* @__PURE__ */ e.createElement(K, { size: a.Size20 })
104
107
  }
105
108
  ), /* @__PURE__ */ e.createElement(
106
109
  i,
107
110
  {
108
- style: n.Default,
109
- size: o.Medium,
111
+ style: o.Default,
112
+ size: s.Medium,
110
113
  onClick: L,
111
- emphasis: s.Weak,
112
- icon: /* @__PURE__ */ e.createElement(O, { size: r.Size20 })
114
+ emphasis: n.Weak,
115
+ icon: /* @__PURE__ */ e.createElement(O, { size: a.Size20 })
113
116
  }
114
117
  ))
115
118
  },
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.es.js","sources":["../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Button, ButtonEmphasis, ButtonSize, ButtonStyle } from '@components/Button';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { format, getYear } from 'date-fns';\nimport React, { forwardRef, useState } from 'react';\nimport DatepickerComponent, { ReactDatePicker } from 'react-datepicker';\nimport './DatePicker.css';\nimport { DatePickerTrigger } from './DatePickerTrigger';\nimport { IconCaretLeft, IconCaretLeftDouble, IconCaretRight, IconCaretRightDouble } from '@foundation/Icon/Generated';\nimport { Validation } from '@utilities/validation';\n\ntype SingleDatePickerProps = {\n variant?: 'single';\n onChange: (date: Date | null) => void;\n startDate?: null;\n endDate?: null;\n};\n\ntype RangeDatePickerProps = {\n variant: 'range';\n onChange: (date: [Date | null, Date | null] | null) => void;\n startDate: Date | null;\n endDate: Date | null;\n};\n\nexport type DatePickerProps = {\n placeHolder?: string;\n isClearable?: boolean;\n shouldCloseOnSelect?: boolean;\n dateFormat?: string;\n /** @description when the variant is of type 'range', the value should be the startDate */\n value?: Date | null;\n minDate?: Date;\n maxDate?: Date;\n validation?: Validation;\n customTrigger?: React.ReactNode;\n children?: React.ReactNode;\n hasPopperArrow?: boolean;\n preventOpenOnFocus?: boolean;\n filterDate?: (date: Date) => boolean;\n onOpen?: () => void;\n onClose?: () => void;\n onBlur?: () => void;\n onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;\n} & (SingleDatePickerProps | RangeDatePickerProps);\n\nconst getDayClasses = (variant: DatePickerProps['variant'], date: Date) => {\n if (variant === 'single') {\n return date < new Date() ? 'past-date' : 'future-date';\n }\n return 'range-day';\n};\n\nexport type ReactDatePickerRef = ReactDatePicker<never, boolean>;\n\nexport const DatePicker = forwardRef<ReactDatePicker<never, boolean>, DatePickerProps>(\n (\n {\n placeHolder = 'Select a date',\n isClearable,\n shouldCloseOnSelect,\n onChange,\n onOpen,\n onClose,\n onBlur,\n onKeyDown,\n dateFormat = 'dd MMM yyyy',\n value,\n startDate,\n endDate,\n minDate,\n maxDate,\n validation = Validation.Default,\n customTrigger,\n children = <></>,\n hasPopperArrow = true,\n preventOpenOnFocus = false,\n filterDate = () => true,\n variant = 'single',\n },\n ref,\n ) => {\n const [isCalendarOpen, setIsCalendarOpen] = useState<boolean>(false);\n\n const handleOpen = () => {\n setIsCalendarOpen(true);\n onOpen?.();\n };\n\n const handleClose = () => {\n setIsCalendarOpen(false);\n onClose?.();\n };\n\n return (\n <div data-test-id=\"date-picker\">\n <DatepickerComponent\n calendarClassName=\"tw-rounded-sm tw-border tw-border-line-x-strong react-datepicker-wrap\"\n selected={value}\n startDate={startDate}\n endDate={endDate}\n minDate={minDate}\n maxDate={maxDate}\n calendarStartDay={1}\n onChange={onChange}\n onKeyDown={onKeyDown}\n onBlur={onBlur}\n selectsRange={variant === 'range' ? true : false}\n showPopperArrow={hasPopperArrow}\n preventOpenOnFocus={preventOpenOnFocus}\n filterDate={filterDate}\n customInput={\n customTrigger ?? (\n <DatePickerTrigger\n isCalendarOpen={isCalendarOpen}\n isClearable={isClearable}\n placeHolder={placeHolder}\n validation={validation}\n onDateChanged={onChange}\n />\n )\n }\n ref={ref}\n formatWeekDay={(day) => day.slice(0, 1)}\n isClearable={isClearable}\n dateFormat={dateFormat}\n onCalendarClose={handleClose}\n onCalendarOpen={handleOpen}\n shouldCloseOnSelect={shouldCloseOnSelect}\n dayClassName={(date) => getDayClasses(variant, date)}\n renderCustomHeader={({ date, decreaseMonth, increaseMonth, increaseYear, decreaseYear }) => (\n <div className=\"tw-flex tw-justify-between tw-pb-4 tw-px-0\">\n <Button\n style={ButtonStyle.Default}\n size={ButtonSize.Medium}\n onClick={decreaseYear}\n emphasis={ButtonEmphasis.Weak}\n icon={<IconCaretLeftDouble size={IconSize.Size20} />}\n />\n <Button\n style={ButtonStyle.Default}\n size={ButtonSize.Medium}\n onClick={decreaseMonth}\n emphasis={ButtonEmphasis.Weak}\n icon={<IconCaretLeft size={IconSize.Size20} />}\n />\n <p className=\"tw-font-sans tw-font-semibold tw-grow tw-self-center\">\n {format(date, 'MMMM')} {getYear(date)}\n </p>\n <Button\n style={ButtonStyle.Default}\n size={ButtonSize.Medium}\n onClick={increaseMonth}\n emphasis={ButtonEmphasis.Weak}\n icon={<IconCaretRight size={IconSize.Size20} />}\n />\n <Button\n style={ButtonStyle.Default}\n size={ButtonSize.Medium}\n onClick={increaseYear}\n emphasis={ButtonEmphasis.Weak}\n icon={<IconCaretRightDouble size={IconSize.Size20} />}\n />\n </div>\n )}\n >\n {children}\n </DatepickerComponent>\n </div>\n );\n },\n);\n\nDatePicker.displayName = 'FondueDatePicker';\n"],"names":["getDayClasses","variant","date","DatePicker","forwardRef","placeHolder","isClearable","shouldCloseOnSelect","onChange","onOpen","onClose","onBlur","onKeyDown","dateFormat","value","startDate","endDate","minDate","maxDate","validation","Validation","customTrigger","children","React","hasPopperArrow","preventOpenOnFocus","filterDate","ref","isCalendarOpen","setIsCalendarOpen","useState","handleOpen","handleClose","DatepickerComponent","DatePickerTrigger","day","decreaseMonth","increaseMonth","increaseYear","decreaseYear","Button","ButtonStyle","ButtonSize","ButtonEmphasis","IconCaretLeftDouble","IconSize","IconCaretLeft","format","getYear","IconCaretRight","IconCaretRightDouble"],"mappings":"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"}
1
+ {"version":3,"file":"DatePicker.es.js","sources":["../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Button, ButtonEmphasis, ButtonSize, ButtonStyle } from '@components/Button';\nimport { IconSize } from '@foundation/Icon/IconSize';\nimport { format, getYear } from 'date-fns';\nimport React, { forwardRef, useState } from 'react';\nimport DatepickerComponent, { ReactDatePicker } from 'react-datepicker';\nimport './DatePicker.css';\nimport { DatePickerTrigger } from './DatePickerTrigger';\nimport { IconCaretLeft, IconCaretLeftDouble, IconCaretRight, IconCaretRightDouble } from '@foundation/Icon/Generated';\nimport { Validation } from '@utilities/validation';\n\ntype SingleDatePickerProps = {\n variant?: 'single';\n onChange: (date: Date | null) => void;\n startDate?: null;\n endDate?: null;\n};\n\ntype RangeDatePickerProps = {\n variant: 'range';\n onChange: (date: [Date | null, Date | null] | null) => void;\n startDate: Date | null;\n endDate: Date | null;\n};\n\nexport type DatePickerProps = {\n placeHolder?: string;\n isClearable?: boolean;\n shouldCloseOnSelect?: boolean;\n dateFormat?: string;\n /** @description when the variant is of type 'range', the value should be the startDate */\n value?: Date | null;\n minDate?: Date;\n maxDate?: Date;\n validation?: Validation;\n customTrigger?: React.ReactNode;\n children?: React.ReactNode;\n hasPopperArrow?: boolean;\n preventOpenOnFocus?: boolean;\n filterDate?: (date: Date) => boolean;\n onOpen?: () => void;\n onClose?: () => void;\n onBlur?: () => void;\n onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;\n} & (SingleDatePickerProps | RangeDatePickerProps);\n\nconst getDayClasses = (variant: DatePickerProps['variant'], date: Date) => {\n if (variant === 'single') {\n return date < new Date() ? 'past-date' : 'future-date';\n }\n return 'range-day';\n};\n\nexport type ReactDatePickerRef = ReactDatePicker<never, boolean>;\n\nexport const DatePicker = forwardRef<ReactDatePicker<never, boolean>, DatePickerProps>(\n (\n {\n placeHolder = 'Select a date',\n isClearable,\n shouldCloseOnSelect,\n onChange,\n onOpen,\n onClose,\n onBlur,\n onKeyDown,\n dateFormat = 'dd MMM yyyy',\n value,\n startDate,\n endDate,\n minDate,\n maxDate,\n validation = Validation.Default,\n customTrigger,\n children = <></>,\n hasPopperArrow = true,\n preventOpenOnFocus = false,\n filterDate = () => true,\n variant = 'single',\n },\n ref,\n ) => {\n const [isCalendarOpen, setIsCalendarOpen] = useState<boolean>(false);\n\n const handleOpen = () => {\n setIsCalendarOpen(true);\n onOpen?.();\n };\n\n const handleClose = () => {\n setIsCalendarOpen(false);\n onClose?.();\n };\n\n return (\n <div data-test-id=\"date-picker\">\n <DatepickerComponent\n calendarClassName=\"tw-rounded-sm tw-border tw-border-line-x-strong react-datepicker-wrap\"\n selected={value}\n startDate={startDate}\n endDate={endDate}\n minDate={minDate}\n maxDate={maxDate}\n calendarStartDay={1}\n onChange={onChange}\n onKeyDown={onKeyDown}\n onBlur={onBlur}\n selectsRange={variant === 'range' ? true : false}\n showPopperArrow={hasPopperArrow}\n preventOpenOnFocus={preventOpenOnFocus}\n filterDate={filterDate}\n customInput={\n customTrigger ?? (\n <DatePickerTrigger\n isCalendarOpen={isCalendarOpen}\n isClearable={isClearable}\n placeHolder={placeHolder}\n validation={validation}\n onDateChanged={onChange}\n />\n )\n }\n ref={ref}\n formatWeekDay={(day) => day.slice(0, 1)}\n isClearable={isClearable}\n dateFormat={dateFormat}\n onCalendarClose={handleClose}\n onCalendarOpen={handleOpen}\n shouldCloseOnSelect={shouldCloseOnSelect}\n dayClassName={(date) => getDayClasses(variant, date)}\n popperProps={{\n strategy: 'fixed',\n }}\n renderCustomHeader={({ date, decreaseMonth, increaseMonth, increaseYear, decreaseYear }) => (\n <div className=\"tw-flex tw-justify-between tw-pb-4 tw-px-0\">\n <Button\n style={ButtonStyle.Default}\n size={ButtonSize.Medium}\n onClick={decreaseYear}\n emphasis={ButtonEmphasis.Weak}\n icon={<IconCaretLeftDouble size={IconSize.Size20} />}\n />\n <Button\n style={ButtonStyle.Default}\n size={ButtonSize.Medium}\n onClick={decreaseMonth}\n emphasis={ButtonEmphasis.Weak}\n icon={<IconCaretLeft size={IconSize.Size20} />}\n />\n <p className=\"tw-font-sans tw-font-semibold tw-grow tw-self-center\">\n {format(date, 'MMMM')} {getYear(date)}\n </p>\n <Button\n style={ButtonStyle.Default}\n size={ButtonSize.Medium}\n onClick={increaseMonth}\n emphasis={ButtonEmphasis.Weak}\n icon={<IconCaretRight size={IconSize.Size20} />}\n />\n <Button\n style={ButtonStyle.Default}\n size={ButtonSize.Medium}\n onClick={increaseYear}\n emphasis={ButtonEmphasis.Weak}\n icon={<IconCaretRightDouble size={IconSize.Size20} />}\n />\n </div>\n )}\n >\n {children}\n </DatepickerComponent>\n </div>\n );\n },\n);\n\nDatePicker.displayName = 'FondueDatePicker';\n"],"names":["getDayClasses","variant","date","DatePicker","forwardRef","placeHolder","isClearable","shouldCloseOnSelect","onChange","onOpen","onClose","onBlur","onKeyDown","dateFormat","value","startDate","endDate","minDate","maxDate","validation","Validation","customTrigger","children","React","hasPopperArrow","preventOpenOnFocus","filterDate","ref","isCalendarOpen","setIsCalendarOpen","useState","handleOpen","handleClose","DatepickerComponent","DatePickerTrigger","day","decreaseMonth","increaseMonth","increaseYear","decreaseYear","Button","ButtonStyle","ButtonSize","ButtonEmphasis","IconCaretLeftDouble","IconSize","IconCaretLeft","format","getYear","IconCaretRight","IconCaretRightDouble"],"mappings":"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"}