@ctlyst.id/internal-ui 3.3.1 → 3.3.3

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/index.js CHANGED
@@ -4785,10 +4785,82 @@ var import_react81 = require("@chakra-ui/react");
4785
4785
  var import_react82 = require("@chakra-ui/react");
4786
4786
 
4787
4787
  // src/components/time-input/components/index.tsx
4788
- var import_react83 = require("@chakra-ui/react");
4788
+ var import_react84 = require("@chakra-ui/react");
4789
4789
  var import_internal_icon10 = require("@ctlyst.id/internal-icon");
4790
- var import_react84 = require("react");
4791
- var import_react85 = require("timescape/react");
4790
+ var import_react85 = require("react");
4791
+
4792
+ // src/components/time-input/components/integration.tsx
4793
+ var import_react83 = require("react");
4794
+ var import_timescape = require("timescape");
4795
+ var import_timescape2 = require("timescape");
4796
+ var useTimescape = (options = {}) => {
4797
+ var _a;
4798
+ const { date, onChangeDate, ...rest } = options;
4799
+ const [manager] = (0, import_react83.useState)(() => new import_timescape.TimescapeManager(date, rest));
4800
+ const onChangeDateRef = (0, import_react83.useRef)(onChangeDate);
4801
+ (0, import_react83.useLayoutEffect)(() => {
4802
+ onChangeDateRef.current = onChangeDate;
4803
+ }, [onChangeDate]);
4804
+ const [optionsState, update] = (0, import_react83.useState)(() => ({
4805
+ date,
4806
+ ...rest
4807
+ }));
4808
+ (0, import_react83.useEffect)(() => {
4809
+ manager.resync();
4810
+ return () => {
4811
+ manager.remove();
4812
+ };
4813
+ }, [manager]);
4814
+ (0, import_react83.useEffect)(() => {
4815
+ return manager.on("changeDate", (nextDate) => {
4816
+ var _a2;
4817
+ (_a2 = onChangeDateRef.current) == null ? void 0 : _a2.call(onChangeDateRef, nextDate);
4818
+ update((value) => ({ ...value, date: nextDate }));
4819
+ });
4820
+ }, [manager]);
4821
+ const timestamp = (_a = optionsState.date) == null ? void 0 : _a.getTime();
4822
+ (0, import_react83.useEffect)(() => {
4823
+ manager.date = timestamp;
4824
+ manager.minDate = optionsState.minDate;
4825
+ manager.maxDate = optionsState.maxDate;
4826
+ manager.hour12 = optionsState.hour12;
4827
+ manager.wrapAround = optionsState.wrapAround;
4828
+ manager.digits = optionsState.digits;
4829
+ manager.snapToStep = optionsState.snapToStep;
4830
+ }, [
4831
+ manager,
4832
+ timestamp,
4833
+ optionsState.minDate,
4834
+ optionsState.maxDate,
4835
+ optionsState.hour12,
4836
+ optionsState.wrapAround,
4837
+ optionsState.digits,
4838
+ optionsState.snapToStep
4839
+ ]);
4840
+ return {
4841
+ _manager: manager,
4842
+ getInputProps: (type, opts) => ({
4843
+ _ref: (element) => {
4844
+ if (!element) return;
4845
+ manager.registerElement(element, type, opts == null ? void 0 : opts.autofocus);
4846
+ if (opts == null ? void 0 : opts.ref) opts.ref.current = element;
4847
+ },
4848
+ get ref() {
4849
+ return this._ref;
4850
+ },
4851
+ set ref(value) {
4852
+ this._ref = value;
4853
+ }
4854
+ }),
4855
+ getRootProps: () => ({
4856
+ ref: (element) => element && manager.registerRoot(element)
4857
+ }),
4858
+ options: optionsState,
4859
+ update
4860
+ };
4861
+ };
4862
+
4863
+ // src/components/time-input/components/index.tsx
4792
4864
  var import_jsx_runtime63 = require("react/jsx-runtime");
