@northlight/ui 2.14.0 → 2.14.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/umd/northlight.cjs
CHANGED
|
@@ -3228,12 +3228,10 @@
|
|
|
3228
3228
|
const { dateSelect } = react.useMultiStyleConfig("Calendar");
|
|
3229
3229
|
const start = state.visibleRange.start.add({ months: offset }).month - 1;
|
|
3230
3230
|
const [selectedIndex, setSelectedIndex] = React.useState(start);
|
|
3231
|
-
const [isEditing, setIsEditing] = React.useState(false);
|
|
3232
3231
|
const moveStartDateBy = (inp) => state.visibleRange.start.add(inp);
|
|
3233
3232
|
const onChange = (e) => {
|
|
3234
3233
|
const index = Number(e.target.value);
|
|
3235
3234
|
setSelectedIndex(index);
|
|
3236
|
-
setIsEditing(false);
|
|
3237
3235
|
const diff = index - start;
|
|
3238
3236
|
state.setFocusedDate(moveStartDateBy({ months: diff }));
|
|
3239
3237
|
};
|
|
@@ -3242,31 +3240,21 @@
|
|
|
3242
3240
|
state.visibleRange.start.add({ months: offset }).month - 1
|
|
3243
3241
|
);
|
|
3244
3242
|
}, [state.visibleRange]);
|
|
3245
|
-
const handleKeyDown = (e) => {
|
|
3246
|
-
switch (e.key) {
|
|
3247
|
-
case "ArrowDown":
|
|
3248
|
-
case "ArrowUp":
|
|
3249
|
-
case " ":
|
|
3250
|
-
setIsEditing((prev) => !prev);
|
|
3251
|
-
break;
|
|
3252
|
-
}
|
|
3253
|
-
};
|
|
3254
3243
|
return /* @__PURE__ */ React.createElement(
|
|
3255
3244
|
react.Select,
|
|
3256
3245
|
{
|
|
3257
3246
|
id: "month",
|
|
3258
3247
|
"aria-label": "Select Month",
|
|
3259
3248
|
onChange,
|
|
3260
|
-
onClick: () => setIsEditing((prev) => !prev),
|
|
3261
|
-
onKeyDown: handleKeyDown,
|
|
3262
3249
|
value: selectedIndex,
|
|
3263
3250
|
iconSize: "0px",
|
|
3264
3251
|
size: "sm",
|
|
3265
3252
|
variant: "unstyled",
|
|
3266
3253
|
sx: dateSelect,
|
|
3267
|
-
w: "max-content"
|
|
3254
|
+
w: "max-content",
|
|
3255
|
+
textAlign: "center"
|
|
3268
3256
|
},
|
|
3269
|
-
|
|
3257
|
+
months.map((month, i) => /* @__PURE__ */ React.createElement("option", { key: month, value: i }, month))
|
|
3270
3258
|
);
|
|
3271
3259
|
};
|
|
3272
3260
|
|
|
@@ -3984,7 +3972,7 @@
|
|
|
3984
3972
|
},
|
|
3985
3973
|
/* @__PURE__ */ React.createElement(Icon$1, { as: icon, color: "blue.500", size: "lg" }),
|
|
3986
3974
|
dates.map(
|
|
3987
|
-
(date) => validRange(date.value, state) && /* @__PURE__ */ React.createElement(MoveButton, __spreadValues$1f({}, getMethods(date)), date.label)
|
|
3975
|
+
(date) => validRange(date.value, state) && /* @__PURE__ */ React.createElement(react.Box, { ml: "1", display: "inline" }, /* @__PURE__ */ React.createElement(MoveButton, __spreadValues$1f({}, getMethods(date)), date.label))
|
|
3988
3976
|
)
|
|
3989
3977
|
);
|
|
3990
3978
|
|
|
@@ -4110,15 +4098,16 @@
|
|
|
4110
4098
|
const getMethodsEnd = (date) => ({
|
|
4111
4099
|
onClick: updateDate(date.value, false)
|
|
4112
4100
|
});
|
|
4101
|
+
const showAdjust = state.value !== null && state.highlightedRange !== null && ramda.equals(state.value, state.highlightedRange);
|
|
4113
4102
|
return /* @__PURE__ */ React.createElement(
|
|
4114
4103
|
react.Stack,
|
|
4115
4104
|
{
|
|
4116
4105
|
spacing: 2,
|
|
4117
|
-
visibility:
|
|
4106
|
+
visibility: showAdjust ? "visible" : "hidden",
|
|
4118
4107
|
pt: "2"
|
|
4119
4108
|
},
|
|
4120
4109
|
/* @__PURE__ */ React.createElement(Clickable, { onClick: () => setIsOpen((prev) => !prev) }, /* @__PURE__ */ React.createElement(react.HStack, null, /* @__PURE__ */ React.createElement(P$1, { variant: "14" }, "Adjust ", adjust), /* @__PURE__ */ React.createElement(Icon$1, { as: isOpen ? icons.ChevronUpSolid : icons.ChevronDownSolid, size: "xs" }))),
|
|
4121
|
-
/* @__PURE__ */ React.createElement(SlideFade, { in: isOpen, direction: "top", hideDisplay: true }, adjust === "start" && /* @__PURE__ */ React.createElement(react.Stack, { minH: "91px" }, /* @__PURE__ */ React.createElement(Lead$1, { sx: { fontSize: "12px" } }, "Move date"), /* @__PURE__ */ React.createElement(
|
|
4110
|
+
/* @__PURE__ */ React.createElement(SlideFade, { in: isOpen, direction: "top", hideDisplay: true }, adjust === "start" && /* @__PURE__ */ React.createElement(react.Stack, { minH: "91px" }, /* @__PURE__ */ React.createElement(Lead$1, { sx: { fontSize: "12px" } }, "Move date by"), /* @__PURE__ */ React.createElement(
|
|
4122
4111
|
ButtonRow,
|
|
4123
4112
|
{
|
|
4124
4113
|
icon: icons.ArrowCircleLeftDuo,
|
|
@@ -4134,7 +4123,7 @@
|
|
|
4134
4123
|
getMethods: getMethodsStart,
|
|
4135
4124
|
state
|
|
4136
4125
|
}
|
|
4137
|
-
)), adjust === "end" && /* @__PURE__ */ React.createElement(react.Stack, { minH: "91px" }, /* @__PURE__ */ React.createElement(Lead$1, { sx: { fontSize: "12px" } }, "Move date"), /* @__PURE__ */ React.createElement(
|
|
4126
|
+
)), adjust === "end" && /* @__PURE__ */ React.createElement(react.Stack, { minH: "91px" }, /* @__PURE__ */ React.createElement(Lead$1, { sx: { fontSize: "12px" } }, "Move date by"), /* @__PURE__ */ React.createElement(
|
|
4138
4127
|
ButtonRow,
|
|
4139
4128
|
{
|
|
4140
4129
|
icon: icons.ArrowCircleLeftDuo,
|
|
@@ -4407,7 +4396,7 @@
|
|
|
4407
4396
|
),
|
|
4408
4397
|
end: endOfMonthWithDays(
|
|
4409
4398
|
date.startOfYear(thisDay),
|
|
4410
|
-
{ months: fiscalStartMonth +
|
|
4399
|
+
{ months: fiscalStartMonth + 3, days: fiscalStartDay }
|
|
4411
4400
|
)
|
|
4412
4401
|
},
|
|
4413
4402
|
label: fiscalStartMonth === 0 ? "Q1" : "FQ1"
|
|
@@ -4420,7 +4409,7 @@
|
|
|
4420
4409
|
),
|
|
4421
4410
|
end: endOfMonthWithDays(
|
|
4422
4411
|
date.startOfYear(thisDay),
|
|
4423
|
-
{ months: fiscalStartMonth +
|
|
4412
|
+
{ months: fiscalStartMonth + 6, days: fiscalStartDay }
|
|
4424
4413
|
)
|
|
4425
4414
|
},
|
|
4426
4415
|
label: fiscalStartMonth === 0 ? "Q2" : "FQ2"
|
|
@@ -4433,7 +4422,7 @@
|
|
|
4433
4422
|
),
|
|
4434
4423
|
end: endOfMonthWithDays(
|
|
4435
4424
|
date.startOfYear(thisDay),
|
|
4436
|
-
{ months: fiscalStartMonth +
|
|
4425
|
+
{ months: fiscalStartMonth + 9, days: fiscalStartDay }
|
|
4437
4426
|
)
|
|
4438
4427
|
},
|
|
4439
4428
|
label: fiscalStartMonth === 0 ? "Q3" : "FQ3"
|
|
@@ -4446,7 +4435,7 @@
|
|
|
4446
4435
|
),
|
|
4447
4436
|
end: endOfMonthWithDays(
|
|
4448
4437
|
date.startOfYear(thisDay),
|
|
4449
|
-
{ months: fiscalStartMonth +
|
|
4438
|
+
{ months: fiscalStartMonth + 12, days: fiscalStartDay }
|
|
4450
4439
|
)
|
|
4451
4440
|
},
|
|
4452
4441
|
label: fiscalStartMonth === 0 ? "Q4" : "FQ4"
|