@mailstep/design-system 0.8.26-beta.0 → 0.8.26-beta.2

package/ui/packages/ui/Elements/Button/styles.js

@@ -0,0 +1,225 @@
+import { th as e } from "../../../../node_modules/@xstyled/system/dist/index.js";
+import { styled as t } from "../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import n from "../Icon/Icon.js";
+import "../Icon/index.js";
+//#region packages/ui/Elements/Button/styles.ts
+var r = t.span`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+`, i = t.div`
+  & svg {
+    margin-right: ${({ $addMarginRight: e }) => e ? "8px" : "0"};
+  }
+`, a = t(n)`
+  & svg {
+    margin-right: ${({ $addMarginRight: e }) => e ? "8px" : "0"};
+    margin-left: ${({ $addMarginLeft: e }) => e ? "8px" : "0"};
+  }
+`, o = t.button`
+  width: ${({ fullWidth: e }) => e ? "100%" : "initial"};
+  font-weight: semiBold;
+  font-size: 14px;
+  font-family: ${e("fonts.primary")};
+  display: flex;
+  text-align: center;
+  align-items: center;
+  justify-content: center;
+  border-radius: 8px;
+  height: ${({ height: e }) => e || "38px"};
+  border: none;
+  transition-duration: 0.1s;
+  transition: all 300ms ease-out;
+  gap: 8px;
+  padding: ${({ iconPadding: e }) => e ? "9px" : "7px 18px"};
+  opacity: ${({ disabled: e }) => e ? .6 : 1};
+  cursor: ${({ disabled: e }) => e ? "not-allowed" : "pointer"};
+
+  :focus {
+    outline: none;
+  }
+
+  &[data-variant='default'] {
+    &[data-appearance='primary'] {
+      background-color: red1;
+      color: white;
+
+      :not(:disabled) {
+        @media (hover: hover) {
+          :hover {
+            background-color: red80;
+          }
+        }
+      }
+    }
+
+    &[data-appearance='secondary'] {
+      background-color: neutral20;
+      color: typoPrimary;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: lightGray7;
+        }
+      }
+    }
+
+    &[data-appearance='tertiary'] {
+      background-color: red20;
+      color: red1;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: red30;
+        }
+      }
+    }
+  }
+
+  &[data-variant='success'] {
+    background-color: successColor;
+    color: white;
+
+    @media (hover: hover) {
+      :hover {
+        background-color: green70;
+      }
+    }
+  }
+  &[data-variant='outline'] {
+    background-color: white;
+    border: slim;
+    &[data-appearance='primary'] {
+      color: typoPrimary;
+      border-color: typoPrimary;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: neutral20;
+        }
+      }
+    }
+    &[data-appearance='secondary'] {
+      color: red1;
+      border-color: red1;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: red20;
+        }
+      }
+    }
+  }
+  &[data-variant='ghost'] {
+    background-color: white;
+    &[data-appearance='primary'] {
+      color: typoPrimary;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: neutral20;
+        }
+      }
+    }
+    &[data-appearance='secondary'] {
+      color: red1;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: red20;
+        }
+      }
+    }
+  }
+
+  &[data-variant='link'] {
+    background-color: transparent;
+    height: ${({ height: e }) => e || "20px"};
+    &[data-appearance='primary'] {
+      color: typoPrimary;
+
+      @media (hover: hover) {
+        :hover {
+          color: neutral500;
+        }
+      }
+    }
+    &[data-appearance='secondary'] {
+      color: red1;
+
+      @media (hover: hover) {
+        :hover {
+          color: red70;
+        }
+      }
+    }
+  }
+
+  &[data-variant='icon'] {
+    width: 38px;
+    height: ${({ height: e }) => e || "38px"};
+    gap: 10px;
+
+    &[data-appearance='primary'] {
+      background-color: red1;
+      color: white;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: red70;
+        }
+      }
+    }
+
+    &[data-appearance='secondary'] {
+      background-color: neutral20;
+      color: typoPrimary;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: lightGray7;
+        }
+      }
+    }
+
+    &[data-appearance='tertiary'] {
+      background-color: red20;
+      color: red1;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: red30;
+        }
+      }
+    }
+
+    &[data-appearance='ghost'] {
+      background-color: transparent;
+      color: typoPrimary;
+
+      @media (hover: hover) {
+        :hover {
+          color: neutral500;
+        }
+      }
+    }
+  }
+
+  &[data-variant='floating'] {
+    &[data-appearance='primary'] {
+      width: 56px;
+      height: ${({ height: e }) => e || "56px"};
+      background-color: red1;
+      color: white;
+      border-radius: 50%;
+
+      @media (hover: hover) {
+        :hover {
+          background-color: red70;
+        }
+      }
+    }
+  }
+`;
+//#endregion
+export { i as LoadingIconWrapper, o as StyledButton, a as StyledIcon, r as StyledWrapper };

