@fabio.caffarello/react-design-system 4.1.0 → 4.2.0

package/dist/granular/ui/primitives/Input/InputBase.js

@@ -0,0 +1,223 @@
+"use client";
+var D = Object.defineProperty;
+var u = Object.getOwnPropertySymbols;
+var w = Object.prototype.hasOwnProperty, C = Object.prototype.propertyIsEnumerable;
+var N = (s, e, o) => e in s ? D(s, e, { enumerable: !0, configurable: !0, writable: !0, value: o }) : s[e] = o, B = (s, e) => {
+  for (var o in e || (e = {}))
+    w.call(e, o) && N(s, o, e[o]);
+  if (u)
+    for (var o of u(e))
+      C.call(e, o) && N(s, o, e[o]);
+  return s;
+};
+var $ = (s, e) => {
+  var o = {};
+  for (var t in s)
+    w.call(s, t) && e.indexOf(t) < 0 && (o[t] = s[t]);
+  if (s != null && u)
+    for (var t of u(s))
+      e.indexOf(t) < 0 && C.call(s, t) && (o[t] = s[t]);
+  return o;
+};
+import { jsxs as I, jsx as l } from "react/jsx-runtime";
+import { forwardRef as F } from "react";
+import { getTypographyClasses as E, getTypographySize as m } from "../../tokens/typography.js";
+import { getRadiusClass as L } from "../../tokens/radius.js";
+import { getSpacingClass as n } from "../../tokens/spacing.js";
+import { cn as a } from "../../utils/cn.js";
+import { cva as O } from "../../utils/cva.js";
+const W = O(
+  a(
+    "w-full",
+    L("md"),
+    "transition-colors",
+    "focus:outline-none",
+    "focus:ring-2",
+    "focus:ring-offset-2",
+    "disabled:opacity-50",
+    "disabled:cursor-not-allowed"
+  ),
+  {
+    variants: {
+      variant: {
+        default: a(
+          "border-0",
+          "border-b-2",
+          "border-line-default",
+          "focus:border-line-focus"
+        ),
+        outlined: a(
+          "border",
+          "border-line-default",
+          "focus:border-line-focus"
+        ),
+        filled: a(
+          "bg-surface-muted",
+          "border-0",
+          "focus:bg-surface-base",
+          "focus:ring-2",
+          "focus:ring-line-focus"
+        )
+      },
+      size: {
+        sm: a(
+          "h-8",
+          m("bodySmall"),
+          n("md", "px")
+        ),
+        md: a(
+          "h-10",
+          m("body"),
+          n("base", "px")
+        ),
+        lg: a(
+          "h-12",
+          m("bodyLarge"),
+          n("lg", "px")
+        )
+      },
+      state: {
+        default: "",
+        error: a("border-error", "focus:border-error", "focus:ring-error"),
+        success: a(
+          "border-success",
+          "focus:border-success",
+          "focus:ring-success"
+        )
+      }
+    },
+    defaultVariants: {
+      variant: "outlined",
+      size: "md",
+      state: "default"
+    }
+  }
+);
+function _({
+  error: s,
+  success: e,
+  helperText: o,
+  errorId: t,
+  helperId: i
+}) {
+  const c = a(
+    n("xs", "mt"),
+    E("caption"),
+    s && "text-fg-error",
+    e && "text-fg-success",
+    !s && !e && "text-fg-secondary"
+  );
+  return /* @__PURE__ */ l(
+    "div",
+    {
+      id: t || i,
+      className: c,
+      role: s || e ? "alert" : void 0,
+      children: o || (s ? "Error" : e ? "Success" : "")
+    }
+  );
+}
+const A = F(
+  function(G, q) {
+    var v = G, {
+      id: e,
+      label: o,
+      error: t = !1,
+      success: i = !1,
+      helperText: c,
+      size: r = "md",
+      variant: V = "outlined",
+      leftIcon: f,
+      rightIcon: p,
+      rightSlot: d,
+      className: j = "",
+      disabled: b = !1,
+      type: k = "text"
+    } = v, g = $(v, [
+      "id",
+      "label",
+      "error",
+      "success",
+      "helperText",
+      "size",
+      "variant",
+      "leftIcon",
+      "rightIcon",
+      "rightSlot",
+      "className",
+      "disabled",
+      "type"
+    ]);
+    typeof process != "undefined" && process.env.NODE_ENV !== "production" && o && !e && console.warn(
+      "[InputBase] `label` was provided without an `id`. The <label> cannot bind to the input (InputBase does not auto-generate an id — that needs a client hook). Pass an `id`, or use the interactive `Input` which auto-generates one."
+    );
+    const H = t ? "error" : i ? "success" : "default", x = t && e ? `${e}-error` : void 0, h = c && e ? `${e}-helper` : void 0, y = r === "sm" ? "h-4 w-4" : r === "lg" ? "h-5 w-5" : "h-4 w-4", P = r === "sm" ? "top-2" : r === "lg" ? "top-3.5" : "top-2.5", R = a(
+      W({ variant: V, size: r, state: H }),
+      // Icon padding — `pl-9` / `pr-9` aren't on the spacing scale (no
+      // semantic key for 36px) so they stay raw at the `sm` size; md/lg use
+      // the getter. Mirrors the original Input contract.
+      f && (r === "sm" ? "pl-9" : r === "lg" ? n("3xl", "pl") : n("2xl", "pl")),
+      (p || d) && (r === "sm" ? "pr-9" : r === "lg" ? n("3xl", "pr") : n("2xl", "pr")),
+      j
+    ), T = a(
+      "block",
+      E("label"),
+      n("xs", "mb"),
+      b && "opacity-50"
+    );
+    return /* @__PURE__ */ I("div", { className: "w-full", children: [
+      o && /* @__PURE__ */ l("label", { htmlFor: e, className: T, children: o }),
+      /* @__PURE__ */ I("div", { className: "relative", children: [
+        f && /* @__PURE__ */ l(
+          "div",
+          {
+            className: `absolute left-3 ${P} text-fg-secondary opacity-60 pointer-events-none`,
+            children: /* @__PURE__ */ l("div", { className: y, children: f })
+          }
+        ),
+        /* @__PURE__ */ l(
+          "input",
+          B({
+            id: e,
+            ref: q,
+            type: k,
+            className: R,
+            disabled: b,
+            "aria-invalid": t,
+            "aria-required": g.required,
+            "aria-describedby": x || h,
+            suppressHydrationWarning: !0
+          }, g)
+        ),
+        (p || d) && /* @__PURE__ */ l(
+          "div",
+          {
+            className: `absolute right-3 top-0 bottom-0 flex items-center ${n("xs", "gap")}`,
+            children: d != null ? d : /* @__PURE__ */ l(
+              "div",
+              {
+                className: `text-fg-secondary opacity-60 pointer-events-none ${y}`,
+                children: p
+              }
+            )
+          }
+        )
+      ] }),
+      (t || i || c) && /* @__PURE__ */ l(
+        _,
+        {
+          error: t,
+          success: i,
+          helperText: c,
+          errorId: x,
+          helperId: h
+        }
+      )
+    ] });
+  }
+);
+A.displayName = "InputBase";
+export {
+  A as default
+};
+//# sourceMappingURL=InputBase.js.map

