import { jsxs as s, jsx as t } from "react/jsx-runtime";
import { Button as l, ButtonSizes as D, ButtonTypes as m } from "./index-Button.js";
import { IconNames as N } from "./index-IconNames.js";
import { Render as f } from "./index-Render.js";
import { Text as h, TextTypes as S, FontWeights as b } from "./index-Text.js";
import { Textarea as w } from "./index-Textarea.js";
import { useState as k, useMemo as p } from "react";
import r from "./index-TextEditDrawer.module.scss.js";
const W = (x) => {
  const {
    title: v,
    description: d,
    defaultValue: n,
    value: o,
    maxLength: i,
    required: a = !1,
    onClose: c,
    onSave: C
  } = x, [e, u] = k(o), g = () => {
    C(e.trim()), c();
  }, B = p(() => !!(a && !e.trim() || i !== void 0 && e.trim().length > i || e === o), [o, e, a, i]), T = p(() => e === n, [n, e]);
  return s("div", {
    className: r.textEditDrawerContainer,
    children: [t(h, {
      className: r.textEditDrawerTitle,
      fontWeight: b.bold,
      type: S.heading2,
      children: v
    }), t(f, {
      if: !!d,
      children: t(h, {
        children: d
      })
    }), s("div", {
      className: r.textBoxContainer,
      children: [t(f, {
        if: !!n,
        className: r.restoreButtonContainer,
        children: t(l, {
          disabled: T,
          type: m.secondary,
          size: D.small,
          onClick: () => u(n),
          children: "Restore to default"
        })
      }), t(w, {
        onChange: (y) => u(y.target.value),
        value: e,
        maxLength: i,
        required: a,
        allowBreakLines: !0
      })]
    }), s("div", {
      className: r.textEditDrawerActionsContainer,
      children: [t(l, {
        onClick: g,
        iconLeft: N.save,
        disabled: B,
        children: "Save"
      }), t(l, {
        type: m.default,
        onClick: c,
        children: "Cancel"
      })]
    })]
  });
};
export {
  W as TextEditDrawer
};