package/ui/packages/ui/Elements/Card/Card.js

@@ -0,0 +1,13 @@
+import { require_jsx_runtime as e } from "../../../../node_modules/react/jsx-runtime.js";
+import { StyledCard as t } from "./styles.js";
+//#region packages/ui/Elements/Card/Card.tsx
+var n = e(), r = ({ children: e, display: r = "block", bg: i, onClick: a, maxWidth: o }) => /* @__PURE__ */ (0, n.jsx)(t, {
+	onClick: a,
+	bg: i,
+	display: r,
+	maxWidth: o,
+	hasOnClick: !!a,
+	children: e
+});
+//#endregion
+export { r as default };

package/ui/packages/ui/Elements/Card/index.js

@@ -0,0 +1,5 @@
+import e from "./Card.js";
+//#region packages/ui/Elements/Card/index.ts
+var t = e;
+//#endregion
+export { t as default };

package/ui/packages/ui/Elements/Card/styles.js

@@ -0,0 +1,23 @@
+import { th as e } from "../../../../node_modules/@xstyled/system/dist/index.js";
+import { css as t, styled as n } from "../../../../node_modules/@xstyled/styled-components/dist/index.js";
+//#region packages/ui/Elements/Card/styles.ts
+var r = n.div`
+  display: ${({ display: e }) => e};
+  padding: 20px;
+  border: 1px solid;
+  background-color: ${({ bg: t }) => t ? e.color(t) : "white"};
+  border-color: ${e.color("lightGray6")};
+  border-radius: 12px;
+  width: 100%;
+
+  ${({ maxWidth: e }) => e && `max-width: ${e};`}
+
+  ${({ hasOnClick: n }) => n && t`
+      cursor: pointer;
+      &:hover {
+        border-color: ${e.color("gray1")};
+      }
+    `}
+`;
+//#endregion
+export { r as StyledCard };

package/ui/packages/ui/Elements/DatePicker/DatePicker.js

@@ -0,0 +1,75 @@
+import { x as e } from "../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import { require_jsx_runtime as t } from "../../../../node_modules/react/jsx-runtime.js";
+import { LanguageContext as n } from "../../ThemeProvider/ThemeProvider.js";
+import r from "../SpaceAround/index.js";
+import i from "../../../../node_modules/moment/dist/moment.js";
+import a from "../../Forms/Input/index.js";
+import o from "./Datetime/DateTime.js";
+import "../../../../node_modules/moment/dist/locale/cs.js";
+import "../../../../node_modules/moment/dist/locale/el.js";
+import "../../../../node_modules/moment/dist/locale/it.js";
+import "../../../../node_modules/moment/dist/locale/ru.js";
+import "../../../../node_modules/moment/dist/locale/sk.js";
+import { DatePickerBase as s } from "./styles.js";
+import c, { useCallback as l, useContext as u } from "react";
+//#region packages/ui/Elements/DatePicker/DatePicker.tsx
+var d = t(), f = "DD.MM.YYYY", p = c.memo(({ name: t, value: c, initialViewDate: p, error: m, label: h, disabled: g, isValidDate: _, onChange: v, dateFormat: y = f, timeFormat: b = !1, open: x, secondValue: S = null, input: C, icon: w = !0, showInputLabel: T = !1, showCalendarLabel: E = !0, spaceAround: D = !1, className: O, onClear: k, onInputChange: A, ...j }) => {
+	let M = `${y}${b ? ` ${b}` : ""}`, N = !!c && i(c, M, !0).isValid(), P = N ? i(c, M).format(M) : c, F = u(n), I = l((e, n) => /* @__PURE__ */ (0, d.jsx)(a, {
+		type: "text",
+		icon: w ? "calendar" : void 0,
+		name: t,
+		error: m,
+		disabled: g,
+		isInvalid: !!m,
+		onChange: A,
+		label: T ? h : void 0,
+		value: P,
+		onFocus: n,
+		iconOnClick: n,
+		onClear: k,
+		autoComplete: "off"
+	}), [
+		t,
+		P,
+		m,
+		h,
+		T,
+		N,
+		g
+	]), L = l((t, n) => h && !T ? /* @__PURE__ */ (0, d.jsx)(e.div, {
+		display: "flex",
+		flexDirection: "column",
+		children: n()
+	}) : n(), [h, T]), R = l((e) => {
+		let t = typeof e == "string" ? e : e?.toDate?.();
+		v?.(t);
+	}, [v]), z = l((e, t) => {
+		let n = [e?.toDate?.(), t?.toDate?.()];
+		return _ ? _(...n) : !0;
+	}, [_]);
+	return /* @__PURE__ */ (0, d.jsx)(r, {
+		spaceAround: D,
+		children: /* @__PURE__ */ (0, d.jsx)(s, {
+			className: O,
+			children: /* @__PURE__ */ (0, d.jsx)(o, {
+				value: c,
+				dateFormat: y,
+				timeFormat: b,
+				secondValue: S,
+				open: x,
+				input: C,
+				label: E ? h : void 0,
+				onChange: R,
+				isValidDate: z,
+				renderView: L,
+				renderInput: I,
+				initialViewDate: p,
+				locale: F,
+				disabled: g,
+				...j
+			})
+		})
+	});
+});
+//#endregion
+export { p as default };

