@herca/r-kit 0.0.14 → 0.0.15

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/clients.cjs CHANGED
@@ -985,7 +985,8 @@ var Input = React5.forwardRef(
985
985
  props.disabled && "cursor-not-allowed bg-gray-100",
986
986
  className
987
987
  ),
988
- ...props
988
+ ...props,
989
+ required: false
989
990
  }
990
991
  ),
991
992
  rightAddon && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
@@ -11202,7 +11203,8 @@ var DatePicker = ({
11202
11203
  wrapperClassName,
11203
11204
  size = "md",
11204
11205
  showController = true,
11205
- align = "start"
11206
+ align = "start",
11207
+ containerClassName
11206
11208
  }) => {
11207
11209
  const [selectedDate, setSelectedDate] = (0, import_react294.useState)(
11208
11210
  controlledValue || null
@@ -11428,225 +11430,232 @@ var DatePicker = ({
11428
11430
  setIsCalendarShow(open);
11429
11431
  }
11430
11432
  }, [open]);
11431
- return /* @__PURE__ */ (0, import_jsx_runtime309.jsx)("div", { ref: containerRef, className: "relative flex max-w-sm flex-col", children: /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)(
11432
- Dropdown,
11433
+ return /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11434
+ "div",
11433
11435
  {
11434
- open: isCalendarShow,
11435
- onOpenChange: (open2) => {
11436
- setIsCalendarShow(open2);
11437
- onOpenChange?.(open2);
11438
- if (mode === "range" && controlledRangeValue) {
11439
- setDateRange(controlledRangeValue);
11440
- }
11441
- },
11442
- children: [
11443
- /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(DropdownTrigger, { asChild: !!trigger, children: !trigger ? /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11444
- Input,
11445
- {
11446
- type: "text",
11447
- mergedAddon: true,
11448
- className: "pl-0",
11449
- leftAddonClassName: "pr-1!",
11450
- leftAddon: /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(Icon_default, { name: "calendar", className: "text-gray-900" }),
11451
- placeholder: mode === "range" ? `${formatConfig.placeholder} - ${formatConfig.placeholder}` : formatConfig.placeholder,
11452
- onChange: handleInputChange2,
11453
- value: inputValue,
11454
- readOnly: mode === "range"
11455
- }
11456
- ) : trigger }),
11457
- /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11458
- DropdownContent,
11459
- {
11460
- align,
11461
- sideOffset: 5,
11462
- className: (0, import_clsx3.default)("z-10 overflow-hidden p-0", wrapperClassName),
11463
- children: /* @__PURE__ */ (0, import_jsx_runtime309.jsx)("div", { className: "top-full z-10", children: mode === "single" ? /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11464
- Calendar2,
11436
+ ref: containerRef,
11437
+ className: (0, import_clsx3.default)("relative flex max-w-sm flex-col", containerClassName),
11438
+ children: /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)(
11439
+ Dropdown,
11440
+ {
11441
+ open: isCalendarShow,
11442
+ onOpenChange: (open2) => {
11443
+ setIsCalendarShow(open2);
11444
+ onOpenChange?.(open2);
11445
+ if (mode === "range" && controlledRangeValue) {
11446
+ setDateRange(controlledRangeValue);
11447
+ }
11448
+ },
11449
+ children: [
11450
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(DropdownTrigger, { asChild: !!trigger, children: !trigger ? /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11451
+ Input,
11465
11452
  {
11466
- size,
11467
- wrapperClassname: "w-full border-0",
11468
- weekWrapperClassname: "w-full justify-between",
11469
- dayWrapperClassname: "justify-between",
11470
- onChange: handleCalendarChange,
11471
- value: selectedDate,
11472
- ...calendarProps
11453
+ type: "text",
11454
+ mergedAddon: true,
11455
+ className: "pl-0",
11456
+ leftAddonClassName: "pr-1!",
11457
+ leftAddon: /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(Icon_default, { name: "calendar", className: "text-gray-900" }),
11458
+ placeholder: mode === "range" ? `${formatConfig.placeholder} - ${formatConfig.placeholder}` : formatConfig.placeholder,
11459
+ onChange: handleInputChange2,
11460
+ value: inputValue,
11461
+ readOnly: mode === "range"
11473
11462
  }
11474
- ) : /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex", children: [
11475
- showController && /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex flex-col items-start gap-2 border-r border-gray-400 px-3 py-6.5", children: [
11476
- /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11477
- ChipGroup,
11478
- {
11479
- direction: "vertical",
11480
- options: filterCalendar,
11481
- selected: selectedFilter,
11482
- onSelect: (val) => {
11483
- setSelectedFilter(val);
11484
- const now = /* @__PURE__ */ new Date();
11485
- const end = /* @__PURE__ */ new Date();
11486
- const start = /* @__PURE__ */ new Date();
11487
- if (val[0] === 0) {
11488
- const day = now.getDay();
11489
- const diffToMonday = day === 0 ? -6 : 1 - day;
11490
- const startOfThisWeek = new Date(now);
11491
- startOfThisWeek.setDate(now.getDate() + diffToMonday);
11492
- startOfThisWeek.setHours(0, 0, 0, 0);
11493
- const startOfLastWeek = new Date(startOfThisWeek);
11494
- startOfLastWeek.setDate(
11495
- startOfThisWeek.getDate() - 7
11496
- );
11497
- const endOfLastWeek = new Date(startOfThisWeek);
11498
- endOfLastWeek.setDate(startOfThisWeek.getDate() - 1);
11499
- endOfLastWeek.setHours(23, 59, 59, 999);
11500
- setDateRange({
11501
- start: startOfLastWeek,
11502
- end: endOfLastWeek
11503
- });
11504
- } else if (val[0] === 1) {
11505
- start.setDate(end.getDate() - 7);
11506
- start.setHours(0, 0, 0, 0);
11507
- end.setHours(23, 59, 59, 999);
11508
- setDateRange({
11509
- start,
11510
- end
11511
- });
11512
- } else if (val[0] === 2) {
11513
- start.setDate(end.getDate() - 29);
11514
- start.setHours(0, 0, 0, 0);
11515
- end.setHours(23, 59, 59, 999);
11516
- setDateRange({
11517
- start,
11518
- end
11519
- });
11520
- } else if (val[0] === 3) {
11521
- const start2 = new Date(
11522
- now.getFullYear(),
11523
- now.getMonth(),
11524
- 1
11525
- );
11526
- const end2 = new Date(
11527
- now.getFullYear(),
11528
- now.getMonth() + 1,
11529
- 0
11530
- );
11531
- start2.setHours(0, 0, 0, 0);
11532
- end2.setHours(23, 59, 59, 999);
11533
- setDateRange({
11534
- start: start2,
11535
- end: end2
11536
- });
11537
- } else if (val[0] === 4) {
11538
- start.setFullYear(end.getFullYear() - 1);
11539
- start.setHours(0, 0, 0, 0);
11540
- end.setHours(23, 59, 59, 999);
11541
- setDateRange({
11542
- start,
11543
- end
11544
- });
11545
- }
11546
- },
11547
- color: "gray",
11548
- size
11549
- }
11550
- ),
11551
- /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11552
- Button,
11463
+ ) : trigger }),
11464
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11465
+ DropdownContent,
11466
+ {
11467
+ align,
11468
+ sideOffset: 5,
11469
+ className: (0, import_clsx3.default)("z-10 overflow-hidden p-0", wrapperClassName),
11470
+ children: /* @__PURE__ */ (0, import_jsx_runtime309.jsx)("div", { className: "top-full z-10", children: mode === "single" ? /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11471
+ Calendar2,
11553
11472
  {
11554
- color: "danger",
11555
- variant: "outline",
11556
11473
  size,
11557
- onClick: () => {
11558
- setDateRange({ start: null, end: null });
11559
- setSelectedFilter([]);
11560
- },
11561
- children: "Reset"
11562
- }
11563
- )
11564
- ] }),
11565
- /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex flex-col", children: [
11566
- /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)(
11567
- "div",
11568
- {
11569
- className: cn("flex", isMobile ? "flex-col" : "flex-row"),
11570
- children: [
11571
- /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11572
- Calendar2,
11573
- {
11574
- size,
11575
- wrapperClassname: "w-full rounded-none! border-0",
11576
- weekWrapperClassname: "w-full justify-between",
11577
- dayWrapperClassname: "justify-between",
11578
- onChange: handleRangeCalendarChange,
11579
- value: dateRange.start,
11580
- rangeValue: dateRange,
11581
- mode: "range",
11582
- ...startDateCalendarProps
11583
- }
11584
- ),
11585
- !isMobile && /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11586
- Calendar2,
11587
- {
11588
- size,
11589
- wrapperClassname: "w-full rounded-none border-0 border-l",
11590
- weekWrapperClassname: "w-full justify-between",
11591
- dayWrapperClassname: "justify-between",
11592
- onChange: handleRangeCalendarChange,
11593
- value: dateRange.end,
11594
- rangeValue: dateRange,
11595
- mode: "range",
11596
- defaultMonth: nextMonthData.month,
11597
- defaultYear: nextMonthData.year,
11598
- ...endDateCalendarProps
11599
- }
11600
- )
11601
- ]
11474
+ wrapperClassname: "w-full border-0",
11475
+ weekWrapperClassname: "w-full justify-between",
11476
+ dayWrapperClassname: "justify-between",
11477
+ onChange: handleCalendarChange,
11478
+ value: selectedDate,
11479
+ ...calendarProps
11602
11480
  }
11603
- ),
11604
- /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex flex-col items-end justify-between gap-2 border-t border-gray-300 px-4 py-3 md:flex-row md:items-center", children: [
11605
- /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex items-center gap-2", children: [
11481
+ ) : /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex", children: [
11482
+ showController && /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex flex-col items-start gap-2 border-r border-gray-400 px-3 py-6.5", children: [
11606
11483
  /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11607
- Input,
11484
+ ChipGroup,
11608
11485
  {
11609
- size,
11610
- readOnly: true,
11611
- className: "w-30 truncate",
11612
- placeholder: "Start Date",
11613
- value: formatDateToString(
11614
- dateRange.start,
11615
- "DD MMM YYYY"
11616
- )
11486
+ direction: "vertical",
11487
+ options: filterCalendar,
11488
+ selected: selectedFilter,
11489
+ onSelect: (val) => {
11490
+ setSelectedFilter(val);
11491
+ const now = /* @__PURE__ */ new Date();
11492
+ const end = /* @__PURE__ */ new Date();
11493
+ const start = /* @__PURE__ */ new Date();
11494
+ if (val[0] === 0) {
11495
+ const day = now.getDay();
11496
+ const diffToMonday = day === 0 ? -6 : 1 - day;
11497
+ const startOfThisWeek = new Date(now);
11498
+ startOfThisWeek.setDate(now.getDate() + diffToMonday);
11499
+ startOfThisWeek.setHours(0, 0, 0, 0);
11500
+ const startOfLastWeek = new Date(startOfThisWeek);
11501
+ startOfLastWeek.setDate(
11502
+ startOfThisWeek.getDate() - 7
11503
+ );
11504
+ const endOfLastWeek = new Date(startOfThisWeek);
11505
+ endOfLastWeek.setDate(startOfThisWeek.getDate() - 1);
11506
+ endOfLastWeek.setHours(23, 59, 59, 999);
11507
+ setDateRange({
11508
+ start: startOfLastWeek,
11509
+ end: endOfLastWeek
11510
+ });
11511
+ } else if (val[0] === 1) {
11512
+ start.setDate(end.getDate() - 7);
11513
+ start.setHours(0, 0, 0, 0);
11514
+ end.setHours(23, 59, 59, 999);
11515
+ setDateRange({
11516
+ start,
11517
+ end
11518
+ });
11519
+ } else if (val[0] === 2) {
11520
+ start.setDate(end.getDate() - 29);
11521
+ start.setHours(0, 0, 0, 0);
11522
+ end.setHours(23, 59, 59, 999);
11523
+ setDateRange({
11524
+ start,
11525
+ end
11526
+ });
11527
+ } else if (val[0] === 3) {
11528
+ const start2 = new Date(
11529
+ now.getFullYear(),
11530
+ now.getMonth(),
11531
+ 1
11532
+ );
11533
+ const end2 = new Date(
11534
+ now.getFullYear(),
11535
+ now.getMonth() + 1,
11536
+ 0
11537
+ );
11538
+ start2.setHours(0, 0, 0, 0);
11539
+ end2.setHours(23, 59, 59, 999);
11540
+ setDateRange({
11541
+ start: start2,
11542
+ end: end2
11543
+ });
11544
+ } else if (val[0] === 4) {
11545
+ start.setFullYear(end.getFullYear() - 1);
11546
+ start.setHours(0, 0, 0, 0);
11547
+ end.setHours(23, 59, 59, 999);
11548
+ setDateRange({
11549
+ start,
11550
+ end
11551
+ });
11552
+ }
11553
+ },
11554
+ color: "gray",
11555
+ size
11617
11556
  }
11618
11557
  ),
