@aokiapp/rjsf-mantine-theme/dist/widgets/AltDateWidget.cjs

Mantine theme, fields and widgets for react-jsonschema-form

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('react/jsx-runtime');
var react = require('react');
var utils = require('@rjsf/utils');
var core = require('@mantine/core');

function rangeOptions(start, stop) {
  const options = [];
  for (let i = start; i <= stop; i++) {
    options.push({ value: i, label: utils.pad(i, 2) });
  }
  return options;
}
function readyForChange(state) {
  return Object.values(state).every((value) => value !== -1);
}
function DateElement({
  type,
  range,
  value,
  select,
  rootId,
  name,
  disabled,
  readonly,
  autofocus,
  registry,
  onBlur,
  onFocus
}) {
  const id = rootId + "_" + type;
  const { SelectWidget } = registry.widgets;
  return /* @__PURE__ */ jsxRuntime.jsx(
    SelectWidget,
    {
      schema: { type: "integer" },
      id,
      name,
      className: "form-control",
      options: { enumOptions: rangeOptions(range[0], range[1]) },
      placeholder: type,
      value,
      disabled,
      readonly,
      autofocus,
      onChange: (value2) => select(type, value2),
      onBlur,
      onFocus,
      registry,
      label: "",
      "aria-describedby": utils.ariaDescribedByIds(rootId)
    }
  );
}
function AltDateWidget({
  time = false,
  disabled = false,
  readonly = false,
  autofocus = false,
  options,
  id,
  name,
  registry,
  onBlur,
  onFocus,
  onChange,
  value,
  className
}) {
  const { translateString } = registry;
  const [lastValue, setLastValue] = react.useState(value);
  const [state, setState] = react.useReducer(
    (state2, action) => {
      return { ...state2, ...action };
    },
    utils.parseDateString(value, time)
  );
  react.useEffect(() => {
    const stateValue = utils.toDateString(state, time);
    if (readyForChange(state) && stateValue !== value) {
      onChange(stateValue);
    } else if (lastValue !== value) {
      setLastValue(value);
      setState(utils.parseDateString(value, time));
    }
  }, [time, value, onChange, state, lastValue]);
  const handleChange = react.useCallback((property, value2) => {
    setState({ [property]: value2 });
  }, []);
  const handleSetNow = react.useCallback(
    (event) => {
      event.preventDefault();
      if (disabled || readonly) {
        return;
      }
      const nextState = utils.parseDateString((/* @__PURE__ */ new Date()).toJSON(), time);
      onChange(utils.toDateString(nextState, time));
    },
    [disabled, onChange, readonly, time]
  );
  const handleClear = react.useCallback(
    (event) => {
      event.preventDefault();
      if (disabled || readonly) {
        return;
      }
      onChange(void 0);
    },
    [disabled, readonly, onChange]
  );
  return /* @__PURE__ */ jsxRuntime.jsxs(core.Stack, { className: `armt-widget-altdate ${className ?? ""}`, gap: "xs", children: [
    /* @__PURE__ */ jsxRuntime.jsx(core.Grid, { children: utils.getDateElementProps(
      state,
      time,
      options.yearsRange,
      options.format
    ).map((elemProps, i) => /* @__PURE__ */ jsxRuntime.jsx(core.Grid.Col, { span: 4, children: /* @__PURE__ */ jsxRuntime.jsx(
      DateElement,
      {
        rootId: id,
        name,
        select: handleChange,
        ...elemProps,
        disabled,
        readonly,
        registry,
        onBlur,
        onFocus,
        autofocus: autofocus && i === 0
      }
    ) }, i)) }),
    /* @__PURE__ */ jsxRuntime.jsxs(core.Group, { justify: "flex-end", children: [
      (options.hideNowButton !== "undefined" ? !options.hideNowButton : true) && /* @__PURE__ */ jsxRuntime.jsx(core.Button, { variant: "filled", onClick: handleSetNow, children: translateString(utils.TranslatableString.NowLabel) }),
      (options.hideClearButton !== "undefined" ? !options.hideClearButton : true) && /* @__PURE__ */ jsxRuntime.jsx(core.Button, { variant: "outline", onClick: handleClear, children: translateString(utils.TranslatableString.ClearLabel) })
    ] })
  ] });
}

exports.default = AltDateWidget;
//# sourceMappingURL=AltDateWidget.cjs.map