package/ui/packages/ui/Elements/DatePicker/Datetime/DateTime.js

@@ -0,0 +1,289 @@
+import { require_jsx_runtime as e } from "../../../../../node_modules/react/jsx-runtime.js";
+import t from "../../../../../node_modules/moment/dist/moment.js";
+import n from "../../../../../node_modules/react-onclickoutside/dist/react-onclickoutside.es.js";
+import r from "./views/DaysView.js";
+import i from "./views/MonthsView.js";
+import a from "./views/YearsView.js";
+import o from "react";
+//#region packages/ui/Elements/DatePicker/Datetime/DateTime.tsx
+var s = e(), c = {
+	YEARS: "years",
+	MONTHS: "months",
+	DAYS: "days",
+	TIME: "time"
+}, l = function() {}, u = class extends o.Component {
+	static {
+		this.defaultProps = {
+			onOpen: l,
+			onClose: l,
+			onCalendarOpen: l,
+			onCalendarClose: l,
+			onChange: l,
+			onNavigate: l,
+			onBeforeNavigate: function(e) {
+				return e;
+			},
+			onNavigateBack: l,
+			onNavigateForward: l,
+			dateFormat: !0,
+			timeFormat: !0,
+			utc: !1,
+			className: "",
+			input: !0,
+			inputProps: {},
+			timeConstraints: {},
+			isValidDate: function() {
+				return !0;
+			},
+			strictParsing: !0,
+			closeOnSelect: !1,
+			closeOnTab: !0,
+			closeOnClickOutside: !0,
+			renderView: (e, t) => t()
+		};
+	}
+	static {
+		this.moment = t;
+	}
+	constructor(e) {
+		super(e), this._renderCalendar = () => {
+			let e = this.props, n = this.state, o = {
+				viewDate: n.viewDate.clone(),
+				label: e.label,
+				isSecondDatePicker: e.isSecondDatePicker,
+				secondValue: e.secondValue,
+				selectedDate: this.getSelectedDate(),
+				isValidDate: e.isValidDate,
+				updateDate: this._updateDate,
+				others: e.others,
+				onChangeOthers: e.onChangeOthers,
+				reset: this._reset,
+				navigate: this._viewNavigate,
+				moment: t,
+				showView: this._showView
+			};
+			switch (n.currentView) {
+				case c.YEARS: return o.renderYear = e.renderYear, /* @__PURE__ */ (0, s.jsx)(a, { ...o });
+				case c.MONTHS: return o.renderMonth = e.renderMonth, /* @__PURE__ */ (0, s.jsx)(i, { ...o });
+				case c.DAYS: return o.renderDay = e.renderDay, o.timeFormat = this.getFormat("time"), o.setTime = this._setTime, o.value = this.props.value, o.disabled = this.props.disabled, /* @__PURE__ */ (0, s.jsx)(r, { ...o });
+				default: return o.renderDay = e.renderDay, o.timeFormat = this.getFormat("time"), o.setTime = this._setTime, o.value = this.props.value, /* @__PURE__ */ (0, s.jsx)(r, { ...o });
+			}
+		}, this._showView = (e, t) => {
+			let n = (t || this.state.viewDate).clone(), r = this.props.onBeforeNavigate(e, this.state.currentView, n);
+			r && this.state.currentView !== r && (this.props.onNavigate(r), this.setState({ currentView: r }));
+		}, this.viewToMethod = {
+			days: "date",
+			months: "month",
+			years: "year"
+		}, this.nextView = {
+			days: "time",
+			months: "days",
+			years: "months"
+		}, this._updateDate = (e) => {
+			let t = this.state.currentView, n = this.getUpdateOn(this.getFormat("date")), r = this.state.viewDate.clone();
+			r[this.viewToMethod[t]](parseInt(e.target.getAttribute("data-value"), 10)), t === "days" && (r.month(parseInt(e.target.getAttribute("data-month"), 10)), r.year(parseInt(e.target.getAttribute("data-year"), 10)));
+			let i = { viewDate: r };
+			t === n ? (i.selectedDate = r.clone(), i.inputValue = r.format(this.getFormat("datetime")), this.props.open === void 0 && this.props.input && this.props.closeOnSelect && this._closeCalendar(), this.props.onChange(r.clone())) : this._showView(this.nextView[t], r), this.setState(i);
+		}, this._viewNavigate = (e, t) => {
+			let n = this.state.viewDate.clone();
+			n.add(e, t), e > 0 ? this.props.onNavigateForward(e, t) : this.props.onNavigateBack(-e, t), this.setState({ viewDate: n });
+		}, this._setTime = (e, t) => {
+			let n = (this.getSelectedDate() || this.state.viewDate).clone();
+			n[e](t), this.props.value || this.setState({
+				selectedDate: n,
+				viewDate: n.clone(),
+				inputValue: n.format(this.getFormat("datetime"))
+			}), this.props.onChange(n);
+		}, this._reset = () => {
+			this.props.onChange(void 0);
+		}, this._openCalendar = () => {
+			this.isOpen() || this.setState({ open: !0 }, this.props.onOpen);
+		}, this._closeCalendar = () => {
+			this.isOpen() && this.setState({ open: !1 }, () => {
+				this.props.onClose(this.state.selectedDate || this.state.inputValue);
+			});
+		}, this._handleClickOutside = () => {
+			let e = this.props;
+			e.input && this.state.open && e.open === void 0 && e.closeOnClickOutside && this._closeCalendar();
+		}, this._onInputFocus = (e) => {
+			this.callHandler(this.props.inputProps.onFocus, e) && this._openCalendar();
+		}, this._onInputChange = (e) => {
+			if (!this.callHandler(this.props.inputProps.onChange, e)) return;
+			let t = e.target ? e.target.value : e, n = this.localMoment(t, this.getFormat("datetime")), r = { inputValue: t };
+			n.isValid() ? (r.selectedDate = n, r.viewDate = n.clone().startOf("month")) : r.selectedDate = null, this.setState(r, () => {
+				this.props.onChange(n.isValid() ? n : this.state.inputValue);
+			});
+		}, this._onInputKeyDown = (e) => {
+			this.callHandler(this.props.inputProps.onKeyDown, e) && e.which === 9 && this.props.closeOnTab && this._closeCalendar();
+		}, this._onInputClick = (e) => {
+			this.callHandler(this.props.inputProps.onClick, e) && this._openCalendar();
+		}, this.state = this.getInitialState();
+	}
+	render() {
+		return /* @__PURE__ */ (0, s.jsxs)(d, {
+			className: this.getClassName(),
+			onClickOut: this._handleClickOutside,
+			children: [this.renderInput(), /* @__PURE__ */ (0, s.jsx)("div", {
+				className: "rdtPicker",
+				children: this.renderView()
+			})]
+		});
+	}
+	renderInput() {
+		if (!this.props.input) return;
+		let e = {
+			type: "text",
+			className: "form-control",
+			value: this.getInputValue(),
+			...this.props.inputProps,
+			onFocus: this._onInputFocus,
+			onChange: this._onInputChange,
+			onKeyDown: this._onInputKeyDown,
+			onClick: this._onInputClick
+		};
+		return this.props.renderInput ? /* @__PURE__ */ (0, s.jsx)("div", { children: this.props.renderInput(e, this._openCalendar, this._closeCalendar) }) : /* @__PURE__ */ (0, s.jsx)("input", { ...e });
+	}
+	renderView() {
+		return this.props.renderView(this.state.currentView, this._renderCalendar);
+	}
+	getInitialState() {
+		let e = this.props, t = this.getFormat("datetime"), n = this.parseDate(e.value || e.initialValue, t);
+		return this.checkTZ(), {
+			open: !e.input,
+			currentView: e.initialViewMode || this.getInitialView(),
+			viewDate: this.getInitialViewDate(n),
+			selectedDate: n && n.isValid() ? n : void 0,
+			inputValue: this.getInitialInputValue(n)
+		};
+	}
+	getInitialViewDate(e) {
+		let t = this.props.initialViewDate, n;
+		if (t) {
+			if (n = this.parseDate(t, this.getFormat("datetime")), n && n.isValid()) return n;
+			console.log("The initialViewDated given \"" + t + "\" is not valid. Using current date instead.");
+		} else if (e && e.isValid()) return e.clone();
+		return this.getInitialDate();
+	}
+	getInitialDate() {
+		let e = this.localMoment();
+		return e.hour(0).minute(0).second(0).millisecond(0), e;
+	}
+	getInitialView() {
+		let e = this.getFormat("date");
+		return e ? this.getUpdateOn(e) : c.TIME;
+	}
+	parseDate(e, t) {
+		let n;
+		return e && typeof e == "string" ? n = this.localMoment(e, t) : e && (n = this.localMoment(e)), n && !n.isValid() && (n = null), n;
+	}
+	getClassName() {
+		let e = "rdt", t = this.props, n = t.className;
+		return Array.isArray(n) ? e += " " + n.join(" ") : n && (e += " " + n), t.input || (e += " rdtStatic"), this.isOpen() && (e += " rdtOpen"), e;
+	}
+	isOpen() {
+		return !this.props.input || (this.props.open === void 0 ? this.state.open : this.props.open);
+	}
+	getUpdateOn(e) {
+		return this.props.updateOnView ? this.props.updateOnView : e.match(/[lLD]/) ? c.DAYS : e.indexOf("M") === -1 ? e.indexOf("Y") === -1 ? c.DAYS : c.YEARS : c.MONTHS;
+	}
+	getLocaleData() {
+		let e = this.props;
+		return this.localMoment(e.value || e.defaultValue || /* @__PURE__ */ new Date()).localeData();
+	}
+	getDateFormat() {
+		let e = this.getLocaleData(), t = this.props.dateFormat;
+		return t === !0 ? e.longDateFormat("L") : t || "";
+	}
+	getTimeFormat() {
+		let e = this.getLocaleData(), t = this.props.timeFormat;
+		return t === !0 ? e.longDateFormat("LT") : t || "";
+	}
+	getFormat(e) {
+		if (e === "date") return this.getDateFormat();
+		if (e === "time") return this.getTimeFormat();
+		let t = this.getDateFormat(), n = this.getTimeFormat();
+		return t && n ? t + " " + n : t || n;
+	}
+	updateTime(e, t, n, r) {
+		let i = {}, a = r ? "selectedDate" : "viewDate";
+		i[a] = this.state[a].clone()[e](t, n), this.setState(i);
+	}
+	localMoment(e, n, r) {
+		r ||= this.props;
+		let i = null;
+		return i = r.utc ? t.utc(e, n, r.strictParsing) : r.displayTimeZone ? t.tz(e, n, r.displayTimeZone) : t(e, n, r.strictParsing), r.locale && i.locale(r.locale), i;
+	}
+	checkTZ() {
+		let { displayTimeZone: e } = this.props;
+		e && !this.tzWarning && !t.tz && (this.tzWarning = !0);
+	}
+	componentDidUpdate(e) {
+		if (e === this.props) return;
+		let t = !1, n = this.props;
+		[
+			"locale",
+			"utc",
+			"displayZone",
+			"dateFormat",
+			"timeFormat"
+		].forEach(function(r) {
+			e[r] !== n[r] && (t = !0);
+		}), t && this.regenerateDates(), n.value && n.value !== e.value && this.setViewDate(n.value), this.checkTZ();
+	}
+	regenerateDates() {
+		let e = this.props, t = this.state.viewDate.clone(), n = this.state.selectedDate && this.state.selectedDate.clone();
+		e.locale && (t.locale(e.locale), n && n.locale(e.locale)), e.utc ? (t.utc(), n && n.utc()) : e.displayTimeZone ? (t.tz(e.displayTimeZone), n && n.tz(e.displayTimeZone)) : (t.locale(), n && n.locale());
+		let r = {
+			viewDate: t,
+			selectedDate: n
+		};
+		n && n.isValid() && (r.inputValue = n.format(this.getFormat("datetime"))), this.setState(r);
+	}
+	getSelectedDate() {
+		if (this.props.value === void 0) return this.state.selectedDate;
+		let e = this.parseDate(this.props.value, this.getFormat("datetime"));
+		return e && e.isValid() ? e : !1;
+	}
+	getInitialInputValue(e) {
+		let t = this.props;
+		return t.inputProps.value ? t.inputProps.value : e && e.isValid() ? e.format(this.getFormat("datetime")) : t.value && typeof t.value == "string" ? t.value : t.initialValue && typeof t.initialValue == "string" ? t.initialValue : "";
+	}
+	getInputValue() {
+		let e = this.getSelectedDate();
+		return e ? e.format(this.getFormat("datetime")) : this.state.inputValue;
+	}
+	setViewDate(e) {
+		let t = function() {
+			return console.log("Invalid date passed to the `setViewDate` method: " + e);
+		};
+		if (!e) return t();
+		let n;
+		if (n = typeof e == "string" ? this.localMoment(e, this.getFormat("datetime")) : this.localMoment(e), !n || !n.isValid()) return t();
+		this.setState({ viewDate: n });
+	}
+	navigate(e) {
+		this._showView(e);
+	}
+	callHandler(e, t) {
+		return e ? e(t) !== !1 : !0;
+	}
+}, d = n(class extends o.Component {
+	constructor(...e) {
+		super(...e), this.container = o.createRef();
+	}
+	render() {
+		return /* @__PURE__ */ (0, s.jsx)("div", {
+			className: this.props.className,
+			ref: this.container,
+			children: this.props.children
+		});
+	}
+	handleClickOutside(e) {
+		this.props.onClickOut(e);
+	}
+	setClickOutsideRef() {
+		return this.container.current;
+	}
+});
+//#endregion
+export { u as default };

