@ctlyst.id/internal-ui 3.3.7 → 3.3.9

Sign up to get free protection for your applications and to get access to all the features.
package/dist/index.js CHANGED
@@ -2496,7 +2496,33 @@ var Datepicker = ({
2496
2496
  id,
2497
2497
  name,
2498
2498
  selected,
2499
- customInput: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(input_field_default, { label, isRequired, autoComplete: "off", isError }),
2499
+ customInput: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
2500
+ input_field_default,
2501
+ {
2502
+ label,
2503
+ isRequired,
2504
+ autoComplete: "off",
2505
+ isError,
2506
+ addOnRight: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react20.InputRightElement, { alignSelf: "center", bottom: 0, flexDir: "row-reverse", width: "auto", mr: 2, gap: 2, children: [
2507
+ /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_internal_icon6.Calendar, { size: 4, color: "neutral.400" }),
2508
+ value && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
2509
+ import_react33.IconButton,
2510
+ {
2511
+ "data-test-id": "H0rseVCzGIaqoLho-EPbu",
2512
+ display: "flex",
2513
+ alignItems: "center",
2514
+ variant: "unstyled",
2515
+ "aria-label": "Remove",
2516
+ onClick: onClear,
2517
+ cursor: "pointer",
2518
+ size: "sm",
2519
+ minW: "unset",
2520
+ icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_internal_icon6.Close, { size: 4, color: "neutral.600" })
2521
+ }
2522
+ )
2523
+ ] })
2524
+ }
2525
+ ),
2500
2526
  showPopperArrow: false,
2501
2527
  calendarClassName: (0, import_shared_utils8.cx)({ inline: props.inline }),
2502
2528
  dropdownMode: "select",
@@ -2514,27 +2540,7 @@ var Datepicker = ({
2514
2540
  return component;
2515
2541
  }
2516
2542
  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react33.FormControl, { "data-test-id": "CT_Component_datepicker_wrapper", isInvalid: isError, children: [
2517
- /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react33.InputGroup, { children: [
2518
- component,
2519
- /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react33.InputRightElement, { alignSelf: "center", bottom: 0, flexDir: "row-reverse", width: "auto", mr: 2, gap: 2, children: [
2520
- /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_internal_icon6.Calendar, { size: 4, color: "neutral.400" }),
2521
- value && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
2522
- import_react33.IconButton,
2523
- {
2524
- "data-test-id": "H0rseVCzGIaqoLho-EPbu",
2525
- display: "flex",
2526
- alignItems: "center",
2527
- variant: "unstyled",
2528
- "aria-label": "Remove",
2529
- onClick: onClear,
2530
- cursor: "pointer",
2531
- size: "sm",
2532
- minW: "unset",
2533
- icon: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_internal_icon6.Close, { size: 4, color: "neutral.600" })
2534
- }
2535
- )
2536
- ] })
2537
- ] }),
2543
+ component,
2538
2544
  !isError ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react33.FormHelperText, { fontSize: "text.xs", mt: 1, children: helperText }) : /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react33.FormErrorMessage, { fontSize: "text.xs", mt: 1, children: error })
2539
2545
  ] });
2540
2546
  };
@@ -4873,9 +4879,10 @@ var InputTimeArea = (0, import_react84.forwardRef)((props, ref) => {
4873
4879
  bg: "neutral.300"
4874
4880
  },
4875
4881
  boxSizing: "content-box",
4876
- height: "24px",
4882
+ height: "22px",
4877
4883
  ref,
4878
- p: "2px",
4884
+ px: "2px",
4885
+ py: 0,
4879
4886
  sx: {
4880
4887
  fontVariantNumeric: "tabular-nums"
4881
4888
  },
@@ -4966,7 +4973,7 @@ var TimeInput2 = (0, import_react84.forwardRef)(
4966
4973
  alignItems: "center",
4967
4974
  gap: 3,
4968
4975
  children: [
4969
- /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_react84.Flex, { gap: 1, width: "100%", alignItems: "center", pl: 2, children: [
4976
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_react84.Flex, { gap: "1px", width: "100%", alignItems: "center", pl: 2, children: [
4970
4977
  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(InputTimeArea, { ...hoursProps }),
4971
4978
  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { children: ":" }),
4972
4979
  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(InputTimeArea, { ...getInputProps("minutes") }),
@@ -4976,7 +4983,7 @@ var TimeInput2 = (0, import_react84.forwardRef)(
4976
4983
  ] }),
4977
4984
  options.hour12 && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react84.Input, { p: 0, ...getInputProps("am/pm") })
4978
4985
  ] }),
4979
- /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_internal_icon10.Clock, { color: "neutral.400" }),
4986
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_internal_icon10.Clock, { color: "neutral.400", size: 4 }),
4980
4987
  addOnRight
4981
4988
  ]
4982
4989
  }