@commercelayer/app-elements 1.16.0 → 1.17.0

package/dist/{InputDateComponent-BBkmcbUM.js → InputDateComponent-Ba_0quKu.js}

@@ -2,7 +2,7 @@
 var ur = Object.defineProperty;
 var lr = (a, n, e) => n in a ? ur(a, n, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[n] = e;
 var D = (a, n, e) => (lr(a, typeof n != "symbol" ? n + "" : n, e), e);
-import { a as Ut, c as pr, i as Fe, p as dr, b as hr, f as fr, o as mr, d as q, j as be, I as gr, g as yr, w as wr, X as Dr } from "./main-BcQfQBlU.js";
+import { a as Ut, c as pr, i as Fe, p as dr, b as hr, f as fr, o as mr, d as q, j as be, I as gr, g as yr, w as wr, X as Dr } from "./main-BlYhThqr.js";
 import * as C from "react";
 import f, { createElement as vr, Component as br, useLayoutEffect as On, useEffect as Nn, createRef as kr, forwardRef as Mr } from "react";
 import * as _r from "react-dom";

package/dist/{main-BcQfQBlU.js → main-BlYhThqr.js}

@@ -19985,33 +19985,56 @@ function Hse(e) {
   }
 }
 const Q2 = G(
-  ({ type: e = "text", className: t, label: n, hint: r, feedback: a, inline: s, ...u }, d) => /* @__PURE__ */ A.jsx(
+  ({
+    type: e = "text",
+    className: t,
+    label: n,
+    hint: r,
+    feedback: a,
+    inline: s,
+    suffix: u,
+    ...d
+  }, c) => /* @__PURE__ */ A.jsx(
     bn,
     {
       label: n,
       hint: r,
       feedback: a,
-      name: u.id ?? u.name,
+      name: d.id ?? d.name,
       inline: s,
-      children: /* @__PURE__ */ A.jsx(
-        "input",
-        {
-          ...u,
-          "data-lpignore": u.autoComplete === "off" && "true",
-          "data-1p-ignore": u.autoComplete === "off" && !0,
-          "data-form-type": u.autoComplete === "off" && "other",
-          id: u.id ?? u.name,
-          className: W(
-            t,
-            "block w-full px-4 py-2.5 font-medium",
-            "rounded outline-0",
-            u.autoComplete === "off" && "!bg-white",
-            Qa(a)
-          ),
-          type: e,
-          ref: d
-        }
-      )
+      children: /* @__PURE__ */ A.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ A.jsx(
+          "input",
+          {
+            ...d,
+            "data-lpignore": d.autoComplete === "off" && "true",
+            "data-1p-ignore": d.autoComplete === "off" && !0,
+            "data-form-type": d.autoComplete === "off" && "other",
+            id: d.id ?? d.name,
+            className: W(
+              t,
+              "block w-full px-4 py-2.5 font-medium",
+              "rounded outline-0",
+              {
+                "[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none": u != null,
+                "!bg-white": d.autoComplete === "off"
+              },
+              Qa(a)
+            ),
+            type: e,
+            ref: c
+          }
+        ),
+        u != null && /* @__PURE__ */ A.jsx(
+          K,
+          {
+            size: "small",
+            weight: "semibold",
+            className: "absolute right-4 top-1/2 -translate-y-1/2",
+            children: u
+          }
+        )
+      ] })
     }
   )
 );