package/ui/packages/ui/Elements/DatePicker/Datetime/components/DateRepeater.js

@@ -0,0 +1,65 @@
+import { x as e } from "../../../../../../node_modules/@xstyled/styled-components/dist/index.js";
+import { require_jsx_runtime as t } from "../../../../../../node_modules/react/jsx-runtime.js";
+import n from "../../../Icon/index.js";
+import { i18n as r } from "../../../../../../node_modules/@lingui/core/dist/index.js";
+import { DatePickerRepeat as i } from "../types.js";
+import { DatePickerRepeatTrans as a } from "../../utils/constants.js";
+import { FooterRow as o } from "./FooterRow.js";
+import { FooterRowLabel as s } from "./FooterRowLabel.js";
+import { useCallback as c } from "react";
+//#region packages/ui/Elements/DatePicker/Datetime/components/DateRepeater.tsx
+var l = t(), u = ({ onChangeOthers: t, others: u, reset: d }) => {
+	let f = c((e) => {
+		let n = e.target.value;
+		n || d(), t?.({
+			...u,
+			dateTypeRepeater: n
+		});
+	}, [
+		t,
+		d,
+		u
+	]);
+	return /* @__PURE__ */ (0, l.jsx)(e.div, {
+		borderTop: "1px solid",
+		borderColor: "lightGray2",
+		mt: "8px",
+		pt: "8px",
+		mb: "8px",
+		children: /* @__PURE__ */ (0, l.jsxs)(o, { children: [/* @__PURE__ */ (0, l.jsxs)(e.div, {
+			display: "flex",
+			alignItems: "center",
+			flex: "1",
+			children: [/* @__PURE__ */ (0, l.jsx)(n, { icon: "calendar" }), /* @__PURE__ */ (0, l.jsx)(s, { children: r._({
+				id: "dataGrid.repeat",
+				message: "Repeat"
+			}) })]
+		}), /* @__PURE__ */ (0, l.jsxs)(e.select, {
+			textAlign: "right",
+			onChange: f,
+			value: u?.dateTypeRepeater,
+			background: "white",
+			cursor: "pointer",
+			border: "none",
+			children: [
+				/* @__PURE__ */ (0, l.jsx)("option", {
+					value: "",
+					children: r._({
+						id: "dataGrid.noRepeat",
+						message: "No repeat"
+					})
+				}),
+				/* @__PURE__ */ (0, l.jsx)("option", {
+					value: i.EVERY_TODAY,
+					children: a[i.EVERY_TODAY]
+				}),
+				/* @__PURE__ */ (0, l.jsx)("option", {
+					value: i.EVERY_YESTERDAY,
+					children: a[i.EVERY_YESTERDAY]
+				})
+			]
+		})] })
+	});
+};
+//#endregion
+export { u as DateRepeater };