laif-ds/dist/components/ui/textarea.js

Design System di Laif con componenti React basati su principi di Atomic Design

"use client";
import { jsxs as c, jsx as r } from "react/jsx-runtime";
import { designTokens as t } from "../design-tokens.js";
import { Label as m } from "./label.js";
import { cn as s } from "../../lib/utils.js";
function b({
  wrpClassName: o,
  className: a,
  label: e,
  labelClassName: n,
  id: d,
  ...l
}) {
  const i = d || (e ? `textarea-${Math.random().toString(36).substring(2, 9)}` : void 0);
  return /* @__PURE__ */ c("div", { className: s("space-y-1.5", o), children: [
    e && /* @__PURE__ */ r(m, { htmlFor: i, className: n, children: e }),
    /* @__PURE__ */ r(
      "textarea",
      {
        id: i,
        "data-slot": "textarea",
        className: s(
          t.input.base,
          t.radius.default,
          t.text.base,
          t.text.placeholder,
          t.interaction.disabled,
          "flex field-sizing-content min-h-16 w-full px-3 py-2 shadow-xs transition-[color,box-shadow] outline-none md:text-sm",
          // Focus states
          "focus-visible:ring-d-ring/50 focus-visible:border-d-ring focus-visible:ring-[3px]",
          t.input.invalid,
          a
        ),
        ...l
      }
    )
  ] });
}
export {
  b as Textarea
};