package/dist/granular/ui/primitives/Input/InputBase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InputBase.js","sources":["../../../../../src/ui/primitives/Input/InputBase.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type { InputHTMLAttributes, ReactNode } from \"react\";\nimport {\n  getTypographyClasses,\n  getTypographySize,\n} from \"../../tokens/typography\";\nimport { getRadiusClass } from \"../../tokens/radius\";\nimport { getSpacingClass } from \"../../tokens/spacing\";\nimport { cn, cva } from \"../../utils\";\n\n// Ambient declaration so the dev-only warn below typechecks without\n// pulling @types/node into the app tsconfig. At runtime the consumer's\n// bundler replaces `process.env.NODE_ENV` with a literal; the\n// `typeof process` guard keeps the branch safe in browser/edge runtimes.\ndeclare const process: { env: { NODE_ENV?: string } };\n\nexport type InputSize = \"sm\" | \"md\" | \"lg\";\nexport type InputVariant = \"default\" | \"outlined\" | \"filled\";\nexport type InputState = \"default\" | \"error\" | \"success\";\n\n/**\n * Input variant tokens (issue #224). They used to live inside `Input`\n * wrapped in `useMemo`; moving them here, to the server-safe `InputBase`,\n * removes that decorative memo and makes `InputBase` the single source of\n * the input's visual surface — the interactive `Input` inherits it by\n * composing `InputBase` rather than re-declaring the cva. The focus-ring\n * colours are inlined directly (the old code derived them via\n * `.replace(\"focus:border-\", \"focus:ring-\")`, which produced exactly\n * these classes).\n */\nconst inputVariants = cva(\n  cn(\n    \"w-full\",\n    getRadiusClass(\"md\"),\n    \"transition-colors\",\n    \"focus:outline-none\",\n    \"focus:ring-2\",\n    \"focus:ring-offset-2\",\n    \"disabled:opacity-50\",\n    \"disabled:cursor-not-allowed\",\n  ),\n  {\n    variants: {\n      variant: {\n        default: cn(\n          \"border-0\",\n          \"border-b-2\",\n          \"border-line-default\",\n          \"focus:border-line-focus\",\n        ),\n        outlined: cn(\n          \"border\",\n          \"border-line-default\",\n          \"focus:border-line-focus\",\n        ),\n        filled: cn(\n          \"bg-surface-muted\",\n          \"border-0\",\n          \"focus:bg-surface-base\",\n          \"focus:ring-2\",\n          \"focus:ring-line-focus\",\n        ),\n      },\n      size: {\n        sm: cn(\n          \"h-8\",\n          getTypographySize(\"bodySmall\"),\n          getSpacingClass(\"md\", \"px\"),\n        ),\n        md: cn(\n          \"h-10\",\n          getTypographySize(\"body\"),\n          getSpacingClass(\"base\", \"px\"),\n        ),\n        lg: cn(\n          \"h-12\",\n          getTypographySize(\"bodyLarge\"),\n          getSpacingClass(\"lg\", \"px\"),\n        ),\n      },\n      state: {\n        default: \"\",\n        error: cn(\"border-error\", \"focus:border-error\", \"focus:ring-error\"),\n        success: cn(\n          \"border-success\",\n          \"focus:border-success\",\n          \"focus:ring-success\",\n        ),\n      },\n    },\n    defaultVariants: {\n      variant: \"outlined\",\n      size: \"md\",\n      state: \"default\",\n    },\n  },\n);\n\n/**\n * Helper / error text. De-memoized (issue #224) — the original wrapped\n * its class string and text in `useMemo`, a decorative memo that blocked\n * server-safety. Inlined here; the work is nanoseconds.\n */\nfunction HelperText({\n  error,\n  success,\n  helperText,\n  errorId,\n  helperId,\n}: {\n  error: boolean;\n  success: boolean;\n  helperText?: string;\n  errorId?: string;\n  helperId?: string;\n}) {\n  const helperClasses = cn(\n    getSpacingClass(\"xs\", \"mt\"),\n    getTypographyClasses(\"caption\"),\n    error && \"text-fg-error\",\n    success && \"text-fg-success\",\n    !error && !success && \"text-fg-secondary\",\n  );\n  const text = helperText || (error ? \"Error\" : success ? \"Success\" : \"\");\n\n  return (\n    <div\n      id={errorId || helperId}\n      className={helperClasses}\n      role={error || success ? \"alert\" : undefined}\n    >\n      {text}\n    </div>\n  );\n}\n\nexport interface InputBaseProps extends Omit<\n  InputHTMLAttributes<HTMLInputElement>,\n  \"size\"\n> {\n  label?: ReactNode;\n  error?: boolean;\n  success?: boolean;\n  helperText?: string;\n  size?: InputSize;\n  variant?: InputVariant;\n  leftIcon?: ReactNode;\n  rightIcon?: ReactNode;\n  /**\n   * Raw trailing-affix slot rendered inside the input's right edge with\n   * full interactivity (no `pointer-events-none`). The interactive\n   * `Input` injects its password-toggle / clear buttons here; consumers\n   * can use it for a static suffix (a unit, a badge). When omitted,\n   * `rightIcon` renders instead with the muted decorative treatment.\n   */\n  rightSlot?: ReactNode;\n}\n\n/**\n * InputBase\n *\n * The **presentational core** of the text input — label, the `<input>`\n * itself, decorative left/right icons, the trailing-affix slot, and the\n * helper/error line. It holds **no React client state** (no `useState`,\n * `useId`, `useCallback`), so it is server-safe and ships from the\n * `./server` entry (issue #224).\n *\n * The interactive `Input` (default export of this folder) composes\n * `InputBase`, owning the password-toggle state, the clear button, and\n * the `useId` auto-id fallback — it passes the resolved `id`, the\n * toggled `type`, and its affix buttons (`rightSlot`) down. Use\n * `InputBase` directly for server-rendered / native-form inputs where\n * none of that interactivity is needed (`<form method=\"GET\">` filters,\n * RSC pages).\n *\n * Accessible name: pass `id` when you pass `label` so the `<label\n * htmlFor>` binds — `InputBase` does NOT auto-generate an id (that needs\n * `useId`, which would make it client). A dev-only warning fires when a\n * `label` is given without an `id`.\n *\n * @example\n * ```tsx\n * // Server component / native form — zero client state.\n * <InputBase id=\"q\" name=\"q\" placeholder=\"Buscar…\" />\n * ```\n */\nconst InputBase = forwardRef<HTMLInputElement, InputBaseProps>(\n  function InputBase(\n    {\n      id,\n      label,\n      error = false,\n      success = false,\n      helperText,\n      size = \"md\",\n      variant = \"outlined\",\n      leftIcon,\n      rightIcon,\n      rightSlot,\n      className = \"\",\n      disabled = false,\n      type = \"text\",\n      ...props\n    },\n    ref,\n  ) {\n    if (\n      typeof process !== \"undefined\" &&\n      process.env.NODE_ENV !== \"production\" &&\n      label &&\n      !id\n    ) {\n      console.warn(\n        \"[InputBase] `label` was provided without an `id`. The <label> cannot bind to the input (InputBase does not auto-generate an id — that needs a client hook). Pass an `id`, or use the interactive `Input` which auto-generates one.\",\n      );\n    }\n\n    const state: InputState = error ? \"error\" : success ? \"success\" : \"default\";\n\n    const errorId = error && id ? `${id}-error` : undefined;\n    const helperId = helperText && id ? `${id}-helper` : undefined;\n\n    const iconSize =\n      size === \"sm\" ? \"h-4 w-4\" : size === \"lg\" ? \"h-5 w-5\" : \"h-4 w-4\";\n    const iconPosition =\n      size === \"sm\" ? \"top-2\" : size === \"lg\" ? \"top-3.5\" : \"top-2.5\";\n\n    const inputClasses = cn(\n      inputVariants({ variant, size, state }),\n      // Icon padding — `pl-9` / `pr-9` aren't on the spacing scale (no\n      // semantic key for 36px) so they stay raw at the `sm` size; md/lg use\n      // the getter. Mirrors the original Input contract.\n      leftIcon &&\n        (size === \"sm\"\n          ? \"pl-9\"\n          : size === \"lg\"\n            ? getSpacingClass(\"3xl\", \"pl\")\n            : getSpacingClass(\"2xl\", \"pl\")),\n      (rightIcon || rightSlot) &&\n        (size === \"sm\"\n          ? \"pr-9\"\n          : size === \"lg\"\n            ? getSpacingClass(\"3xl\", \"pr\")\n            : getSpacingClass(\"2xl\", \"pr\")),\n      className,\n    );\n\n    const labelClasses = cn(\n      \"block\",\n      getTypographyClasses(\"label\"),\n      getSpacingClass(\"xs\", \"mb\"),\n      disabled && \"opacity-50\",\n    );\n\n    return (\n      <div className=\"w-full\">\n        {label && (\n          <label htmlFor={id} className={labelClasses}>\n            {label}\n          </label>\n        )}\n        <div className=\"relative\">\n          {leftIcon && (\n            <div\n              className={`absolute left-3 ${iconPosition} text-fg-secondary opacity-60 pointer-events-none`}\n            >\n              <div className={iconSize}>{leftIcon}</div>\n            </div>\n          )}\n          <input\n            id={id}\n            ref={ref}\n            type={type}\n            className={inputClasses}\n            disabled={disabled}\n            aria-invalid={error}\n            aria-required={props.required}\n            aria-describedby={errorId || helperId}\n            suppressHydrationWarning\n            {...props}\n          />\n          {(rightIcon || rightSlot) && (\n            <div\n              className={`absolute right-3 top-0 bottom-0 flex items-center ${getSpacingClass(\"xs\", \"gap\")}`}\n            >\n              {rightSlot ?? (\n                <div\n                  className={`text-fg-secondary opacity-60 pointer-events-none ${iconSize}`}\n                >\n                  {rightIcon}\n                </div>\n              )}\n            </div>\n          )}\n        </div>\n        {(error || success || helperText) && (\n          <HelperText\n            error={error}\n            success={success}\n            helperText={helperText}\n            errorId={errorId}\n            helperId={helperId}\n          />\n        )}\n      </div>\n    );\n  },\n);\n\nInputBase.displayName = \"InputBase\";\n\nexport default InputBase;\n"],"names":["inputVariants","cva","cn","getRadiusClass","getTypographySize","getSpacingClass","HelperText","error","success","helperText","errorId","helperId","helperClasses","getTypographyClasses","jsx","InputBase","forwardRef","_a","ref","_b","id","label","size","variant","leftIcon","rightIcon","rightSlot","className","disabled","type","props","__objRest","state","iconSize","iconPosition","inputClasses","labelClasses","jsxs","__spreadValues"],"mappings":"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"}