4793
4865
  var Time = class {
4794
4866
  constructor(hours, minutes, seconds) {
@@ -4803,9 +4875,9 @@ var Time = class {
4803
4875
  return `${this.hours}:${this.minutes}:${this.seconds}`;
4804
4876
  }
4805
4877
  };
4806
- var InputTimeArea = (0, import_react83.forwardRef)((props, ref) => {
4878
+ var InputTimeArea = (0, import_react84.forwardRef)((props, ref) => {
4807
4879
  return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
4808
- import_react83.Input,
4880
+ import_react84.Input,
4809
4881
  {
4810
4882
  _focusWithin: {
4811
4883
  bg: "neutral.300"
@@ -4821,7 +4893,7 @@ var InputTimeArea = (0, import_react83.forwardRef)((props, ref) => {
4821
4893
  }
4822
4894
  );
4823
4895
  });
4824
- var TimeInput2 = (0, import_react83.forwardRef)(
4896
+ var TimeInput2 = (0, import_react84.forwardRef)(
4825
4897
  ({
4826
4898
  config: config2,
4827
4899
  label,
@@ -4841,11 +4913,11 @@ var TimeInput2 = (0, import_react83.forwardRef)(
4841
4913
  defaultDate.setHours(0, 0, 0, 0);
4842
4914
  const date = dateVal ? new Date(dateVal) : defaultDate;
4843
4915
  const timeValue = new Time();
4844
- const { getRootProps, getInputProps, options, update, _manager } = (0, import_react85.useTimescape)({
4916
+ const { getRootProps, getInputProps, options, update, _manager } = useTimescape({
4845
4917
  date,
4846
4918
  ...config2
4847
4919
  });
4848
- (0, import_react84.useEffect)(() => {
4920
+ (0, import_react85.useEffect)(() => {
4849
4921
  var _a, _b, _c, _d, _e, _f;
4850
4922
  timeValue.hours = (_b = (_a = options == null ? void 0 : options.date) == null ? void 0 : _a.getHours()) != null ? _b : 0;
4851
4923
  timeValue.minutes = (_d = (_c = options == null ? void 0 : options.date) == null ? void 0 : _c.getMinutes()) != null ? _d : 0;
@@ -4854,14 +4926,14 @@ var TimeInput2 = (0, import_react83.forwardRef)(
4854
4926
  onChangeTime(timeValue);
4855
4927
  }
4856
4928
  }, [options.date]);
4857
- (0, import_react84.useImperativeHandle)(ref, () => ({
4929
+ (0, import_react85.useImperativeHandle)(ref, () => ({
4858
4930
  focus() {
4859
4931
  _manager.focusField("hours");
4860
4932
  }
4861
4933
  }));
4862
4934
  const rootProps = getRootProps();
4863
4935
  const hoursProps = getInputProps("hours");
4864
- return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react83.Box, { ...boxProps, ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
4936
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react84.Box, { ...boxProps, ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
4865
4937
  field_default,
4866
4938
  {
4867
4939
  isError,
@@ -4871,7 +4943,7 @@ var TimeInput2 = (0, import_react83.forwardRef)(
4871
4943
  isDisabled,
4872
4944
  isSuccess,
4873
4945
  children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
4874
- import_react83.InputGroup,
4946
+ import_react84.InputGroup,
4875
4947
  {
4876
4948
  borderRadius: "sm",
4877
4949
  backgroundColor: isDisabled ? "neutral.300" : "white.high",
@@ -4879,7 +4951,7 @@ var TimeInput2 = (0, import_react83.forwardRef)(
4879
4951
  alignItems: "center",
4880
4952
  gap: 3,
4881
4953
  children: [
4882
- /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_react83.Flex, { gap: 1, width: "100%", alignItems: "center", pl: 2, children: [
4954
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_react84.Flex, { gap: 1, width: "100%", alignItems: "center", pl: 2, children: [
4883
4955
  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(InputTimeArea, { ...hoursProps }),
4884
4956
  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { children: ":" }),
4885
4957
  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(InputTimeArea, { ...getInputProps("minutes") }),
@@ -4887,7 +4959,7 @@ var TimeInput2 = (0, import_react83.forwardRef)(
4887
4959
  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { children: ":" }),
4888
4960
  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(InputTimeArea, { ...getInputProps("seconds") })
4889
4961
  ] }),
4890
- options.hour12 && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("input", { ...getInputProps("am/pm") })
4962
+ options.hour12 && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react84.Input, { p: 0, ...getInputProps("am/pm") })
4891
4963
  ] }),
4892
4964
  /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_internal_icon10.Clock, { color: "neutral.400" }),
4893
4965
  addOnRight