11619
- /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(Icon_default, { name: "minus", size: 16 }),
11620
11558
  /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11621
- Input,
11559
+ Button,
11622
11560
  {
11561
+ color: "danger",
11562
+ variant: "outline",
11623
11563
  size,
11624
- readOnly: true,
11625
- placeholder: "End Date",
11626
- className: "w-30 truncate",
11627
- value: formatDateToString(dateRange.end, "DD MMM YYYY")
11564
+ onClick: () => {
11565
+ setDateRange({ start: null, end: null });
11566
+ setSelectedFilter([]);
11567
+ },
11568
+ children: "Reset"
11628
11569
  }
11629
11570
  )
11630
11571
  ] }),
11631
- /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex items-center gap-2", children: [
11632
- /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11633
- Button,
11572
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex flex-col", children: [
11573
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)(
11574
+ "div",
11634
11575
  {
11635
- onClick: () => setIsCalendarShow(false),
11636
- variant: "tertiary",
11637
- children: "Cancel"
11576
+ className: cn("flex", isMobile ? "flex-col" : "flex-row"),
11577
+ children: [
11578
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11579
+ Calendar2,
11580
+ {
11581
+ size,
11582
+ wrapperClassname: "w-full rounded-none! border-0",
11583
+ weekWrapperClassname: "w-full justify-between",
11584
+ dayWrapperClassname: "justify-between",
11585
+ onChange: handleRangeCalendarChange,
11586
+ value: dateRange.start,
11587
+ rangeValue: dateRange,
11588
+ mode: "range",
11589
+ ...startDateCalendarProps
11590
+ }
11591
+ ),
11592
+ !isMobile && /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11593
+ Calendar2,
11594
+ {
11595
+ size,
11596
+ wrapperClassname: "w-full rounded-none border-0 border-l",
11597
+ weekWrapperClassname: "w-full justify-between",
11598
+ dayWrapperClassname: "justify-between",
11599
+ onChange: handleRangeCalendarChange,
11600
+ value: dateRange.end,
11601
+ rangeValue: dateRange,
11602
+ mode: "range",
11603
+ defaultMonth: nextMonthData.month,
11604
+ defaultYear: nextMonthData.year,
11605
+ ...endDateCalendarProps
11606
+ }
11607
+ )
11608
+ ]
11638
11609
  }