@@ -25986,7 +26009,7 @@ function fy({
 }
 fy.displayName = "InputCurrencyRange";
 const p8e = nM(
-  async () => await import("./InputDateComponent-BBkmcbUM.js").then((e) => ({
+  async () => await import("./InputDateComponent-Ba_0quKu.js").then((e) => ({
     default: e.InputDateComponent
   }))
 ), hs = G(

package/dist/main.js

@@ -1,5 +1,5 @@
 "use client";
-import { a4 as s, aK as t, a5 as o, a6 as r, a7 as n, a8 as u, a9 as i, aa as l, ab as p, ac as b, ad as c, aL as d, ae as g, af as S, V as m, aM as I, aN as k, aO as T, aP as D, ag as R, Z as y, _ as h, ah as C, ai as H, aQ as P, b0 as A, b1 as f, b3 as B, b5 as F, b7 as v, bb as L, bd as N, bi as O, bl as G, bn as w, bu as V, bw as x, by as E, bA as M, bC as W, bG as J, bH as U, aj as Y, ak as q, b2 as z, b4 as K, b6 as Q, b8 as Z, ba as _, bc as $, be as j, bf as X, bg as aa, bh as ea, bj as sa, bk as ta, bm as oa, bo as ra, bv as na, bx as ua, bz as ia, bB as la, bD as pa, bE as ba, bF as ca, aR as da, aS as ga, aT as Sa, aU as ma, a0 as Ia, aV as ka, al as Ta, aW as Da, aX as Ra, am as ya, an as ha, ao as Ca, ap as Ha, aY as Pa, bK as Aa, bL as fa, bM as Ba, bN as Fa, bO as va, bP as La, bQ as Na, bR as Oa, aq as Ga, aZ as wa, ar as Va, as as xa, at as Ea, au as Ma, aw as Wa, ax as Ja, ay as Ua, az as Ya, aA as qa, aF as za, aB as Ka, a_ as Qa, aG as Za, aH as _a, aC as $a, aI as ja, aD as Xa, a$ as ae, a1 as ee, aJ as se, aE as te, B as oe, a3 as re, E as ne, F as ue, k as ie, A as le, bp as pe, b9 as be, l as ce, m as de, q as ge, C as Se, D as me, G as Ie, bT as ke, bU as Te, bq as De, s as Re, t as ye, u as he, v as Ce, bV as He, bW as Pe, bX as Ae, bY as fe, bZ as Be, H as Fe, J as ve, b_ as Le, b$ as Ne, c0 as Oe, c1 as Ge, K as we, L as Ve, c2 as xe, c3 as Ee, c4 as Me, O as We, P as Je, e as Ue, M as Ye, N as qe, h as ze, br as Ke, bs as Qe, bt as Ze, n as _e, r as $e, x as je, bI as Xe, y as as, z as es, Q as ss, W as ts, Y as os, R as rs, S as ns, T as us, U as is, bS as ls, $ as ps, a2 as bs, bJ as cs, av as ds } from "./main-BcQfQBlU.js";
+import { a4 as s, aK as t, a5 as o, a6 as r, a7 as n, a8 as u, a9 as i, aa as l, ab as p, ac as b, ad as c, aL as d, ae as g, af as S, V as m, aM as I, aN as k, aO as T, aP as D, ag as R, Z as y, _ as h, ah as C, ai as H, aQ as P, b0 as A, b1 as f, b3 as B, b5 as F, b7 as v, bb as L, bd as N, bi as O, bl as G, bn as w, bu as V, bw as x, by as E, bA as M, bC as W, bG as J, bH as U, aj as Y, ak as q, b2 as z, b4 as K, b6 as Q, b8 as Z, ba as _, bc as $, be as j, bf as X, bg as aa, bh as ea, bj as sa, bk as ta, bm as oa, bo as ra, bv as na, bx as ua, bz as ia, bB as la, bD as pa, bE as ba, bF as ca, aR as da, aS as ga, aT as Sa, aU as ma, a0 as Ia, aV as ka, al as Ta, aW as Da, aX as Ra, am as ya, an as ha, ao as Ca, ap as Ha, aY as Pa, bK as Aa, bL as fa, bM as Ba, bN as Fa, bO as va, bP as La, bQ as Na, bR as Oa, aq as Ga, aZ as wa, ar as Va, as as xa, at as Ea, au as Ma, aw as Wa, ax as Ja, ay as Ua, az as Ya, aA as qa, aF as za, aB as Ka, a_ as Qa, aG as Za, aH as _a, aC as $a, aI as ja, aD as Xa, a$ as ae, a1 as ee, aJ as se, aE as te, B as oe, a3 as re, E as ne, F as ue, k as ie, A as le, bp as pe, b9 as be, l as ce, m as de, q as ge, C as Se, D as me, G as Ie, bT as ke, bU as Te, bq as De, s as Re, t as ye, u as he, v as Ce, bV as He, bW as Pe, bX as Ae, bY as fe, bZ as Be, H as Fe, J as ve, b_ as Le, b$ as Ne, c0 as Oe, c1 as Ge, K as we, L as Ve, c2 as xe, c3 as Ee, c4 as Me, O as We, P as Je, e as Ue, M as Ye, N as qe, h as ze, br as Ke, bs as Qe, bt as Ze, n as _e, r as $e, x as je, bI as Xe, y as as, z as es, Q as ss, W as ts, Y as os, R as rs, S as ns, T as us, U as is, bS as ls, $ as ps, a2 as bs, bJ as cs, av as ds } from "./main-BlYhThqr.js";
 export {
   s as A,
   t as ActionButtons,

package/dist/ui/forms/Input/Input.d.ts

@@ -9,5 +9,9 @@ export interface InputProps extends InputWrapperBaseProps, Omit<React.InputHTMLA
      * Optional CSS class names used for the input element
      */
     className?: string;
+    /**
+     * Optional suffix that renders close to the right-edge of the input
+     */
+    suffix?: React.ReactNode;
 }
 export declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercelayer/app-elements",
-  "version": "1.16.0",
+  "version": "1.17.0",
   "type": "module",
   "license": "MIT",
   "files": [