@protonradio/proton-ui 0.13.0 → 0.13.1

package/dist/components/Icon/IconComponents/YandexLogo.es.js

@@ -1,21 +1,21 @@
-import { j as o } from "../../../node_modules/react/jsx-runtime.es.js";
-import { DEFAULT_ARIA_PROPS as a, DEFAULT_SVG_XMLNS as d, getBrandColor as n, getDefaultIconTestId as r } from "../IconProps.es.js";
+import { jsx as o } from "react/jsx-runtime";
+import { DEFAULT_ARIA_PROPS as d, DEFAULT_SVG_XMLNS as a, getBrandColor as n, getDefaultIconTestId as r } from "../IconProps.es.js";
 function i({
   size: l = 16,
   color: t,
-  "data-testid": e,
-  ariaProps: L = a
+  "data-testid": L,
+  ariaProps: e = d
 }) {
-  return /* @__PURE__ */ o.jsx(
+  return /* @__PURE__ */ o(
     "svg",
     {
-      xmlns: d,
+      xmlns: a,
       width: l,
       height: l,
       viewBox: "0 0 1000 999.9941406",
-      ...L,
-      "data-testid": e || r("yandex-logo"),
-      children: /* @__PURE__ */ o.jsx(
+      ...e,
+      "data-testid": L || r("yandex-logo"),
+      children: /* @__PURE__ */ o(
         "path",
         {
           fill: t || n("yandex-logo"),

package/dist/components/Icon/IconComponents/YandexLogo.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"YandexLogo.es.js","sources":["../../../../src/components/Icon/IconComponents/YandexLogo.tsx"],"sourcesContent":["import {\n  type IconProps,\n  DEFAULT_ARIA_PROPS,\n  DEFAULT_SVG_XMLNS,\n  getBrandColor,\n  getDefaultIconTestId,\n} from \"../IconProps\";\n\n/** Yandex brand logo. {@link IconProps} */\nexport function YandexLogo({\n  size = 16,\n  color,\n  \"data-testid\": dataTestId,\n  ariaProps = DEFAULT_ARIA_PROPS,\n}: IconProps) {\n  return (\n    <svg\n      xmlns={DEFAULT_SVG_XMLNS}\n      width={size}\n      height={size}\n      viewBox=\"0 0 1000 999.9941406\"\n      {...ariaProps}\n      data-testid={dataTestId || getDefaultIconTestId(\"yandex-logo\")}\n    >\n      <path\n        fill={color || getBrandColor(\"yandex-logo\")}\n        d=\"M990.5263062,381.161499l-3.9005737-19.3916931l-164.9055176-28.8068542l95.8240356-129.6425323  l-11.1403198-12.1870575l-140.9465332,67.5902405l17.8244629-179.5018616l-14.4853516-8.3040466L683.001709,216.0630493  L586.6281128,0h-16.7133179l22.8419189,208.8642578L350.4190063,14.9589682l-20.6139221,6.0935392l186.6246033,234.3495026  L147.0751495,132.4085846l-16.7133484,18.8361511l329.8051147,187.8175812L5.0116663,376.7229309L0,404.9859009  l472.9796448,51.5201721L78.5492401,782.8198853l16.7133484,22.7133179l469.6347046-255.3961792l-93.0286865,449.8571167h28.4150391  l179.9404297-423.2665405l109.7478638,331.302124l19.5028687-14.9589233l-45.1283569-336.8401489l171.0282593,193.9052734  l11.1461792-17.730835L815.5976562,491.9620667l182.7298584,67.5902405L1000,539.0553589L836.2114868,418.2782898  l154.3208008-37.1167297L990.5263062,381.161499z\"\n      />\n    </svg>\n  );\n}\n\nYandexLogo.displayName = \"ProtonUIYandexLogo\";\n"],"names":["YandexLogo","size","color","dataTestId","ariaProps","DEFAULT_ARIA_PROPS","jsx","DEFAULT_SVG_XMLNS","getDefaultIconTestId","getBrandColor"],"mappings":";;AASO,SAASA,EAAW;AAAA,EACzB,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,eAAeC;AAAA,EACf,WAAAC,IAAYC;AACd,GAAc;AACZ,SACEC,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAOC;AAAA,MACP,OAAON;AAAA,MACP,QAAQA;AAAA,MACR,SAAQ;AAAA,MACP,GAAGG;AAAA,MACJ,eAAaD,KAAcK,EAAqB,aAAa;AAAA,MAE7D,UAAAF,gBAAAA,EAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAMJ,KAASO,EAAc,aAAa;AAAA,UAC1C,GAAE;AAAA,QAAA;AAAA,MAAA;AAAA,IACJ;AAAA,EAAA;AAGN;AAEAT,EAAW,cAAc;"}
+{"version":3,"file":"YandexLogo.es.js","sources":["../../../../src/components/Icon/IconComponents/YandexLogo.tsx"],"sourcesContent":["import {\n  type IconProps,\n  DEFAULT_ARIA_PROPS,\n  DEFAULT_SVG_XMLNS,\n  getBrandColor,\n  getDefaultIconTestId,\n} from \"../IconProps\";\n\n/** Yandex brand logo. {@link IconProps} */\nexport function YandexLogo({\n  size = 16,\n  color,\n  \"data-testid\": dataTestId,\n  ariaProps = DEFAULT_ARIA_PROPS,\n}: IconProps) {\n  return (\n    <svg\n      xmlns={DEFAULT_SVG_XMLNS}\n      width={size}\n      height={size}\n      viewBox=\"0 0 1000 999.9941406\"\n      {...ariaProps}\n      data-testid={dataTestId || getDefaultIconTestId(\"yandex-logo\")}\n    >\n      <path\n        fill={color || getBrandColor(\"yandex-logo\")}\n        d=\"M990.5263062,381.161499l-3.9005737-19.3916931l-164.9055176-28.8068542l95.8240356-129.6425323  l-11.1403198-12.1870575l-140.9465332,67.5902405l17.8244629-179.5018616l-14.4853516-8.3040466L683.001709,216.0630493  L586.6281128,0h-16.7133179l22.8419189,208.8642578L350.4190063,14.9589682l-20.6139221,6.0935392l186.6246033,234.3495026  L147.0751495,132.4085846l-16.7133484,18.8361511l329.8051147,187.8175812L5.0116663,376.7229309L0,404.9859009  l472.9796448,51.5201721L78.5492401,782.8198853l16.7133484,22.7133179l469.6347046-255.3961792l-93.0286865,449.8571167h28.4150391  l179.9404297-423.2665405l109.7478638,331.302124l19.5028687-14.9589233l-45.1283569-336.8401489l171.0282593,193.9052734  l11.1461792-17.730835L815.5976562,491.9620667l182.7298584,67.5902405L1000,539.0553589L836.2114868,418.2782898  l154.3208008-37.1167297L990.5263062,381.161499z\"\n      />\n    </svg>\n  );\n}\n\nYandexLogo.displayName = \"ProtonUIYandexLogo\";\n"],"names":["YandexLogo","size","color","dataTestId","ariaProps","DEFAULT_ARIA_PROPS","jsx","DEFAULT_SVG_XMLNS","getDefaultIconTestId","getBrandColor"],"mappings":";;AASO,SAASA,EAAW;AAAA,EACzB,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,eAAeC;AAAA,EACf,WAAAC,IAAYC;AACd,GAAc;AACZ,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAOC;AAAA,MACP,OAAON;AAAA,MACP,QAAQA;AAAA,MACR,SAAQ;AAAA,MACP,GAAGG;AAAA,MACJ,eAAaD,KAAcK,EAAqB,aAAa;AAAA,MAE7D,UAAA,gBAAAF;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAMJ,KAASO,EAAc,aAAa;AAAA,UAC1C,GAAE;AAAA,QAAA;AAAA,MAAA;AAAA,IACJ;AAAA,EAAA;AAGN;AAEAT,EAAW,cAAc;"}

package/dist/components/Icon/IconComponents/YoutubeLogo.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../../../node_modules/react/jsx-runtime.cjs.js"),t=require("../IconProps.cjs.js");function s({size:e=16,color:u,"data-testid":i,ariaProps:r=t.DEFAULT_ARIA_PROPS}){return o.jsxRuntimeExports.jsxs("svg",{xmlns:t.DEFAULT_SVG_XMLNS,viewBox:"0 0 256 180",width:e,height:e,...r,"data-testid":i||t.getDefaultIconTestId("youtube-logo"),children:[o.jsxRuntimeExports.jsx("path",{fill:u||t.getBrandColor("youtube-logo"),d:"M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134"}),o.jsxRuntimeExports.jsx("path",{fill:"#fff",d:"m102.421 128.06l66.328-38.418l-66.328-38.418z"})]})}s.displayName="ProtonUIYoutubeLogo";exports.YoutubeLogo=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),t=require("../IconProps.cjs.js");function u({size:e=16,color:l,"data-testid":s,ariaProps:i=t.DEFAULT_ARIA_PROPS}){return o.jsxs("svg",{xmlns:t.DEFAULT_SVG_XMLNS,viewBox:"0 0 256 180",width:e,height:e,...i,"data-testid":s||t.getDefaultIconTestId("youtube-logo"),children:[o.jsx("path",{fill:l||t.getBrandColor("youtube-logo"),d:"M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134"}),o.jsx("path",{fill:"#fff",d:"m102.421 128.06l66.328-38.418l-66.328-38.418z"})]})}u.displayName="ProtonUIYoutubeLogo";exports.YoutubeLogo=u;
 //# sourceMappingURL=YoutubeLogo.cjs.js.map

package/dist/components/Icon/IconComponents/YoutubeLogo.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"YoutubeLogo.cjs.js","sources":["../../../../src/components/Icon/IconComponents/YoutubeLogo.tsx"],"sourcesContent":["import {\n  type IconProps,\n  DEFAULT_ARIA_PROPS,\n  DEFAULT_SVG_XMLNS,\n  getDefaultIconTestId,\n  getBrandColor,\n} from \"../IconProps\";\n\n/** YouTube brand logo. {@link IconProps} */\nexport function YoutubeLogo({\n  size = 16,\n  color,\n  \"data-testid\": dataTestId,\n  ariaProps = DEFAULT_ARIA_PROPS,\n}: IconProps) {\n  return (\n    <svg\n      xmlns={DEFAULT_SVG_XMLNS}\n      viewBox=\"0 0 256 180\"\n      width={size}\n      height={size}\n      {...ariaProps}\n      data-testid={dataTestId || getDefaultIconTestId(\"youtube-logo\")}\n    >\n      <path\n        fill={color || getBrandColor(\"youtube-logo\")}\n        d=\"M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134\"\n      />\n      <path fill=\"#fff\" d=\"m102.421 128.06l66.328-38.418l-66.328-38.418z\" />\n    </svg>\n  );\n}\n\nYoutubeLogo.displayName = \"ProtonUIYoutubeLogo\";\n"],"names":["YoutubeLogo","size","color","dataTestId","ariaProps","DEFAULT_ARIA_PROPS","jsxs","DEFAULT_SVG_XMLNS","getDefaultIconTestId","jsx","getBrandColor"],"mappings":"mLASO,SAASA,EAAY,CAC1B,KAAAC,EAAO,GACP,MAAAC,EACA,cAAeC,EACf,UAAAC,EAAYC,EAAAA,kBACd,EAAc,CACZ,OACEC,EAAAA,kBAAAA,KAAC,MAAA,CACC,MAAOC,EAAAA,kBACP,QAAQ,cACR,MAAON,EACP,OAAQA,EACP,GAAGG,EACJ,cAAaD,GAAcK,EAAAA,qBAAqB,cAAc,EAE9D,SAAA,CAAAC,EAAAA,kBAAAA,IAAC,OAAA,CACC,KAAMP,GAASQ,EAAAA,cAAc,cAAc,EAC3C,EAAE,uUAAA,CAAA,EAEJD,EAAAA,kBAAAA,IAAC,OAAA,CAAK,KAAK,OAAO,EAAE,+CAAA,CAAgD,CAAA,CAAA,CAAA,CAG1E,CAEAT,EAAY,YAAc"}
+{"version":3,"file":"YoutubeLogo.cjs.js","sources":["../../../../src/components/Icon/IconComponents/YoutubeLogo.tsx"],"sourcesContent":["import {\n  type IconProps,\n  DEFAULT_ARIA_PROPS,\n  DEFAULT_SVG_XMLNS,\n  getDefaultIconTestId,\n  getBrandColor,\n} from \"../IconProps\";\n\n/** YouTube brand logo. {@link IconProps} */\nexport function YoutubeLogo({\n  size = 16,\n  color,\n  \"data-testid\": dataTestId,\n  ariaProps = DEFAULT_ARIA_PROPS,\n}: IconProps) {\n  return (\n    <svg\n      xmlns={DEFAULT_SVG_XMLNS}\n      viewBox=\"0 0 256 180\"\n      width={size}\n      height={size}\n      {...ariaProps}\n      data-testid={dataTestId || getDefaultIconTestId(\"youtube-logo\")}\n    >\n      <path\n        fill={color || getBrandColor(\"youtube-logo\")}\n        d=\"M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134\"\n      />\n      <path fill=\"#fff\" d=\"m102.421 128.06l66.328-38.418l-66.328-38.418z\" />\n    </svg>\n  );\n}\n\nYoutubeLogo.displayName = \"ProtonUIYoutubeLogo\";\n"],"names":["YoutubeLogo","size","color","dataTestId","ariaProps","DEFAULT_ARIA_PROPS","jsxs","DEFAULT_SVG_XMLNS","getDefaultIconTestId","jsx","getBrandColor"],"mappings":"sJASO,SAASA,EAAY,CAC1B,KAAAC,EAAO,GACP,MAAAC,EACA,cAAeC,EACf,UAAAC,EAAYC,EAAAA,kBACd,EAAc,CACZ,OACEC,EAAAA,KAAC,MAAA,CACC,MAAOC,EAAAA,kBACP,QAAQ,cACR,MAAON,EACP,OAAQA,EACP,GAAGG,EACJ,cAAaD,GAAcK,EAAAA,qBAAqB,cAAc,EAE9D,SAAA,CAAAC,EAAAA,IAAC,OAAA,CACC,KAAMP,GAASQ,EAAAA,cAAc,cAAc,EAC3C,EAAE,uUAAA,CAAA,EAEJD,EAAAA,IAAC,OAAA,CAAK,KAAK,OAAO,EAAE,+CAAA,CAAgD,CAAA,CAAA,CAAA,CAG1E,CAEAT,EAAY,YAAc"}

package/dist/components/Icon/IconComponents/YoutubeLogo.es.js

@@ -1,35 +1,35 @@
-import { j as t } from "../../../node_modules/react/jsx-runtime.es.js";
-import { DEFAULT_ARIA_PROPS as s, DEFAULT_SVG_XMLNS as i, getBrandColor as r, getDefaultIconTestId as u } from "../IconProps.es.js";
-function d({
+import { jsxs as d, jsx as t } from "react/jsx-runtime";
+import { DEFAULT_ARIA_PROPS as i, DEFAULT_SVG_XMLNS as r, getBrandColor as u, getDefaultIconTestId as f } from "../IconProps.es.js";
+function s({
   size: o = 16,
   color: e,
-  "data-testid": a,
-  ariaProps: l = s
+  "data-testid": l,
+  ariaProps: a = i
 }) {
-  return /* @__PURE__ */ t.jsxs(
+  return /* @__PURE__ */ d(
     "svg",
     {
-      xmlns: i,
+      xmlns: r,
       viewBox: "0 0 256 180",
       width: o,
       height: o,
-      ...l,
-      "data-testid": a || u("youtube-logo"),
+      ...a,
+      "data-testid": l || f("youtube-logo"),
       children: [
-        /* @__PURE__ */ t.jsx(
+        /* @__PURE__ */ t(
           "path",
           {
-            fill: e || r("youtube-logo"),
+            fill: e || u("youtube-logo"),
             d: "M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134"
           }
         ),
-        /* @__PURE__ */ t.jsx("path", { fill: "#fff", d: "m102.421 128.06l66.328-38.418l-66.328-38.418z" })
+        /* @__PURE__ */ t("path", { fill: "#fff", d: "m102.421 128.06l66.328-38.418l-66.328-38.418z" })
       ]
     }
   );
 }
-d.displayName = "ProtonUIYoutubeLogo";
+s.displayName = "ProtonUIYoutubeLogo";
 export {
-  d as YoutubeLogo
+  s as YoutubeLogo
 };
 //# sourceMappingURL=YoutubeLogo.es.js.map

package/dist/components/Icon/IconComponents/YoutubeLogo.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"YoutubeLogo.es.js","sources":["../../../../src/components/Icon/IconComponents/YoutubeLogo.tsx"],"sourcesContent":["import {\n  type IconProps,\n  DEFAULT_ARIA_PROPS,\n  DEFAULT_SVG_XMLNS,\n  getDefaultIconTestId,\n  getBrandColor,\n} from \"../IconProps\";\n\n/** YouTube brand logo. {@link IconProps} */\nexport function YoutubeLogo({\n  size = 16,\n  color,\n  \"data-testid\": dataTestId,\n  ariaProps = DEFAULT_ARIA_PROPS,\n}: IconProps) {\n  return (\n    <svg\n      xmlns={DEFAULT_SVG_XMLNS}\n      viewBox=\"0 0 256 180\"\n      width={size}\n      height={size}\n      {...ariaProps}\n      data-testid={dataTestId || getDefaultIconTestId(\"youtube-logo\")}\n    >\n      <path\n        fill={color || getBrandColor(\"youtube-logo\")}\n        d=\"M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134\"\n      />\n      <path fill=\"#fff\" d=\"m102.421 128.06l66.328-38.418l-66.328-38.418z\" />\n    </svg>\n  );\n}\n\nYoutubeLogo.displayName = \"ProtonUIYoutubeLogo\";\n"],"names":["YoutubeLogo","size","color","dataTestId","ariaProps","DEFAULT_ARIA_PROPS","jsxs","DEFAULT_SVG_XMLNS","getDefaultIconTestId","jsx","getBrandColor"],"mappings":";;AASO,SAASA,EAAY;AAAA,EAC1B,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,eAAeC;AAAA,EACf,WAAAC,IAAYC;AACd,GAAc;AACZ,SACEC,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAOC;AAAA,MACP,SAAQ;AAAA,MACR,OAAON;AAAA,MACP,QAAQA;AAAA,MACP,GAAGG;AAAA,MACJ,eAAaD,KAAcK,EAAqB,cAAc;AAAA,MAE9D,UAAA;AAAA,QAAAC,gBAAAA,EAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAMP,KAASQ,EAAc,cAAc;AAAA,YAC3C,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJD,gBAAAA,EAAAA,IAAC,QAAA,EAAK,MAAK,QAAO,GAAE,gDAAA,CAAgD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG1E;AAEAT,EAAY,cAAc;"}
+{"version":3,"file":"YoutubeLogo.es.js","sources":["../../../../src/components/Icon/IconComponents/YoutubeLogo.tsx"],"sourcesContent":["import {\n  type IconProps,\n  DEFAULT_ARIA_PROPS,\n  DEFAULT_SVG_XMLNS,\n  getDefaultIconTestId,\n  getBrandColor,\n} from \"../IconProps\";\n\n/** YouTube brand logo. {@link IconProps} */\nexport function YoutubeLogo({\n  size = 16,\n  color,\n  \"data-testid\": dataTestId,\n  ariaProps = DEFAULT_ARIA_PROPS,\n}: IconProps) {\n  return (\n    <svg\n      xmlns={DEFAULT_SVG_XMLNS}\n      viewBox=\"0 0 256 180\"\n      width={size}\n      height={size}\n      {...ariaProps}\n      data-testid={dataTestId || getDefaultIconTestId(\"youtube-logo\")}\n    >\n      <path\n        fill={color || getBrandColor(\"youtube-logo\")}\n        d=\"M250.346 28.075A32.18 32.18 0 0 0 227.69 5.418C207.824 0 127.87 0 127.87 0S47.912.164 28.046 5.582A32.18 32.18 0 0 0 5.39 28.24c-6.009 35.298-8.34 89.084.165 122.97a32.18 32.18 0 0 0 22.656 22.657c19.866 5.418 99.822 5.418 99.822 5.418s79.955 0 99.82-5.418a32.18 32.18 0 0 0 22.657-22.657c6.338-35.348 8.291-89.1-.164-123.134\"\n      />\n      <path fill=\"#fff\" d=\"m102.421 128.06l66.328-38.418l-66.328-38.418z\" />\n    </svg>\n  );\n}\n\nYoutubeLogo.displayName = \"ProtonUIYoutubeLogo\";\n"],"names":["YoutubeLogo","size","color","dataTestId","ariaProps","DEFAULT_ARIA_PROPS","jsxs","DEFAULT_SVG_XMLNS","getDefaultIconTestId","jsx","getBrandColor"],"mappings":";;AASO,SAASA,EAAY;AAAA,EAC1B,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,eAAeC;AAAA,EACf,WAAAC,IAAYC;AACd,GAAc;AACZ,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAOC;AAAA,MACP,SAAQ;AAAA,MACR,OAAON;AAAA,MACP,QAAQA;AAAA,MACP,GAAGG;AAAA,MACJ,eAAaD,KAAcK,EAAqB,cAAc;AAAA,MAE9D,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAMP,KAASQ,EAAc,cAAc;AAAA,YAC3C,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,QAEJ,gBAAAD,EAAC,QAAA,EAAK,MAAK,QAAO,GAAE,gDAAA,CAAgD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG1E;AAEAT,EAAY,cAAc;"}

package/dist/components/ImageBackground/ImageBackground.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../../node_modules/react/jsx-runtime.cjs.js");;/* empty css                                      */const c=require("../ThemeProvider.cjs.js"),u=require("../../node_modules/color2k/dist/index.exports.import.es.cjs.js"),A=r=>{const[s,e,n]=r,t=s+e+n;if(t<65){const o=t/100;return`rgba(255, 255, 255, ${Math.max(.14,.36-o)})`}return""},l="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";function g({image:r,imageUrl:s=l,onLoad:e}){const{palette:n}=c.useTheme(),t=u.parseToRgba(n.BASE_COLOR),o=A(t);return a.jsxRuntimeExports.jsxs("div",{id:"image-background","aria-label":"Background overlay",role:"dialog","aria-modal":"true",className:"proton-ScreenOverlay__background",children:[r?a.jsxRuntimeExports.jsx("div",{"aria-hidden":"true",children:r}):a.jsxRuntimeExports.jsx("img",{alt:"",src:s,className:"proton-ScreenOverlay__image",onLoad:i=>e==null?void 0:e(i.currentTarget),"aria-hidden":"true"}),a.jsxRuntimeExports.jsx("div",{className:"proton-ScreenOverlay__blur","aria-hidden":"true",style:{background:o}})]})}exports.ImageBackground=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime");;/* empty css                                      */const c=require("../ThemeProvider.cjs.js"),A=require("../../node_modules/color2k/dist/index.exports.import.es.cjs.js"),l=r=>{const[n,e,o]=r,a=n+e+o;if(a<65){const s=a/100;return`rgba(255, 255, 255, ${Math.max(.14,.36-s)})`}return""},u="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";function g({image:r,imageUrl:n=u,onLoad:e}){const{palette:o}=c.useTheme(),a=A.parseToRgba(o.BASE_COLOR),s=l(a);return t.jsxs("div",{id:"image-background","aria-label":"Background overlay",role:"dialog","aria-modal":"true",className:"proton-ScreenOverlay__background",children:[r?t.jsx("div",{"aria-hidden":"true",children:r}):t.jsx("img",{alt:"",src:n,className:"proton-ScreenOverlay__image",onLoad:i=>e==null?void 0:e(i.currentTarget),"aria-hidden":"true"}),t.jsx("div",{className:"proton-ScreenOverlay__blur","aria-hidden":"true",style:{background:s}})]})}exports.ImageBackground=g;
 //# sourceMappingURL=ImageBackground.cjs.js.map

package/dist/components/ImageBackground/ImageBackground.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageBackground.cjs.js","sources":["../../../src/components/ImageBackground/ImageBackground.tsx"],"sourcesContent":["\"use client\";\n\nimport \"../ScreenOverlay/ScreenOverlay.css\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { parseToRgba } from \"color2k\";\n\ninterface ImageBackgroundProps {\n  /**\n   * Manually display a background image. Useful for server-side rendering.\n   * @important When using this prop, you must style your own image component appropriately.\n   * The component will be placed directly in the background without additional styling.\n   */\n  image?: React.ReactNode;\n  /**\n   * The URL of the image to display in the background.\n   * @important Client-side only. Cannot be used in Server Components.\n   * When using this prop, the image will be automatically styled with the background effect.\n   */\n  imageUrl?: string;\n  /**\n   * Callback function to handle the image load event.\n   * @important Client-side only. Cannot be used in Server Components.\n   */\n  onLoad?: (image: HTMLImageElement) => void;\n}\n\n/**\n * Calculates a background color with appropriate opacity based on the brightness of the base color.\n * For dark colors (sum of RGB values < 65), returns a white overlay with variable opacity.\n * For brighter colors, returns an empty string (no overlay needed).\n */\nconst getBgWhiteOverlayColor = (color: [number, number, number, number]) => {\n  const [r, g, b] = color;\n  const brightness = r + g + b;\n\n  // Only apply white overlay for dark backgrounds\n  if (brightness < 65) {\n    // Calculate opacity inversely proportional to brightness\n    // Brighter colors get less opacity, with a minimum of 0.1\n    const brightnessPercentage = brightness / 100;\n    const opacity = Math.max(0.14, 0.36 - brightnessPercentage);\n\n    return `rgba(255, 255, 255, ${opacity})`;\n  }\n\n  return \"\";\n};\n\nconst transparentGifPlaceholder =\n  \"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\";\n\n/**\n * ImageOverlay component for displaying an image with a blur effect.\n *\n * API:\n *  - {@link ImageBackgroundProps}\n */\nexport function ImageBackground({\n  image,\n  imageUrl = transparentGifPlaceholder,\n  onLoad,\n}: ImageBackgroundProps) {\n  const { palette } = useTheme();\n  const baseColor = parseToRgba(palette.BASE_COLOR);\n  const backgroundColor = getBgWhiteOverlayColor(baseColor);\n\n  return (\n    <div\n      id=\"image-background\"\n      aria-label=\"Background overlay\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      className=\"proton-ScreenOverlay__background\"\n    >\n      {image ? (\n        <div aria-hidden=\"true\">{image}</div>\n      ) : (\n        <img\n          alt=\"\" // Decorative image\n          src={imageUrl}\n          className=\"proton-ScreenOverlay__image\"\n          onLoad={(event) => onLoad?.(event.currentTarget)}\n          aria-hidden=\"true\"\n        />\n      )}\n      <div\n        className=\"proton-ScreenOverlay__blur\"\n        aria-hidden=\"true\"\n        style={{\n          background: backgroundColor,\n        }}\n      />\n    </div>\n  );\n}\n"],"names":["getBgWhiteOverlayColor","color","r","g","b","brightness","brightnessPercentage","transparentGifPlaceholder","ImageBackground","image","imageUrl","onLoad","palette","useTheme","baseColor","parseToRgba","backgroundColor","jsxs","jsx","event"],"mappings":"2TA+BMA,EAA0BC,GAA4C,CAC1E,KAAM,CAACC,EAAGC,EAAGC,CAAC,EAAIH,EACZI,EAAaH,EAAIC,EAAIC,EAG3B,GAAIC,EAAa,GAAI,CAGnB,MAAMC,EAAuBD,EAAa,IAG1C,MAAO,uBAFS,KAAK,IAAI,IAAM,IAAOC,CAAoB,CAErB,GACvC,CAEA,MAAO,EACT,EAEMC,EACJ,iFAQK,SAASC,EAAgB,CAC9B,MAAAC,EACA,SAAAC,EAAWH,EACX,OAAAI,CACF,EAAyB,CACvB,KAAM,CAAE,QAAAC,CAAA,EAAYC,WAAA,EACdC,EAAYC,EAAAA,YAAYH,EAAQ,UAAU,EAC1CI,EAAkBhB,EAAuBc,CAAS,EAExD,OACEG,EAAAA,kBAAAA,KAAC,MAAA,CACC,GAAG,mBACH,aAAW,qBACX,KAAK,SACL,aAAW,OACX,UAAU,mCAET,SAAA,CAAAR,EACCS,EAAAA,kBAAAA,IAAC,MAAA,CAAI,cAAY,OAAQ,WAAM,EAE/BA,EAAAA,kBAAAA,IAAC,MAAA,CACC,IAAI,GACJ,IAAKR,EACL,UAAU,8BACV,OAASS,GAAUR,GAAA,YAAAA,EAASQ,EAAM,eAClC,cAAY,MAAA,CAAA,EAGhBD,EAAAA,kBAAAA,IAAC,MAAA,CACC,UAAU,6BACV,cAAY,OACZ,MAAO,CACL,WAAYF,CAAA,CACd,CAAA,CACF,CAAA,CAAA,CAGN"}
+{"version":3,"file":"ImageBackground.cjs.js","sources":["../../../src/components/ImageBackground/ImageBackground.tsx"],"sourcesContent":["\"use client\";\n\nimport \"../ScreenOverlay/ScreenOverlay.css\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { parseToRgba } from \"color2k\";\n\ninterface ImageBackgroundProps {\n  /**\n   * Manually display a background image. Useful for server-side rendering.\n   * @important When using this prop, you must style your own image component appropriately.\n   * The component will be placed directly in the background without additional styling.\n   */\n  image?: React.ReactNode;\n  /**\n   * The URL of the image to display in the background.\n   * @important Client-side only. Cannot be used in Server Components.\n   * When using this prop, the image will be automatically styled with the background effect.\n   */\n  imageUrl?: string;\n  /**\n   * Callback function to handle the image load event.\n   * @important Client-side only. Cannot be used in Server Components.\n   */\n  onLoad?: (image: HTMLImageElement) => void;\n}\n\n/**\n * Calculates a background color with appropriate opacity based on the brightness of the base color.\n * For dark colors (sum of RGB values < 65), returns a white overlay with variable opacity.\n * For brighter colors, returns an empty string (no overlay needed).\n */\nconst getBgWhiteOverlayColor = (color: [number, number, number, number]) => {\n  const [r, g, b] = color;\n  const brightness = r + g + b;\n\n  // Only apply white overlay for dark backgrounds\n  if (brightness < 65) {\n    // Calculate opacity inversely proportional to brightness\n    // Brighter colors get less opacity, with a minimum of 0.1\n    const brightnessPercentage = brightness / 100;\n    const opacity = Math.max(0.14, 0.36 - brightnessPercentage);\n\n    return `rgba(255, 255, 255, ${opacity})`;\n  }\n\n  return \"\";\n};\n\nconst transparentGifPlaceholder =\n  \"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\";\n\n/**\n * ImageOverlay component for displaying an image with a blur effect.\n *\n * API:\n *  - {@link ImageBackgroundProps}\n */\nexport function ImageBackground({\n  image,\n  imageUrl = transparentGifPlaceholder,\n  onLoad,\n}: ImageBackgroundProps) {\n  const { palette } = useTheme();\n  const baseColor = parseToRgba(palette.BASE_COLOR);\n  const backgroundColor = getBgWhiteOverlayColor(baseColor);\n\n  return (\n    <div\n      id=\"image-background\"\n      aria-label=\"Background overlay\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      className=\"proton-ScreenOverlay__background\"\n    >\n      {image ? (\n        <div aria-hidden=\"true\">{image}</div>\n      ) : (\n        <img\n          alt=\"\" // Decorative image\n          src={imageUrl}\n          className=\"proton-ScreenOverlay__image\"\n          onLoad={(event) => onLoad?.(event.currentTarget)}\n          aria-hidden=\"true\"\n        />\n      )}\n      <div\n        className=\"proton-ScreenOverlay__blur\"\n        aria-hidden=\"true\"\n        style={{\n          background: backgroundColor,\n        }}\n      />\n    </div>\n  );\n}\n"],"names":["getBgWhiteOverlayColor","color","r","g","b","brightness","brightnessPercentage","transparentGifPlaceholder","ImageBackground","image","imageUrl","onLoad","palette","useTheme","baseColor","parseToRgba","backgroundColor","jsxs","jsx","event"],"mappings":"iSA+BMA,EAA0BC,GAA4C,CAC1E,KAAM,CAACC,EAAGC,EAAGC,CAAC,EAAIH,EACZI,EAAaH,EAAIC,EAAIC,EAG3B,GAAIC,EAAa,GAAI,CAGnB,MAAMC,EAAuBD,EAAa,IAG1C,MAAO,uBAFS,KAAK,IAAI,IAAM,IAAOC,CAAoB,CAErB,GACvC,CAEA,MAAO,EACT,EAEMC,EACJ,iFAQK,SAASC,EAAgB,CAC9B,MAAAC,EACA,SAAAC,EAAWH,EACX,OAAAI,CACF,EAAyB,CACvB,KAAM,CAAE,QAAAC,CAAA,EAAYC,WAAA,EACdC,EAAYC,EAAAA,YAAYH,EAAQ,UAAU,EAC1CI,EAAkBhB,EAAuBc,CAAS,EAExD,OACEG,EAAAA,KAAC,MAAA,CACC,GAAG,mBACH,aAAW,qBACX,KAAK,SACL,aAAW,OACX,UAAU,mCAET,SAAA,CAAAR,EACCS,EAAAA,IAAC,MAAA,CAAI,cAAY,OAAQ,WAAM,EAE/BA,EAAAA,IAAC,MAAA,CACC,IAAI,GACJ,IAAKR,EACL,UAAU,8BACV,OAASS,GAAUR,GAAA,YAAAA,EAASQ,EAAM,eAClC,cAAY,MAAA,CAAA,EAGhBD,EAAAA,IAAC,MAAA,CACC,UAAU,6BACV,cAAY,OACZ,MAAO,CACL,WAAYF,CAAA,CACd,CAAA,CACF,CAAA,CAAA,CAGN"}

package/dist/components/ImageBackground/ImageBackground.es.js

@@ -1,22 +1,22 @@
-import { j as t } from "../../node_modules/react/jsx-runtime.es.js";
+import { jsxs as A, jsx as i } from "react/jsx-runtime";
 /* empty css                                    */
-import { useTheme as c } from "../ThemeProvider.es.js";
-import { parseToRgba as A } from "../../node_modules/color2k/dist/index.exports.import.es.es.js";
-const l = (e) => {
-  const [o, r, n] = e, a = o + r + n;
+import { useTheme as s } from "../ThemeProvider.es.js";
+import { parseToRgba as l } from "../../node_modules/color2k/dist/index.exports.import.es.es.js";
+const g = (e) => {
+  const [t, r, o] = e, a = t + r + o;
   if (a < 65) {
-    const s = a / 100;
-    return `rgba(255, 255, 255, ${Math.max(0.14, 0.36 - s)})`;
+    const n = a / 100;
+    return `rgba(255, 255, 255, ${Math.max(0.14, 0.36 - n)})`;
   }
   return "";
-}, g = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
-function b({
+}, d = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";
+function h({
   image: e,
-  imageUrl: o = g,
+  imageUrl: t = d,
   onLoad: r
 }) {
-  const { palette: n } = c(), a = A(n.BASE_COLOR), s = l(a);
-  return /* @__PURE__ */ t.jsxs(
+  const { palette: o } = s(), a = l(o.BASE_COLOR), n = g(a);
+  return /* @__PURE__ */ A(
     "div",
     {
       id: "image-background",
@@ -25,23 +25,23 @@ function b({
       "aria-modal": "true",
       className: "proton-ScreenOverlay__background",
       children: [
-        e ? /* @__PURE__ */ t.jsx("div", { "aria-hidden": "true", children: e }) : /* @__PURE__ */ t.jsx(
+        e ? /* @__PURE__ */ i("div", { "aria-hidden": "true", children: e }) : /* @__PURE__ */ i(
           "img",
           {
             alt: "",
-            src: o,
+            src: t,
             className: "proton-ScreenOverlay__image",
-            onLoad: (i) => r == null ? void 0 : r(i.currentTarget),
+            onLoad: (c) => r == null ? void 0 : r(c.currentTarget),
             "aria-hidden": "true"
           }
         ),
-        /* @__PURE__ */ t.jsx(
+        /* @__PURE__ */ i(
           "div",
           {
             className: "proton-ScreenOverlay__blur",
             "aria-hidden": "true",
             style: {
-              background: s
+              background: n
             }
           }
         )
@@ -50,6 +50,6 @@ function b({
   );
 }
 export {
-  b as ImageBackground
+  h as ImageBackground
 };
 //# sourceMappingURL=ImageBackground.es.js.map

package/dist/components/ImageBackground/ImageBackground.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageBackground.es.js","sources":["../../../src/components/ImageBackground/ImageBackground.tsx"],"sourcesContent":["\"use client\";\n\nimport \"../ScreenOverlay/ScreenOverlay.css\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { parseToRgba } from \"color2k\";\n\ninterface ImageBackgroundProps {\n  /**\n   * Manually display a background image. Useful for server-side rendering.\n   * @important When using this prop, you must style your own image component appropriately.\n   * The component will be placed directly in the background without additional styling.\n   */\n  image?: React.ReactNode;\n  /**\n   * The URL of the image to display in the background.\n   * @important Client-side only. Cannot be used in Server Components.\n   * When using this prop, the image will be automatically styled with the background effect.\n   */\n  imageUrl?: string;\n  /**\n   * Callback function to handle the image load event.\n   * @important Client-side only. Cannot be used in Server Components.\n   */\n  onLoad?: (image: HTMLImageElement) => void;\n}\n\n/**\n * Calculates a background color with appropriate opacity based on the brightness of the base color.\n * For dark colors (sum of RGB values < 65), returns a white overlay with variable opacity.\n * For brighter colors, returns an empty string (no overlay needed).\n */\nconst getBgWhiteOverlayColor = (color: [number, number, number, number]) => {\n  const [r, g, b] = color;\n  const brightness = r + g + b;\n\n  // Only apply white overlay for dark backgrounds\n  if (brightness < 65) {\n    // Calculate opacity inversely proportional to brightness\n    // Brighter colors get less opacity, with a minimum of 0.1\n    const brightnessPercentage = brightness / 100;\n    const opacity = Math.max(0.14, 0.36 - brightnessPercentage);\n\n    return `rgba(255, 255, 255, ${opacity})`;\n  }\n\n  return \"\";\n};\n\nconst transparentGifPlaceholder =\n  \"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\";\n\n/**\n * ImageOverlay component for displaying an image with a blur effect.\n *\n * API:\n *  - {@link ImageBackgroundProps}\n */\nexport function ImageBackground({\n  image,\n  imageUrl = transparentGifPlaceholder,\n  onLoad,\n}: ImageBackgroundProps) {\n  const { palette } = useTheme();\n  const baseColor = parseToRgba(palette.BASE_COLOR);\n  const backgroundColor = getBgWhiteOverlayColor(baseColor);\n\n  return (\n    <div\n      id=\"image-background\"\n      aria-label=\"Background overlay\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      className=\"proton-ScreenOverlay__background\"\n    >\n      {image ? (\n        <div aria-hidden=\"true\">{image}</div>\n      ) : (\n        <img\n          alt=\"\" // Decorative image\n          src={imageUrl}\n          className=\"proton-ScreenOverlay__image\"\n          onLoad={(event) => onLoad?.(event.currentTarget)}\n          aria-hidden=\"true\"\n        />\n      )}\n      <div\n        className=\"proton-ScreenOverlay__blur\"\n        aria-hidden=\"true\"\n        style={{\n          background: backgroundColor,\n        }}\n      />\n    </div>\n  );\n}\n"],"names":["getBgWhiteOverlayColor","color","r","g","b","brightness","brightnessPercentage","transparentGifPlaceholder","ImageBackground","image","imageUrl","onLoad","palette","useTheme","baseColor","parseToRgba","backgroundColor","jsxs","jsx","event"],"mappings":";;;;AA+BA,MAAMA,IAAyB,CAACC,MAA4C;AAC1E,QAAM,CAACC,GAAGC,GAAGC,CAAC,IAAIH,GACZI,IAAaH,IAAIC,IAAIC;AAG3B,MAAIC,IAAa,IAAI;AAGnB,UAAMC,IAAuBD,IAAa;AAG1C,WAAO,uBAFS,KAAK,IAAI,MAAM,OAAOC,CAAoB,CAErB;AAAA,EACvC;AAEA,SAAO;AACT,GAEMC,IACJ;AAQK,SAASC,EAAgB;AAAA,EAC9B,OAAAC;AAAA,EACA,UAAAC,IAAWH;AAAA,EACX,QAAAI;AACF,GAAyB;AACvB,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GACdC,IAAYC,EAAYH,EAAQ,UAAU,GAC1CI,IAAkBhB,EAAuBc,CAAS;AAExD,SACEG,gBAAAA,EAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAG;AAAA,MACH,cAAW;AAAA,MACX,MAAK;AAAA,MACL,cAAW;AAAA,MACX,WAAU;AAAA,MAET,UAAA;AAAA,QAAAR,IACCS,gBAAAA,EAAAA,IAAC,OAAA,EAAI,eAAY,QAAQ,aAAM,IAE/BA,gBAAAA,EAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAI;AAAA,YACJ,KAAKR;AAAA,YACL,WAAU;AAAA,YACV,QAAQ,CAACS,MAAUR,KAAA,gBAAAA,EAASQ,EAAM;AAAA,YAClC,eAAY;AAAA,UAAA;AAAA,QAAA;AAAA,QAGhBD,gBAAAA,EAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YACZ,OAAO;AAAA,cACL,YAAYF;AAAA,YAAA;AAAA,UACd;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"ImageBackground.es.js","sources":["../../../src/components/ImageBackground/ImageBackground.tsx"],"sourcesContent":["\"use client\";\n\nimport \"../ScreenOverlay/ScreenOverlay.css\";\nimport { useTheme } from \"../ThemeProvider\";\nimport { parseToRgba } from \"color2k\";\n\ninterface ImageBackgroundProps {\n  /**\n   * Manually display a background image. Useful for server-side rendering.\n   * @important When using this prop, you must style your own image component appropriately.\n   * The component will be placed directly in the background without additional styling.\n   */\n  image?: React.ReactNode;\n  /**\n   * The URL of the image to display in the background.\n   * @important Client-side only. Cannot be used in Server Components.\n   * When using this prop, the image will be automatically styled with the background effect.\n   */\n  imageUrl?: string;\n  /**\n   * Callback function to handle the image load event.\n   * @important Client-side only. Cannot be used in Server Components.\n   */\n  onLoad?: (image: HTMLImageElement) => void;\n}\n\n/**\n * Calculates a background color with appropriate opacity based on the brightness of the base color.\n * For dark colors (sum of RGB values < 65), returns a white overlay with variable opacity.\n * For brighter colors, returns an empty string (no overlay needed).\n */\nconst getBgWhiteOverlayColor = (color: [number, number, number, number]) => {\n  const [r, g, b] = color;\n  const brightness = r + g + b;\n\n  // Only apply white overlay for dark backgrounds\n  if (brightness < 65) {\n    // Calculate opacity inversely proportional to brightness\n    // Brighter colors get less opacity, with a minimum of 0.1\n    const brightnessPercentage = brightness / 100;\n    const opacity = Math.max(0.14, 0.36 - brightnessPercentage);\n\n    return `rgba(255, 255, 255, ${opacity})`;\n  }\n\n  return \"\";\n};\n\nconst transparentGifPlaceholder =\n  \"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\";\n\n/**\n * ImageOverlay component for displaying an image with a blur effect.\n *\n * API:\n *  - {@link ImageBackgroundProps}\n */\nexport function ImageBackground({\n  image,\n  imageUrl = transparentGifPlaceholder,\n  onLoad,\n}: ImageBackgroundProps) {\n  const { palette } = useTheme();\n  const baseColor = parseToRgba(palette.BASE_COLOR);\n  const backgroundColor = getBgWhiteOverlayColor(baseColor);\n\n  return (\n    <div\n      id=\"image-background\"\n      aria-label=\"Background overlay\"\n      role=\"dialog\"\n      aria-modal=\"true\"\n      className=\"proton-ScreenOverlay__background\"\n    >\n      {image ? (\n        <div aria-hidden=\"true\">{image}</div>\n      ) : (\n        <img\n          alt=\"\" // Decorative image\n          src={imageUrl}\n          className=\"proton-ScreenOverlay__image\"\n          onLoad={(event) => onLoad?.(event.currentTarget)}\n          aria-hidden=\"true\"\n        />\n      )}\n      <div\n        className=\"proton-ScreenOverlay__blur\"\n        aria-hidden=\"true\"\n        style={{\n          background: backgroundColor,\n        }}\n      />\n    </div>\n  );\n}\n"],"names":["getBgWhiteOverlayColor","color","r","g","b","brightness","brightnessPercentage","transparentGifPlaceholder","ImageBackground","image","imageUrl","onLoad","palette","useTheme","baseColor","parseToRgba","backgroundColor","jsxs","jsx","event"],"mappings":";;;;AA+BA,MAAMA,IAAyB,CAACC,MAA4C;AAC1E,QAAM,CAACC,GAAGC,GAAGC,CAAC,IAAIH,GACZI,IAAaH,IAAIC,IAAIC;AAG3B,MAAIC,IAAa,IAAI;AAGnB,UAAMC,IAAuBD,IAAa;AAG1C,WAAO,uBAFS,KAAK,IAAI,MAAM,OAAOC,CAAoB,CAErB;AAAA,EACvC;AAEA,SAAO;AACT,GAEMC,IACJ;AAQK,SAASC,EAAgB;AAAA,EAC9B,OAAAC;AAAA,EACA,UAAAC,IAAWH;AAAA,EACX,QAAAI;AACF,GAAyB;AACvB,QAAM,EAAE,SAAAC,EAAA,IAAYC,EAAA,GACdC,IAAYC,EAAYH,EAAQ,UAAU,GAC1CI,IAAkBhB,EAAuBc,CAAS;AAExD,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAG;AAAA,MACH,cAAW;AAAA,MACX,MAAK;AAAA,MACL,cAAW;AAAA,MACX,WAAU;AAAA,MAET,UAAA;AAAA,QAAAR,IACC,gBAAAS,EAAC,OAAA,EAAI,eAAY,QAAQ,aAAM,IAE/B,gBAAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAI;AAAA,YACJ,KAAKR;AAAA,YACL,WAAU;AAAA,YACV,QAAQ,CAACS,MAAUR,KAAA,gBAAAA,EAASQ,EAAM;AAAA,YAClC,eAAY;AAAA,UAAA;AAAA,QAAA;AAAA,QAGhB,gBAAAD;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,eAAY;AAAA,YACZ,OAAO;AAAA,cACL,YAAYF;AAAA,YAAA;AAAA,UACd;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/Input/BaseInput/Input.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../../../node_modules/react/jsx-runtime.cjs.js"),i=require("react"),D=require("../../../hooks/useMergedRef.cjs.js"),K=require("../../ThemeProvider.cjs.js");;/* empty css               */const U=require("../../../utils/copy.cjs.js"),o=require("../../../utils/string.cjs.js"),g=i.forwardRef(({prefix:d,suffix:l,description:u,descriptionPosition:j="top",isDisabled:R,error:s,onChange:h,label:f,name:W,placeholder:z,type:F="text",value:y,autoFocus:k,autoComplete:A,isRequired:m=!1,isReadOnly:b=!1,onSubmit:E,onClear:N,"data-testid":M},O)=>{const q=i.useRef(null),a=i.useRef(null),c=i.useRef(null),r=i.useRef(null),{className:S}=K.useTheme(),B=D.useMergedRef(q,O),_=i.useId();i.useEffect(()=>{if(!r.current)return;const e={containerWidth:200,prefixWidth:32,suffixWidth:32};let p=null;const $=()=>{p!==null&&cancelAnimationFrame(p),p=requestAnimationFrame(()=>{var P,T;if(r.current){if(r.current){const t=r.current.offsetWidth||e.containerWidth;t!==e.containerWidth&&(r.current.style.setProperty("--container-width",`${t}px`),e.containerWidth=t)}if(a.current){const t=a.current.offsetWidth||e.prefixWidth;t!==e.prefixWidth&&((P=r.current)==null||P.style.setProperty("--prefix-width",`${t}px`),e.prefixWidth=t)}if(c.current){const t=c.current.offsetWidth||e.suffixWidth;t!==e.suffixWidth&&((T=r.current)==null||T.style.setProperty("--suffix-width",`${t}px`),e.suffixWidth=t)}}})};$();const x=new ResizeObserver($);return r.current&&x.observe(r.current),a.current&&x.observe(a.current),c.current&&x.observe(c.current),()=>{p!==null&&cancelAnimationFrame(p),x.disconnect()}},[d,l]);const w=`${_}-input`,I=`${_}-error`,v=`${_}-description`;return n.jsxRuntimeExports.jsxs("div",{ref:r,className:"proton-Input__container",children:[u&&j==="top"&&n.jsxRuntimeExports.jsx("div",{id:v,className:"proton-Input__text","aria-live":"polite",children:u}),n.jsxRuntimeExports.jsxs("div",{className:o.csx("proton-Input__container-inner",d&&"proton-Input__has-prefix",l&&"proton-Input__has-suffix"),children:[d&&n.jsxRuntimeExports.jsx("div",{ref:a,className:o.csx("proton-Input__descriptor","proton-Input__prefix"),children:d}),n.jsxRuntimeExports.jsx("input",{id:w,name:W,type:F,value:y,onChange:e=>{h==null||h(e.target.value)},onKeyDown:e=>{switch(e.key){case"Enter":E&&(e.preventDefault(),E(e));break;case"Escape":N&&(e.preventDefault(),N());break}},onCopy:async()=>{var e;return await U.copyTextToClipboard(((e=q.current)==null?void 0:e.value)||"")},disabled:R,readOnly:b,required:m,autoFocus:k,autoComplete:A?"on":"off",placeholder:f?void 0:z,"aria-label":f||W,"aria-invalid":!!s,"aria-errormessage":s?I:void 0,"aria-required":m,"aria-readonly":b,"aria-describedby":s?I:u?v:void 0,"aria-disabled":R,"data-testid":M,ref:B,className:o.csx("proton-Input",s&&"proton-Input--error",f&&"proton-Input__label-top",S)}),n.jsxRuntimeExports.jsxs("label",{htmlFor:w,className:o.csx("proton-Input__label",y&&"proton-Input__label--filled"),children:[f,m&&n.jsxRuntimeExports.jsx("span",{"aria-hidden":"true",children:" *"})]}),l&&n.jsxRuntimeExports.jsx("div",{ref:c,className:o.csx("proton-Input__descriptor","proton-Input__suffix"),children:l})]}),s?n.jsxRuntimeExports.jsx("div",{role:"alert",className:o.csx("proton-Input__error","proton-Input__text"),id:I,children:s}):u&&j==="bottom"?n.jsxRuntimeExports.jsx("div",{id:v,className:"proton-Input__text","aria-live":"polite",children:u}):null]})});g.displayName="ProtonUIInput";exports.Input=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),i=require("react"),D=require("../../../hooks/useMergedRef.cjs.js"),K=require("../../ThemeProvider.cjs.js");;/* empty css               */const U=require("../../../utils/copy.cjs.js"),o=require("../../../utils/string.cjs.js"),z=i.forwardRef(({prefix:p,suffix:l,description:a,descriptionPosition:W="top",isDisabled:y,error:s,onChange:h,label:f,name:b,placeholder:F,type:k="text",value:j,autoFocus:A,autoComplete:E,isRequired:_=!1,isReadOnly:R=!1,onSubmit:N,onClear:q,"data-testid":M},O)=>{const w=i.useRef(null),c=i.useRef(null),u=i.useRef(null),r=i.useRef(null),{className:S}=K.useTheme(),B=D.useMergedRef(w,O),I=i.useId();i.useEffect(()=>{if(!r.current)return;const e={containerWidth:200,prefixWidth:32,suffixWidth:32};let d=null;const P=()=>{d!==null&&cancelAnimationFrame(d),d=requestAnimationFrame(()=>{var T,g;if(r.current){if(r.current){const t=r.current.offsetWidth||e.containerWidth;t!==e.containerWidth&&(r.current.style.setProperty("--container-width",`${t}px`),e.containerWidth=t)}if(c.current){const t=c.current.offsetWidth||e.prefixWidth;t!==e.prefixWidth&&((T=r.current)==null||T.style.setProperty("--prefix-width",`${t}px`),e.prefixWidth=t)}if(u.current){const t=u.current.offsetWidth||e.suffixWidth;t!==e.suffixWidth&&((g=r.current)==null||g.style.setProperty("--suffix-width",`${t}px`),e.suffixWidth=t)}}})};P();const x=new ResizeObserver(P);return r.current&&x.observe(r.current),c.current&&x.observe(c.current),u.current&&x.observe(u.current),()=>{d!==null&&cancelAnimationFrame(d),x.disconnect()}},[p,l]);const $=`${I}-input`,v=`${I}-error`,m=`${I}-description`;return n.jsxs("div",{ref:r,className:"proton-Input__container",children:[a&&W==="top"&&n.jsx("div",{id:m,className:"proton-Input__text","aria-live":"polite",children:a}),n.jsxs("div",{className:o.csx("proton-Input__container-inner",p&&"proton-Input__has-prefix",l&&"proton-Input__has-suffix"),children:[p&&n.jsx("div",{ref:c,className:o.csx("proton-Input__descriptor","proton-Input__prefix"),children:p}),n.jsx("input",{id:$,name:b,type:k,value:j,onChange:e=>{h==null||h(e.target.value)},onKeyDown:e=>{switch(e.key){case"Enter":N&&(e.preventDefault(),N(e));break;case"Escape":q&&(e.preventDefault(),q());break}},onCopy:async()=>{var e;return await U.copyTextToClipboard(((e=w.current)==null?void 0:e.value)||"")},disabled:y,readOnly:R,required:_,autoFocus:A,autoComplete:E?"on":"off",placeholder:f?void 0:F,"aria-label":f||b,"aria-invalid":!!s,"aria-errormessage":s?v:void 0,"aria-required":_,"aria-readonly":R,"aria-describedby":s?v:a?m:void 0,"aria-disabled":y,"data-testid":M,ref:B,className:o.csx("proton-Input",s&&"proton-Input--error",f&&"proton-Input__label-top",S)}),n.jsxs("label",{htmlFor:$,className:o.csx("proton-Input__label",j&&"proton-Input__label--filled"),children:[f,_&&n.jsx("span",{"aria-hidden":"true",children:" *"})]}),l&&n.jsx("div",{ref:u,className:o.csx("proton-Input__descriptor","proton-Input__suffix"),children:l})]}),s?n.jsx("div",{role:"alert",className:o.csx("proton-Input__error","proton-Input__text"),id:v,children:s}):a&&W==="bottom"?n.jsx("div",{id:m,className:"proton-Input__text","aria-live":"polite",children:a}):null]})});z.displayName="ProtonUIInput";exports.Input=z;
 //# sourceMappingURL=Input.cjs.js.map

package/dist/components/Input/BaseInput/Input.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.cjs.js","sources":["../../../../src/components/Input/BaseInput/Input.tsx"],"sourcesContent":["\"use client\";\n\nimport React, {\n  ChangeEvent,\n  forwardRef,\n  useEffect,\n  useId,\n  useRef,\n  type ForwardedRef,\n} from \"react\";\n\nimport { useMergedRef } from \"../../../hooks/useMergedRef\";\nimport { useTheme } from \"../../ThemeProvider\";\nimport { csx } from \"../../../utils\";\nimport \"./Input.css\";\nimport { copyTextToClipboard } from \"../../../utils/copy\";\n\nexport interface BaseInputProps {\n  /**\n   * onChange handler for the input\n   */\n  onChange?: (value: string) => void;\n\n  /** Whether the input is disabled. */\n  isDisabled?: boolean;\n\n  /** Description text shown above the input. */\n  description?: React.ReactNode | string;\n\n  /**\n   * The position of the description text.\n   * @default \"top\"\n   */\n  descriptionPosition?: \"top\" | \"bottom\";\n\n  /** Error state that changes the input's visual style and displays an error message. */\n  error?: React.ReactNode | string;\n\n  /**\n   * Label for the input element.\n   * @note When a label is provided, the input will have extra padding, and the label will float above the text input when focused or filled.\n   */\n  label?: string;\n\n  /** Test ID for the component. */\n  \"data-testid\"?: string;\n\n  /** Content to display before the input. Typically used for icons. */\n  prefix?: React.ReactNode;\n\n  /** Content to display after the input. Typically used for icons. */\n  suffix?: React.ReactNode;\n\n  /**\n   * Should the browser's autocomplete be enabled?\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete\n   */\n  autoComplete?: boolean;\n\n  /**\n   * Should the input be autofocused?\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autofocus\n   */\n  autoFocus?: boolean;\n\n  /**\n   * The name attribute of the input element.\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/name\n   */\n  name: string;\n\n  /**\n   * The placeholder text to display when the input is empty.\n   * @note label takes precedence over placeholder, if both are provided.\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/placeholder\n   */\n  placeholder?: string;\n\n  /**\n   * The type attribute of the input element.\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/type\n   * @default \"text\"\n   */\n  type?: string;\n\n  /**\n   * The value of the input.\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value\n   */\n  value?: string;\n\n  /**\n   * Whether the input is required.\n   * @default false\n   */\n  isRequired?: boolean;\n\n  /**\n   * Whether the input is read-only.\n   * @default false\n   */\n  isReadOnly?: boolean;\n\n  /**\n   * Called when the input is submitted (e.g. by pressing Enter).\n   */\n  onSubmit?: React.FormEventHandler<HTMLInputElement>;\n\n  /**\n   * Called when the input is cleared (e.g. by pressing Escape).\n   */\n  onClear?: () => void;\n}\n\n/**\n * A controlled and customizable input component with support for labels, prefixes, suffixes, and error states.\n *\n * API:\n *  - {@link BaseInputProps}\n */\nexport const Input = forwardRef<HTMLInputElement, BaseInputProps>(\n  (\n    {\n      prefix,\n      suffix,\n      description,\n      descriptionPosition = \"top\",\n      isDisabled,\n      error,\n      onChange,\n      label,\n      name,\n      placeholder,\n      type = \"text\",\n      value,\n      autoFocus,\n      autoComplete,\n      isRequired = false,\n      isReadOnly = false,\n      onSubmit,\n      onClear,\n      \"data-testid\": testId,\n    },\n    forwardedRef: ForwardedRef<HTMLInputElement>,\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n    const prefixRef = useRef<HTMLDivElement>(null);\n    const suffixRef = useRef<HTMLDivElement>(null);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const { className } = useTheme();\n    const setInputRef = useMergedRef(inputRef, forwardedRef);\n    const idBase = useId();\n\n    // Control dynamic prefix and suffix widths using ResizeObserver\n    useEffect(() => {\n      if (!containerRef.current) return;\n\n      const prevSizes = {\n        containerWidth: 200,\n        prefixWidth: 32,\n        suffixWidth: 32,\n      };\n\n      let rafId: number | null = null;\n\n      const updateSizes = () => {\n        if (rafId !== null) cancelAnimationFrame(rafId);\n\n        rafId = requestAnimationFrame(() => {\n          if (!containerRef.current) return;\n\n          if (containerRef.current) {\n            const containerWidth =\n              containerRef.current.offsetWidth || prevSizes.containerWidth;\n\n            if (containerWidth !== prevSizes.containerWidth) {\n              containerRef.current.style.setProperty(\n                \"--container-width\",\n                `${containerWidth}px`,\n              );\n              prevSizes.containerWidth = containerWidth;\n            }\n          }\n\n          if (prefixRef.current) {\n            const prefixWidth =\n              prefixRef.current.offsetWidth || prevSizes.prefixWidth;\n\n            if (prefixWidth !== prevSizes.prefixWidth) {\n              containerRef.current?.style.setProperty(\n                \"--prefix-width\",\n                `${prefixWidth}px`,\n              );\n              prevSizes.prefixWidth = prefixWidth;\n            }\n          }\n\n          if (suffixRef.current) {\n            const suffixWidth =\n              suffixRef.current.offsetWidth || prevSizes.suffixWidth;\n\n            if (suffixWidth !== prevSizes.suffixWidth) {\n              containerRef.current?.style.setProperty(\n                \"--suffix-width\",\n                `${suffixWidth}px`,\n              );\n              prevSizes.suffixWidth = suffixWidth;\n            }\n          }\n        });\n      };\n\n      updateSizes();\n\n      const resizeObserver = new ResizeObserver(updateSizes);\n\n      if (containerRef.current) {\n        resizeObserver.observe(containerRef.current);\n      }\n      if (prefixRef.current) {\n        resizeObserver.observe(prefixRef.current);\n      }\n      if (suffixRef.current) {\n        resizeObserver.observe(suffixRef.current);\n      }\n\n      return () => {\n        if (rafId !== null) {\n          cancelAnimationFrame(rafId);\n        }\n        resizeObserver.disconnect();\n      };\n    }, [prefix, suffix]);\n\n    const inputId = `${idBase}-input`;\n    const errorId = `${idBase}-error`;\n    const descriptionId = `${idBase}-description`;\n\n    return (\n      <div ref={containerRef} className=\"proton-Input__container\">\n        {description && descriptionPosition === \"top\" && (\n          <div\n            id={descriptionId}\n            className=\"proton-Input__text\"\n            aria-live=\"polite\"\n          >\n            {description}\n          </div>\n        )}\n        <div\n          className={csx(\n            \"proton-Input__container-inner\",\n            prefix && \"proton-Input__has-prefix\",\n            suffix && \"proton-Input__has-suffix\",\n          )}\n        >\n          {prefix && (\n            <div\n              ref={prefixRef}\n              className={csx(\n                \"proton-Input__descriptor\",\n                \"proton-Input__prefix\",\n              )}\n            >\n              {prefix}\n            </div>\n          )}\n\n          <input\n            id={inputId}\n            name={name}\n            type={type}\n            value={value}\n            onChange={(e: ChangeEvent<HTMLInputElement>) => {\n              onChange?.(e.target.value);\n            }}\n            onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {\n              switch (e.key) {\n                case \"Enter\":\n                  if (onSubmit) {\n                    e.preventDefault();\n                    onSubmit(e);\n                  }\n                  break;\n                case \"Escape\":\n                  if (onClear) {\n                    e.preventDefault();\n                    onClear();\n                  }\n                  break;\n              }\n            }}\n            onCopy={async () =>\n              await copyTextToClipboard(inputRef.current?.value || \"\")\n            }\n            disabled={isDisabled}\n            readOnly={isReadOnly}\n            required={isRequired}\n            autoFocus={autoFocus}\n            autoComplete={autoComplete ? \"on\" : \"off\"}\n            placeholder={label ? undefined : placeholder}\n            aria-label={label || name}\n            aria-invalid={Boolean(error)}\n            aria-errormessage={error ? errorId : undefined}\n            aria-required={isRequired}\n            aria-readonly={isReadOnly}\n            aria-describedby={\n              error ? errorId : description ? descriptionId : undefined\n            }\n            aria-disabled={isDisabled}\n            data-testid={testId}\n            ref={setInputRef}\n            className={csx(\n              \"proton-Input\",\n              error && \"proton-Input--error\",\n              label && \"proton-Input__label-top\",\n              className,\n            )}\n          />\n\n          <label\n            htmlFor={inputId}\n            className={csx(\n              \"proton-Input__label\",\n              value && \"proton-Input__label--filled\",\n            )}\n          >\n            {label}\n            {isRequired && <span aria-hidden=\"true\"> *</span>}\n          </label>\n\n          {suffix && (\n            <div\n              ref={suffixRef}\n              className={csx(\n                \"proton-Input__descriptor\",\n                \"proton-Input__suffix\",\n              )}\n            >\n              {suffix}\n            </div>\n          )}\n        </div>\n\n        {error ? (\n          <div\n            role=\"alert\"\n            className={csx(\"proton-Input__error\", \"proton-Input__text\")}\n            id={errorId}\n          >\n            {error}\n          </div>\n        ) : description && descriptionPosition === \"bottom\" ? (\n          <div\n            id={descriptionId}\n            className=\"proton-Input__text\"\n            aria-live=\"polite\"\n          >\n            {description}\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\n\nInput.displayName = \"ProtonUIInput\";\n"],"names":["Input","forwardRef","prefix","suffix","description","descriptionPosition","isDisabled","error","onChange","label","name","placeholder","type","value","autoFocus","autoComplete","isRequired","isReadOnly","onSubmit","onClear","testId","forwardedRef","inputRef","useRef","prefixRef","suffixRef","containerRef","className","useTheme","setInputRef","useMergedRef","idBase","useId","useEffect","prevSizes","rafId","updateSizes","containerWidth","prefixWidth","_a","suffixWidth","_b","resizeObserver","inputId","errorId","descriptionId","jsxs","jsx","csx","copyTextToClipboard"],"mappings":"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"}
+{"version":3,"file":"Input.cjs.js","sources":["../../../../src/components/Input/BaseInput/Input.tsx"],"sourcesContent":["\"use client\";\n\nimport React, {\n  ChangeEvent,\n  forwardRef,\n  useEffect,\n  useId,\n  useRef,\n  type ForwardedRef,\n} from \"react\";\n\nimport { useMergedRef } from \"../../../hooks/useMergedRef\";\nimport { useTheme } from \"../../ThemeProvider\";\nimport { csx } from \"../../../utils\";\nimport \"./Input.css\";\nimport { copyTextToClipboard } from \"../../../utils/copy\";\n\nexport interface BaseInputProps {\n  /**\n   * onChange handler for the input\n   */\n  onChange?: (value: string) => void;\n\n  /** Whether the input is disabled. */\n  isDisabled?: boolean;\n\n  /** Description text shown above the input. */\n  description?: React.ReactNode | string;\n\n  /**\n   * The position of the description text.\n   * @default \"top\"\n   */\n  descriptionPosition?: \"top\" | \"bottom\";\n\n  /** Error state that changes the input's visual style and displays an error message. */\n  error?: React.ReactNode | string;\n\n  /**\n   * Label for the input element.\n   * @note When a label is provided, the input will have extra padding, and the label will float above the text input when focused or filled.\n   */\n  label?: string;\n\n  /** Test ID for the component. */\n  \"data-testid\"?: string;\n\n  /** Content to display before the input. Typically used for icons. */\n  prefix?: React.ReactNode;\n\n  /** Content to display after the input. Typically used for icons. */\n  suffix?: React.ReactNode;\n\n  /**\n   * Should the browser's autocomplete be enabled?\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete\n   */\n  autoComplete?: boolean;\n\n  /**\n   * Should the input be autofocused?\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autofocus\n   */\n  autoFocus?: boolean;\n\n  /**\n   * The name attribute of the input element.\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/name\n   */\n  name: string;\n\n  /**\n   * The placeholder text to display when the input is empty.\n   * @note label takes precedence over placeholder, if both are provided.\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/placeholder\n   */\n  placeholder?: string;\n\n  /**\n   * The type attribute of the input element.\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/type\n   * @default \"text\"\n   */\n  type?: string;\n\n  /**\n   * The value of the input.\n   * @external https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value\n   */\n  value?: string;\n\n  /**\n   * Whether the input is required.\n   * @default false\n   */\n  isRequired?: boolean;\n\n  /**\n   * Whether the input is read-only.\n   * @default false\n   */\n  isReadOnly?: boolean;\n\n  /**\n   * Called when the input is submitted (e.g. by pressing Enter).\n   */\n  onSubmit?: React.FormEventHandler<HTMLInputElement>;\n\n  /**\n   * Called when the input is cleared (e.g. by pressing Escape).\n   */\n  onClear?: () => void;\n}\n\n/**\n * A controlled and customizable input component with support for labels, prefixes, suffixes, and error states.\n *\n * API:\n *  - {@link BaseInputProps}\n */\nexport const Input = forwardRef<HTMLInputElement, BaseInputProps>(\n  (\n    {\n      prefix,\n      suffix,\n      description,\n      descriptionPosition = \"top\",\n      isDisabled,\n      error,\n      onChange,\n      label,\n      name,\n      placeholder,\n      type = \"text\",\n      value,\n      autoFocus,\n      autoComplete,\n      isRequired = false,\n      isReadOnly = false,\n      onSubmit,\n      onClear,\n      \"data-testid\": testId,\n    },\n    forwardedRef: ForwardedRef<HTMLInputElement>,\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n    const prefixRef = useRef<HTMLDivElement>(null);\n    const suffixRef = useRef<HTMLDivElement>(null);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const { className } = useTheme();\n    const setInputRef = useMergedRef(inputRef, forwardedRef);\n    const idBase = useId();\n\n    // Control dynamic prefix and suffix widths using ResizeObserver\n    useEffect(() => {\n      if (!containerRef.current) return;\n\n      const prevSizes = {\n        containerWidth: 200,\n        prefixWidth: 32,\n        suffixWidth: 32,\n      };\n\n      let rafId: number | null = null;\n\n      const updateSizes = () => {\n        if (rafId !== null) cancelAnimationFrame(rafId);\n\n        rafId = requestAnimationFrame(() => {\n          if (!containerRef.current) return;\n\n          if (containerRef.current) {\n            const containerWidth =\n              containerRef.current.offsetWidth || prevSizes.containerWidth;\n\n            if (containerWidth !== prevSizes.containerWidth) {\n              containerRef.current.style.setProperty(\n                \"--container-width\",\n                `${containerWidth}px`,\n              );\n              prevSizes.containerWidth = containerWidth;\n            }\n          }\n\n          if (prefixRef.current) {\n            const prefixWidth =\n              prefixRef.current.offsetWidth || prevSizes.prefixWidth;\n\n            if (prefixWidth !== prevSizes.prefixWidth) {\n              containerRef.current?.style.setProperty(\n                \"--prefix-width\",\n                `${prefixWidth}px`,\n              );\n              prevSizes.prefixWidth = prefixWidth;\n            }\n          }\n\n          if (suffixRef.current) {\n            const suffixWidth =\n              suffixRef.current.offsetWidth || prevSizes.suffixWidth;\n\n            if (suffixWidth !== prevSizes.suffixWidth) {\n              containerRef.current?.style.setProperty(\n                \"--suffix-width\",\n                `${suffixWidth}px`,\n              );\n              prevSizes.suffixWidth = suffixWidth;\n            }\n          }\n        });\n      };\n\n      updateSizes();\n\n      const resizeObserver = new ResizeObserver(updateSizes);\n\n      if (containerRef.current) {\n        resizeObserver.observe(containerRef.current);\n      }\n      if (prefixRef.current) {\n        resizeObserver.observe(prefixRef.current);\n      }\n      if (suffixRef.current) {\n        resizeObserver.observe(suffixRef.current);\n      }\n\n      return () => {\n        if (rafId !== null) {\n          cancelAnimationFrame(rafId);\n        }\n        resizeObserver.disconnect();\n      };\n    }, [prefix, suffix]);\n\n    const inputId = `${idBase}-input`;\n    const errorId = `${idBase}-error`;\n    const descriptionId = `${idBase}-description`;\n\n    return (\n      <div ref={containerRef} className=\"proton-Input__container\">\n        {description && descriptionPosition === \"top\" && (\n          <div\n            id={descriptionId}\n            className=\"proton-Input__text\"\n            aria-live=\"polite\"\n          >\n            {description}\n          </div>\n        )}\n        <div\n          className={csx(\n            \"proton-Input__container-inner\",\n            prefix && \"proton-Input__has-prefix\",\n            suffix && \"proton-Input__has-suffix\",\n          )}\n        >\n          {prefix && (\n            <div\n              ref={prefixRef}\n              className={csx(\n                \"proton-Input__descriptor\",\n                \"proton-Input__prefix\",\n              )}\n            >\n              {prefix}\n            </div>\n          )}\n\n          <input\n            id={inputId}\n            name={name}\n            type={type}\n            value={value}\n            onChange={(e: ChangeEvent<HTMLInputElement>) => {\n              onChange?.(e.target.value);\n            }}\n            onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {\n              switch (e.key) {\n                case \"Enter\":\n                  if (onSubmit) {\n                    e.preventDefault();\n                    onSubmit(e);\n                  }\n                  break;\n                case \"Escape\":\n                  if (onClear) {\n                    e.preventDefault();\n                    onClear();\n                  }\n                  break;\n              }\n            }}\n            onCopy={async () =>\n              await copyTextToClipboard(inputRef.current?.value || \"\")\n            }\n            disabled={isDisabled}\n            readOnly={isReadOnly}\n            required={isRequired}\n            autoFocus={autoFocus}\n            autoComplete={autoComplete ? \"on\" : \"off\"}\n            placeholder={label ? undefined : placeholder}\n            aria-label={label || name}\n            aria-invalid={Boolean(error)}\n            aria-errormessage={error ? errorId : undefined}\n            aria-required={isRequired}\n            aria-readonly={isReadOnly}\n            aria-describedby={\n              error ? errorId : description ? descriptionId : undefined\n            }\n            aria-disabled={isDisabled}\n            data-testid={testId}\n            ref={setInputRef}\n            className={csx(\n              \"proton-Input\",\n              error && \"proton-Input--error\",\n              label && \"proton-Input__label-top\",\n              className,\n            )}\n          />\n\n          <label\n            htmlFor={inputId}\n            className={csx(\n              \"proton-Input__label\",\n              value && \"proton-Input__label--filled\",\n            )}\n          >\n            {label}\n            {isRequired && <span aria-hidden=\"true\"> *</span>}\n          </label>\n\n          {suffix && (\n            <div\n              ref={suffixRef}\n              className={csx(\n                \"proton-Input__descriptor\",\n                \"proton-Input__suffix\",\n              )}\n            >\n              {suffix}\n            </div>\n          )}\n        </div>\n\n        {error ? (\n          <div\n            role=\"alert\"\n            className={csx(\"proton-Input__error\", \"proton-Input__text\")}\n            id={errorId}\n          >\n            {error}\n          </div>\n        ) : description && descriptionPosition === \"bottom\" ? (\n          <div\n            id={descriptionId}\n            className=\"proton-Input__text\"\n            aria-live=\"polite\"\n          >\n            {description}\n          </div>\n        ) : null}\n      </div>\n    );\n  },\n);\n\nInput.displayName = \"ProtonUIInput\";\n"],"names":["Input","forwardRef","prefix","suffix","description","descriptionPosition","isDisabled","error","onChange","label","name","placeholder","type","value","autoFocus","autoComplete","isRequired","isReadOnly","onSubmit","onClear","testId","forwardedRef","inputRef","useRef","prefixRef","suffixRef","containerRef","className","useTheme","setInputRef","useMergedRef","idBase","useId","useEffect","prevSizes","rafId","updateSizes","containerWidth","prefixWidth","_a","suffixWidth","_b","resizeObserver","inputId","errorId","descriptionId","jsxs","jsx","csx","copyTextToClipboard"],"mappings":"sVAwHaA,EAAQC,EAAAA,WACnB,CACE,CACE,OAAAC,EACA,OAAAC,EACA,YAAAC,EACA,oBAAAC,EAAsB,MACtB,WAAAC,EACA,MAAAC,EACA,SAAAC,EACA,MAAAC,EACA,KAAAC,EACA,YAAAC,EACA,KAAAC,EAAO,OACP,MAAAC,EACA,UAAAC,EACA,aAAAC,EACA,WAAAC,EAAa,GACb,WAAAC,EAAa,GACb,SAAAC,EACA,QAAAC,EACA,cAAeC,CAAA,EAEjBC,IACG,CACH,MAAMC,EAAWC,EAAAA,OAAyB,IAAI,EACxCC,EAAYD,EAAAA,OAAuB,IAAI,EACvCE,EAAYF,EAAAA,OAAuB,IAAI,EACvCG,EAAeH,EAAAA,OAAuB,IAAI,EAC1C,CAAE,UAAAI,CAAA,EAAcC,WAAA,EAChBC,EAAcC,EAAAA,aAAaR,EAAUD,CAAY,EACjDU,EAASC,EAAAA,MAAA,EAGfC,EAAAA,UAAU,IAAM,CACd,GAAI,CAACP,EAAa,QAAS,OAE3B,MAAMQ,EAAY,CAChB,eAAgB,IAChB,YAAa,GACb,YAAa,EAAA,EAGf,IAAIC,EAAuB,KAE3B,MAAMC,EAAc,IAAM,CACpBD,IAAU,MAAM,qBAAqBA,CAAK,EAE9CA,EAAQ,sBAAsB,IAAM,SAClC,GAAKT,EAAa,QAElB,IAAIA,EAAa,QAAS,CACxB,MAAMW,EACJX,EAAa,QAAQ,aAAeQ,EAAU,eAE5CG,IAAmBH,EAAU,iBAC/BR,EAAa,QAAQ,MAAM,YACzB,oBACA,GAAGW,CAAc,IAAA,EAEnBH,EAAU,eAAiBG,EAE/B,CAEA,GAAIb,EAAU,QAAS,CACrB,MAAMc,EACJd,EAAU,QAAQ,aAAeU,EAAU,YAEzCI,IAAgBJ,EAAU,eAC5BK,EAAAb,EAAa,UAAb,MAAAa,EAAsB,MAAM,YAC1B,iBACA,GAAGD,CAAW,MAEhBJ,EAAU,YAAcI,EAE5B,CAEA,GAAIb,EAAU,QAAS,CACrB,MAAMe,EACJf,EAAU,QAAQ,aAAeS,EAAU,YAEzCM,IAAgBN,EAAU,eAC5BO,EAAAf,EAAa,UAAb,MAAAe,EAAsB,MAAM,YAC1B,iBACA,GAAGD,CAAW,MAEhBN,EAAU,YAAcM,EAE5B,EACF,CAAC,CACH,EAEAJ,EAAA,EAEA,MAAMM,EAAiB,IAAI,eAAeN,CAAW,EAErD,OAAIV,EAAa,SACfgB,EAAe,QAAQhB,EAAa,OAAO,EAEzCF,EAAU,SACZkB,EAAe,QAAQlB,EAAU,OAAO,EAEtCC,EAAU,SACZiB,EAAe,QAAQjB,EAAU,OAAO,EAGnC,IAAM,CACPU,IAAU,MACZ,qBAAqBA,CAAK,EAE5BO,EAAe,WAAA,CACjB,CACF,EAAG,CAACxC,EAAQC,CAAM,CAAC,EAEnB,MAAMwC,EAAU,GAAGZ,CAAM,SACnBa,EAAU,GAAGb,CAAM,SACnBc,EAAgB,GAAGd,CAAM,eAE/B,OACEe,EAAAA,KAAC,MAAA,CAAI,IAAKpB,EAAc,UAAU,0BAC/B,SAAA,CAAAtB,GAAeC,IAAwB,OACtC0C,EAAAA,IAAC,MAAA,CACC,GAAIF,EACJ,UAAU,qBACV,YAAU,SAET,SAAAzC,CAAA,CAAA,EAGL0C,EAAAA,KAAC,MAAA,CACC,UAAWE,EAAAA,IACT,gCACA9C,GAAU,2BACVC,GAAU,0BAAA,EAGX,SAAA,CAAAD,GACC6C,EAAAA,IAAC,MAAA,CACC,IAAKvB,EACL,UAAWwB,EAAAA,IACT,2BACA,sBAAA,EAGD,SAAA9C,CAAA,CAAA,EAIL6C,EAAAA,IAAC,QAAA,CACC,GAAIJ,EACJ,KAAAjC,EACA,KAAAE,EACA,MAAAC,EACA,SAAW,GAAqC,CAC9CL,GAAA,MAAAA,EAAW,EAAE,OAAO,MACtB,EACA,UAAY,GAA6C,CACvD,OAAQ,EAAE,IAAA,CACR,IAAK,QACCU,IACF,EAAE,eAAA,EACFA,EAAS,CAAC,GAEZ,MACF,IAAK,SACCC,IACF,EAAE,eAAA,EACFA,EAAA,GAEF,KAAA,CAEN,EACA,OAAQ,SAAA,OACN,aAAM8B,EAAAA,sBAAoBV,EAAAjB,EAAS,UAAT,YAAAiB,EAAkB,QAAS,EAAE,GAEzD,SAAUjC,EACV,SAAUW,EACV,SAAUD,EACV,UAAAF,EACA,aAAcC,EAAe,KAAO,MACpC,YAAaN,EAAQ,OAAYE,EACjC,aAAYF,GAASC,EACrB,eAAc,EAAQH,EACtB,oBAAmBA,EAAQqC,EAAU,OACrC,gBAAe5B,EACf,gBAAeC,EACf,mBACEV,EAAQqC,EAAUxC,EAAcyC,EAAgB,OAElD,gBAAevC,EACf,cAAac,EACb,IAAKS,EACL,UAAWmB,EAAAA,IACT,eACAzC,GAAS,sBACTE,GAAS,0BACTkB,CAAA,CACF,CAAA,EAGFmB,EAAAA,KAAC,QAAA,CACC,QAASH,EACT,UAAWK,EAAAA,IACT,sBACAnC,GAAS,6BAAA,EAGV,SAAA,CAAAJ,EACAO,GAAc+B,EAAAA,IAAC,OAAA,CAAK,cAAY,OAAO,SAAA,IAAA,CAAE,CAAA,CAAA,CAAA,EAG3C5C,GACC4C,EAAAA,IAAC,MAAA,CACC,IAAKtB,EACL,UAAWuB,EAAAA,IACT,2BACA,sBAAA,EAGD,SAAA7C,CAAA,CAAA,CACH,CAAA,CAAA,EAIHI,EACCwC,EAAAA,IAAC,MAAA,CACC,KAAK,QACL,UAAWC,EAAAA,IAAI,sBAAuB,oBAAoB,EAC1D,GAAIJ,EAEH,SAAArC,CAAA,CAAA,EAEDH,GAAeC,IAAwB,SACzC0C,EAAAA,IAAC,MAAA,CACC,GAAIF,EACJ,UAAU,qBACV,YAAU,SAET,SAAAzC,CAAA,CAAA,EAED,IAAA,EACN,CAEJ,CACF,EAEAJ,EAAM,YAAc"}