11639
11610
  ),
11640
- /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(Button, { onClick: handleApplyDateRange, children: "Apply" })
11611
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex flex-col items-end justify-between gap-2 border-t border-gray-300 px-4 py-3 md:flex-row md:items-center", children: [
11612
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex items-center gap-2", children: [
11613
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11614
+ Input,
11615
+ {
11616
+ size,
11617
+ readOnly: true,
11618
+ className: "w-30 truncate",
11619
+ placeholder: "Start Date",
11620
+ value: formatDateToString(
11621
+ dateRange.start,
11622
+ "DD MMM YYYY"
11623
+ )
11624
+ }
11625
+ ),
11626
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(Icon_default, { name: "minus", size: 16 }),
11627
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11628
+ Input,
11629
+ {
11630
+ size,
11631
+ readOnly: true,
11632
+ placeholder: "End Date",
11633
+ className: "w-30 truncate",
11634
+ value: formatDateToString(dateRange.end, "DD MMM YYYY")
11635
+ }
11636
+ )
11637
+ ] }),
11638
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsxs)("div", { className: "flex items-center gap-2", children: [
11639
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(
11640
+ Button,
11641
+ {
11642
+ onClick: () => setIsCalendarShow(false),
11643
+ variant: "tertiary",
11644
+ children: "Cancel"
11645
+ }
11646
+ ),
11647
+ /* @__PURE__ */ (0, import_jsx_runtime309.jsx)(Button, { onClick: handleApplyDateRange, children: "Apply" })
11648
+ ] })
11649
+ ] })
11641
11650
  ] })
11642
- ] })
11643
- ] })
11644
- ] }) })
11645
- }
11646
- )
11647
- ]
11651
+ ] }) })
11652
+ }
11653
+ )
11654
+ ]
11655
+ }
11656
+ )
11648
11657
  }
11649
- ) });
11658
+ );
11650
11659
  };
11651
11660
 
11652
11661
  // src/components/textarea/textarea.tsx