@trackunit/react-form-components 0.0.81 → 0.0.83

package/index.cjs

@@ -14382,7 +14382,7 @@ const TimeRange = ({ id, className, dataTestId, children, range, onChange, disab
     return (jsxRuntime.jsxs("div", { id: id, className: cvaTimeRange({ className }), "data-testid": dataTestId, children: [jsxRuntime.jsx(BaseInput, { dataTestId: `${dataTestId}-from`, disabled: disabled, isInvalid: isInvalid, type: "time", onChange: (time) => onChangeFrom(time.currentTarget.value), onBlur: onRangeChange, value: (_a = timeRange === null || timeRange === void 0 ? void 0 : timeRange.timeFrom) !== null && _a !== void 0 ? _a : "" }), children !== null && children !== void 0 ? children : jsxRuntime.jsx("div", { "data-testid": `${dataTestId}-separator`, children: "-" }), jsxRuntime.jsx(BaseInput, { dataTestId: `${dataTestId}-to`, disabled: disabled, isInvalid: isInvalid, type: "time", onChange: (time) => onChangeTo(time.currentTarget.value), onBlur: onRangeChange, value: (_b = timeRange === null || timeRange === void 0 ? void 0 : timeRange.timeTo) !== null && _b !== void 0 ? _b : "" })] }));
 };
 
-const cvaScheduleItem = cssClassVarianceUtilities.cvaMerge(["grid", "pb-4", "gap-2", "grid-cols-3"]);
+const cvaScheduleItem = cssClassVarianceUtilities.cvaMerge(["grid", "pb-4", "gap-2", "grid-cols-[60px,200px,60px,2fr]"]);
 const cvaScheduleItemText = cssClassVarianceUtilities.cvaMerge(["flex", "font-bold", "self-center"]);
 
 /**
@@ -14400,8 +14400,13 @@ const Schedule = ({ className, dataTestId, schedule, onChange, invalidKeys = []
         const newSchedule = schedule.map((day, dayIndex) => (index === dayIndex ? Object.assign(Object.assign({}, day), { isActive }) : day));
         onChange(newSchedule);
     };
-    return (jsxRuntime.jsx("div", { "data-testid": dataTestId, className: className, children: schedule.map(({ label, range, isActive, key, checkboxLabel }, index) => {
-            return (jsxRuntime.jsxs("div", { className: cvaScheduleItem(), children: [jsxRuntime.jsx(reactComponents.Text, { className: cvaScheduleItemText(), size: "medium", children: label }), jsxRuntime.jsx(TimeRange, { dataTestId: `${dataTestId}-${label}-range`, range: range, onChange: (newRange) => onRangeChange(newRange, index), disabled: !isActive, isInvalid: !!invalidKeys.find((invalidKey) => invalidKey === key) }), jsxRuntime.jsx(Checkbox, { dataTestId: `${dataTestId}-${label}-checkbox`, checked: isActive, onChange: (event) => onActiveChange(Boolean(event.currentTarget.checked), index), label: checkboxLabel })] }, key));
+    const onAllDayChange = (isAllDayChecked, index) => {
+        const newSchedule = schedule.map((day, dayIndex) => index === dayIndex
+            ? Object.assign(Object.assign({}, day), { range: { timeFrom: "", timeTo: "" }, isAllDayActive: isAllDayChecked }) : day);
+        onChange(newSchedule);
+    };
+    return (jsxRuntime.jsx("div", { "data-testid": dataTestId, className: className, children: schedule.map(({ label, range, isActive, key, checkboxLabel, isAllDayActive }, index) => {
+            return (jsxRuntime.jsxs("div", { className: cvaScheduleItem(), children: [jsxRuntime.jsx(Checkbox, { dataTestId: `${dataTestId}-${key}-checkbox`, checked: isActive, onChange: (event) => onActiveChange(Boolean(event.currentTarget.checked), index), label: checkboxLabel }), jsxRuntime.jsx(reactComponents.Text, { className: cvaScheduleItemText(), size: "medium", children: label }), jsxRuntime.jsx(Checkbox, { dataTestId: `${dataTestId}-${key}-allday-checkbox`, disabled: !isActive, checked: isAllDayActive && isActive, onChange: (event) => onAllDayChange(Boolean(event.currentTarget.checked), index) }), jsxRuntime.jsx(TimeRange, { dataTestId: `${dataTestId}-${key}-range`, range: range, onChange: (newRange) => onRangeChange(newRange, index), disabled: !isActive || isAllDayActive, isInvalid: !!invalidKeys.find((invalidKey) => invalidKey === key) })] }, key));
         }) }));
 };
 

package/index.js

@@ -14356,7 +14356,7 @@ const TimeRange = ({ id, className, dataTestId, children, range, onChange, disab
     return (jsxs("div", { id: id, className: cvaTimeRange({ className }), "data-testid": dataTestId, children: [jsx$1(BaseInput, { dataTestId: `${dataTestId}-from`, disabled: disabled, isInvalid: isInvalid, type: "time", onChange: (time) => onChangeFrom(time.currentTarget.value), onBlur: onRangeChange, value: (_a = timeRange === null || timeRange === void 0 ? void 0 : timeRange.timeFrom) !== null && _a !== void 0 ? _a : "" }), children !== null && children !== void 0 ? children : jsx$1("div", { "data-testid": `${dataTestId}-separator`, children: "-" }), jsx$1(BaseInput, { dataTestId: `${dataTestId}-to`, disabled: disabled, isInvalid: isInvalid, type: "time", onChange: (time) => onChangeTo(time.currentTarget.value), onBlur: onRangeChange, value: (_b = timeRange === null || timeRange === void 0 ? void 0 : timeRange.timeTo) !== null && _b !== void 0 ? _b : "" })] }));
 };
 
-const cvaScheduleItem = cvaMerge(["grid", "pb-4", "gap-2", "grid-cols-3"]);
+const cvaScheduleItem = cvaMerge(["grid", "pb-4", "gap-2", "grid-cols-[60px,200px,60px,2fr]"]);
 const cvaScheduleItemText = cvaMerge(["flex", "font-bold", "self-center"]);
 
 /**
@@ -14374,8 +14374,13 @@ const Schedule = ({ className, dataTestId, schedule, onChange, invalidKeys = []
         const newSchedule = schedule.map((day, dayIndex) => (index === dayIndex ? Object.assign(Object.assign({}, day), { isActive }) : day));
         onChange(newSchedule);
     };
-    return (jsx$1("div", { "data-testid": dataTestId, className: className, children: schedule.map(({ label, range, isActive, key, checkboxLabel }, index) => {
-            return (jsxs("div", { className: cvaScheduleItem(), children: [jsx$1(Text, { className: cvaScheduleItemText(), size: "medium", children: label }), jsx$1(TimeRange, { dataTestId: `${dataTestId}-${label}-range`, range: range, onChange: (newRange) => onRangeChange(newRange, index), disabled: !isActive, isInvalid: !!invalidKeys.find((invalidKey) => invalidKey === key) }), jsx$1(Checkbox, { dataTestId: `${dataTestId}-${label}-checkbox`, checked: isActive, onChange: (event) => onActiveChange(Boolean(event.currentTarget.checked), index), label: checkboxLabel })] }, key));
+    const onAllDayChange = (isAllDayChecked, index) => {
+        const newSchedule = schedule.map((day, dayIndex) => index === dayIndex
+            ? Object.assign(Object.assign({}, day), { range: { timeFrom: "", timeTo: "" }, isAllDayActive: isAllDayChecked }) : day);
+        onChange(newSchedule);
+    };
+    return (jsx$1("div", { "data-testid": dataTestId, className: className, children: schedule.map(({ label, range, isActive, key, checkboxLabel, isAllDayActive }, index) => {
+            return (jsxs("div", { className: cvaScheduleItem(), children: [jsx$1(Checkbox, { dataTestId: `${dataTestId}-${key}-checkbox`, checked: isActive, onChange: (event) => onActiveChange(Boolean(event.currentTarget.checked), index), label: checkboxLabel }), jsx$1(Text, { className: cvaScheduleItemText(), size: "medium", children: label }), jsx$1(Checkbox, { dataTestId: `${dataTestId}-${key}-allday-checkbox`, disabled: !isActive, checked: isAllDayActive && isActive, onChange: (event) => onAllDayChange(Boolean(event.currentTarget.checked), index) }), jsx$1(TimeRange, { dataTestId: `${dataTestId}-${key}-range`, range: range, onChange: (newRange) => onRangeChange(newRange, index), disabled: !isActive || isAllDayActive, isInvalid: !!invalidKeys.find((invalidKey) => invalidKey === key) })] }, key));
         }) }));
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-form-components",
-  "version": "0.0.81",
+  "version": "0.0.83",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {

package/src/components/Schedule/Schedule.d.ts

@@ -18,6 +18,10 @@ export interface ScheduleItem {
      * Indicates whether the schedule item is active.
      */
     isActive: boolean;
+    /**
+     * Indicates whether the all day schedule item is active.
+     */
+    isAllDayActive?: boolean;
     /**
      * Checkbox text
      */