@protonradio/proton-ui 0.11.8 → 0.11.10-beta.1

package/dist/design/darkTheme.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("./darkTheme/colors.cjs.js"),E=require("./darkTheme/stylesheet.cjs.js");exports.DARK_BORDER=A.BORDER;exports.DARK_ELEVATION=A.ELEVATION;exports.DARK_GRAYSCALE=A.DARK_GRAYSCALE;exports.DARK_PALETTE=A.DARK_PALETTE;exports.DARK_SECONDARY=A.DARK_SECONDARY;exports.DARK_STYLESHEET=E.DARK_STYLESHEET;
+//# sourceMappingURL=darkTheme.cjs.js.map

package/dist/design/darkTheme.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"darkTheme.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/design/darkTheme.d.ts

@@ -0,0 +1,2 @@
+export * from '../src/design/darkTheme/index'
+export {}

package/dist/design/darkTheme.es.js

@@ -0,0 +1,11 @@
+import { BORDER as R, ELEVATION as D, DARK_GRAYSCALE as K, DARK_PALETTE as T, DARK_SECONDARY as _ } from "./darkTheme/colors.es.js";
+import { DARK_STYLESHEET as O } from "./darkTheme/stylesheet.es.js";
+export {
+  R as DARK_BORDER,
+  D as DARK_ELEVATION,
+  K as DARK_GRAYSCALE,
+  T as DARK_PALETTE,
+  _ as DARK_SECONDARY,
+  O as DARK_STYLESHEET
+};
+//# sourceMappingURL=darkTheme.es.js.map

package/dist/design/darkTheme.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"darkTheme.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/design/generateStylesheet.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("./theme.cjs.js"),n=require("./lightTheme/stylesheet.cjs.js"),_=require("./darkTheme/stylesheet.cjs.js"),c=(r,e)=>{const o=e===s.THEMES.DARK?_.DARK_STYLESHEET:n.LIGHT_STYLESHEET;if(r){const t=R(r);return{...o,...t}}return o},R=r=>({"--proton-color__primary":r.BRAND.PRIMARY,"--proton-color__primary-light":r.BRAND.PRIMARY_LIGHT,"--proton-color__primary-super-light":r.BRAND.PRIMARY_SUPER_LIGHT,"--proton-color__secondary":r.BRAND.SECONDARY,"--proton-color__secondary-light":r.BRAND.SECONDARY_LIGHT,"--proton-color__secondary-super-light":r.BRAND.SECONDARY_SUPER_LIGHT});exports.generateStylesheet=c;
+//# sourceMappingURL=generateStylesheet.cjs.js.map

package/dist/design/generateStylesheet.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generateStylesheet.cjs.js","sources":["../../src/design/generateStylesheet.ts"],"sourcesContent":["import { THEMES } from \"./theme\";\r\nimport { ProtonPalette } from \"./types\";\r\nimport { LIGHT_STYLESHEET } from \"./lightTheme/stylesheet\";\r\nimport { DARK_STYLESHEET } from \"./darkTheme/stylesheet\";\r\nimport { ProtonStyleSheet } from \"./types\";\r\n\r\nexport const generateStylesheet = (\r\n  palette: ProtonPalette,\r\n  theme: string\r\n): ProtonStyleSheet => {\r\n  const themeVariables =\r\n    theme === THEMES.DARK ? DARK_STYLESHEET : LIGHT_STYLESHEET;\r\n\r\n  if (palette) {\r\n    const customVars = generateCustomStylesheet(palette);\r\n    return {\r\n      ...themeVariables,\r\n      ...customVars,\r\n    };\r\n  }\r\n\r\n  return themeVariables;\r\n};\r\n\r\n//overrride theme colors in stylesheet\r\nconst generateCustomStylesheet = (\r\n  palette: ProtonPalette\r\n): Partial<ProtonStyleSheet> => {\r\n  return {\r\n    \"--proton-color__primary\": palette.BRAND.PRIMARY,\r\n    \"--proton-color__primary-light\": palette.BRAND.PRIMARY_LIGHT,\r\n    \"--proton-color__primary-super-light\": palette.BRAND.PRIMARY_SUPER_LIGHT,\r\n    \"--proton-color__secondary\": palette.BRAND.SECONDARY,\r\n    \"--proton-color__secondary-light\": palette.BRAND.SECONDARY_LIGHT,\r\n    \"--proton-color__secondary-super-light\":\r\n      palette.BRAND.SECONDARY_SUPER_LIGHT,\r\n\r\n    //TODO: add newly generated grayscale color scale\r\n  };\r\n};\r\n"],"names":["generateStylesheet","palette","theme","themeVariables","THEMES","DARK_STYLESHEET","LIGHT_STYLESHEET","customVars","generateCustomStylesheet"],"mappings":"yMAMaA,EAAqB,CAChCC,EACAC,IACqB,CACrB,MAAMC,EACJD,IAAUE,EAAAA,OAAO,KAAOC,EAAAA,gBAAkBC,EAAAA,iBAE5C,GAAIL,EAAS,CACL,MAAAM,EAAaC,EAAyBP,CAAO,EAC5C,MAAA,CACL,GAAGE,EACH,GAAGI,CAAA,CAEP,CAEO,OAAAJ,CACT,EAGMK,EACJP,IAEO,CACL,0BAA2BA,EAAQ,MAAM,QACzC,gCAAiCA,EAAQ,MAAM,cAC/C,sCAAuCA,EAAQ,MAAM,oBACrD,4BAA6BA,EAAQ,MAAM,UAC3C,kCAAmCA,EAAQ,MAAM,gBACjD,wCACEA,EAAQ,MAAM,qBAAA"}

package/dist/design/generateStylesheet.es.js

@@ -0,0 +1,26 @@
+import { THEMES as n } from "./theme.es.js";
+import { LIGHT_STYLESHEET as t } from "./lightTheme/stylesheet.es.js";
+import { DARK_STYLESHEET as s } from "./darkTheme/stylesheet.es.js";
+const i = (o, _) => {
+  const r = _ === n.DARK ? s : t;
+  if (o) {
+    const R = c(o);
+    return {
+      ...r,
+      ...R
+    };
+  }
+  return r;
+}, c = (o) => ({
+  "--proton-color__primary": o.BRAND.PRIMARY,
+  "--proton-color__primary-light": o.BRAND.PRIMARY_LIGHT,
+  "--proton-color__primary-super-light": o.BRAND.PRIMARY_SUPER_LIGHT,
+  "--proton-color__secondary": o.BRAND.SECONDARY,
+  "--proton-color__secondary-light": o.BRAND.SECONDARY_LIGHT,
+  "--proton-color__secondary-super-light": o.BRAND.SECONDARY_SUPER_LIGHT
+  //TODO: add newly generated grayscale color scale
+});
+export {
+  i as generateStylesheet
+};
+//# sourceMappingURL=generateStylesheet.es.js.map

package/dist/design/generateStylesheet.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generateStylesheet.es.js","sources":["../../src/design/generateStylesheet.ts"],"sourcesContent":["import { THEMES } from \"./theme\";\r\nimport { ProtonPalette } from \"./types\";\r\nimport { LIGHT_STYLESHEET } from \"./lightTheme/stylesheet\";\r\nimport { DARK_STYLESHEET } from \"./darkTheme/stylesheet\";\r\nimport { ProtonStyleSheet } from \"./types\";\r\n\r\nexport const generateStylesheet = (\r\n  palette: ProtonPalette,\r\n  theme: string\r\n): ProtonStyleSheet => {\r\n  const themeVariables =\r\n    theme === THEMES.DARK ? DARK_STYLESHEET : LIGHT_STYLESHEET;\r\n\r\n  if (palette) {\r\n    const customVars = generateCustomStylesheet(palette);\r\n    return {\r\n      ...themeVariables,\r\n      ...customVars,\r\n    };\r\n  }\r\n\r\n  return themeVariables;\r\n};\r\n\r\n//overrride theme colors in stylesheet\r\nconst generateCustomStylesheet = (\r\n  palette: ProtonPalette\r\n): Partial<ProtonStyleSheet> => {\r\n  return {\r\n    \"--proton-color__primary\": palette.BRAND.PRIMARY,\r\n    \"--proton-color__primary-light\": palette.BRAND.PRIMARY_LIGHT,\r\n    \"--proton-color__primary-super-light\": palette.BRAND.PRIMARY_SUPER_LIGHT,\r\n    \"--proton-color__secondary\": palette.BRAND.SECONDARY,\r\n    \"--proton-color__secondary-light\": palette.BRAND.SECONDARY_LIGHT,\r\n    \"--proton-color__secondary-super-light\":\r\n      palette.BRAND.SECONDARY_SUPER_LIGHT,\r\n\r\n    //TODO: add newly generated grayscale color scale\r\n  };\r\n};\r\n"],"names":["generateStylesheet","palette","theme","themeVariables","THEMES","DARK_STYLESHEET","LIGHT_STYLESHEET","customVars","generateCustomStylesheet"],"mappings":";;;AAMa,MAAAA,IAAqB,CAChCC,GACAC,MACqB;AACrB,QAAMC,IACJD,MAAUE,EAAO,OAAOC,IAAkBC;AAE5C,MAAIL,GAAS;AACL,UAAAM,IAAaC,EAAyBP,CAAO;AAC5C,WAAA;AAAA,MACL,GAAGE;AAAA,MACH,GAAGI;AAAA,IAAA;AAAA,EAEP;AAEO,SAAAJ;AACT,GAGMK,IAA2B,CAC/BP,OAEO;AAAA,EACL,2BAA2BA,EAAQ,MAAM;AAAA,EACzC,iCAAiCA,EAAQ,MAAM;AAAA,EAC/C,uCAAuCA,EAAQ,MAAM;AAAA,EACrD,6BAA6BA,EAAQ,MAAM;AAAA,EAC3C,mCAAmCA,EAAQ,MAAM;AAAA,EACjD,yCACEA,EAAQ,MAAM;AAAA;AAAA;"}

package/dist/design/lightTheme/colors.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("../colors.cjs.js"),D="#DDDDDD",I=D,A="#F7F8F9",R={SUPER_DARK:"#141211",DARK:"#4D4D4D",MEDIUM:"#7D7D7D",MEDIUM_LIGHT:"#B1B1B1",LIGHT:D,LIGHTEST:"#F0F1F2",SUPER_LIGHT:A,WHITE:"#FFFFFF"},T={SUPER_DARK:"#032026",DARK:"#084657",MEDIUM:"#2085BA",MEDIUM_LIGHT:"#44A8EB",LIGHT:"#70B9F6",LIGHTEST:"#9DCBFC",SUPER_LIGHT:"#C8DFFF",WHITE:"#f5f9ff"},L={BASE_COLOR:E.BACKGROUNDS.WHITE,BRAND:E.BRAND,GRAYSCALE:R,PRIMARY:E.BRAND_PRIMARY_SCALE,SECONDARY:T};exports.BORDER=I;exports.ELEVATION=A;exports.LIGHT_GRAYSCALE=R;exports.LIGHT_PALETTE=L;exports.LIGHT_SECONDARY_SCALE=T;
+//# sourceMappingURL=colors.cjs.js.map

package/dist/{colors-DMkDnu4U.mjs.map → design/lightTheme/colors.cjs.js.map}

@@ -1 +1 @@
-{"version":3,"file":"colors-DMkDnu4U.mjs","sources":["../src/design/lightTheme/colors.ts"],"sourcesContent":["import {\r\n  BACKGROUNDS,\r\n  BRAND,\r\n  BRAND_PRIMARY_SCALE,\r\n} from \"../colors\";\r\nimport { ProtonColorScale, ProtonPalette } from \"../types\";\r\n\r\nconst LIGHT_GRAY = \"#DDDDDD\";\r\nexport const BORDER = LIGHT_GRAY;\r\nexport const ELEVATION = \"#F7F8F9\";\r\nexport const LIGHT_GRAYSCALE: ProtonColorScale = {\r\n  SUPER_DARK: \"#141211\",\r\n  DARK: \"#4D4D4D\",\r\n  MEDIUM: \"#7D7D7D\",\r\n  MEDIUM_LIGHT: \"#B1B1B1\",\r\n  LIGHT: LIGHT_GRAY,\r\n  LIGHTEST: \"#F0F1F2\",\r\n  SUPER_LIGHT: ELEVATION,\r\n  WHITE: \"#FFFFFF\",\r\n};\r\n\r\nexport const LIGHT_SECONDARY_SCALE: ProtonColorScale = {\r\n  SUPER_DARK: \"#032026\",\r\n  DARK: \"#084657\",\r\n  MEDIUM: \"#2085BA\",\r\n  MEDIUM_LIGHT: \"#44A8EB\",\r\n  LIGHT: \"#70B9F6\",\r\n  LIGHTEST: \"#9DCBFC\",\r\n  SUPER_LIGHT: \"#C8DFFF\",\r\n  WHITE: \"#f5f9ff\",\r\n};\r\n\r\nexport const LIGHT_PALETTE: ProtonPalette = {\r\n  BASE_COLOR: BACKGROUNDS.WHITE,\r\n  BRAND,\r\n  GRAYSCALE: LIGHT_GRAYSCALE,\r\n  PRIMARY: BRAND_PRIMARY_SCALE,\r\n  SECONDARY: LIGHT_SECONDARY_SCALE,\r\n};\r\n"],"names":["LIGHT_GRAY","BORDER","ELEVATION","LIGHT_GRAYSCALE","LIGHT_SECONDARY_SCALE","LIGHT_PALETTE","BACKGROUNDS","BRAND","BRAND_PRIMARY_SCALE"],"mappings":";AAOA,MAAMA,IAAa,WACNC,IAASD,GACTE,IAAY,WACZC,IAAoC;AAAA,EAC/C,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,OAAOH;AAAA,EACP,UAAU;AAAA,EACV,aAAaE;AAAA,EACb,OAAO;AACT,GAEaE,IAA0C;AAAA,EACrD,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,OAAO;AAAA,EACP,UAAU;AAAA,EACV,aAAa;AAAA,EACb,OAAO;AACT,GAEaC,IAA+B;AAAA,EAC1C,YAAYC,EAAY;AAAA,EACxB,OAAAC;AAAA,EACA,WAAWJ;AAAA,EACX,SAASK;AAAA,EACT,WAAWJ;AACb;"}
+{"version":3,"file":"colors.cjs.js","sources":["../../../src/design/lightTheme/colors.ts"],"sourcesContent":["import {\r\n  BACKGROUNDS,\r\n  BRAND,\r\n  BRAND_PRIMARY_SCALE,\r\n} from \"../colors\";\r\nimport { ProtonColorScale, ProtonPalette } from \"../types\";\r\n\r\nconst LIGHT_GRAY = \"#DDDDDD\";\r\nexport const BORDER = LIGHT_GRAY;\r\nexport const ELEVATION = \"#F7F8F9\";\r\nexport const LIGHT_GRAYSCALE: ProtonColorScale = {\r\n  SUPER_DARK: \"#141211\",\r\n  DARK: \"#4D4D4D\",\r\n  MEDIUM: \"#7D7D7D\",\r\n  MEDIUM_LIGHT: \"#B1B1B1\",\r\n  LIGHT: LIGHT_GRAY,\r\n  LIGHTEST: \"#F0F1F2\",\r\n  SUPER_LIGHT: ELEVATION,\r\n  WHITE: \"#FFFFFF\",\r\n};\r\n\r\nexport const LIGHT_SECONDARY_SCALE: ProtonColorScale = {\r\n  SUPER_DARK: \"#032026\",\r\n  DARK: \"#084657\",\r\n  MEDIUM: \"#2085BA\",\r\n  MEDIUM_LIGHT: \"#44A8EB\",\r\n  LIGHT: \"#70B9F6\",\r\n  LIGHTEST: \"#9DCBFC\",\r\n  SUPER_LIGHT: \"#C8DFFF\",\r\n  WHITE: \"#f5f9ff\",\r\n};\r\n\r\nexport const LIGHT_PALETTE: ProtonPalette = {\r\n  BASE_COLOR: BACKGROUNDS.WHITE,\r\n  BRAND,\r\n  GRAYSCALE: LIGHT_GRAYSCALE,\r\n  PRIMARY: BRAND_PRIMARY_SCALE,\r\n  SECONDARY: LIGHT_SECONDARY_SCALE,\r\n};\r\n"],"names":["LIGHT_GRAY","BORDER","ELEVATION","LIGHT_GRAYSCALE","LIGHT_SECONDARY_SCALE","LIGHT_PALETTE","BACKGROUNDS","BRAND","BRAND_PRIMARY_SCALE"],"mappings":"oHAOMA,EAAa,UACNC,EAASD,EACTE,EAAY,UACZC,EAAoC,CAC/C,WAAY,UACZ,KAAM,UACN,OAAQ,UACR,aAAc,UACd,MAAOH,EACP,SAAU,UACV,YAAaE,EACb,MAAO,SACT,EAEaE,EAA0C,CACrD,WAAY,UACZ,KAAM,UACN,OAAQ,UACR,aAAc,UACd,MAAO,UACP,SAAU,UACV,YAAa,UACb,MAAO,SACT,EAEaC,EAA+B,CAC1C,WAAYC,EAAY,YAAA,MAAA,MACxBC,EAAA,MACA,UAAWJ,EACX,QAASK,EAAA,oBACT,UAAWJ,CACb"}

package/dist/{colors-DMkDnu4U.mjs → design/lightTheme/colors.es.js}

@@ -1,5 +1,5 @@
-import { B as E, a as A, b as R } from "./colors-CWaj9dFz.mjs";
-const D = "#DDDDDD", G = D, I = "#F7F8F9", L = {
+import { BACKGROUNDS as E, BRAND as A, BRAND_PRIMARY_SCALE as R } from "../colors.es.js";
+const D = "#DDDDDD", G = D, I = "#F7F8F9", T = {
   SUPER_DARK: "#141211",
   DARK: "#4D4D4D",
   MEDIUM: "#7D7D7D",
@@ -8,7 +8,7 @@ const D = "#DDDDDD", G = D, I = "#F7F8F9", L = {
   LIGHTEST: "#F0F1F2",
   SUPER_LIGHT: I,
   WHITE: "#FFFFFF"
-}, T = {
+}, L = {
   SUPER_DARK: "#032026",
   DARK: "#084657",
   MEDIUM: "#2085BA",
@@ -20,15 +20,15 @@ const D = "#DDDDDD", G = D, I = "#F7F8F9", L = {
 }, H = {
   BASE_COLOR: E.WHITE,
   BRAND: A,
-  GRAYSCALE: L,
+  GRAYSCALE: T,
   PRIMARY: R,
-  SECONDARY: T
+  SECONDARY: L
 };
 export {
-  G as B,
-  I as E,
-  H as L,
-  L as a,
-  T as b
+  G as BORDER,
+  I as ELEVATION,
+  T as LIGHT_GRAYSCALE,
+  H as LIGHT_PALETTE,
+  L as LIGHT_SECONDARY_SCALE
 };
-//# sourceMappingURL=colors-DMkDnu4U.mjs.map
+//# sourceMappingURL=colors.es.js.map

package/dist/{colors-DL1dYffC.js.map → design/lightTheme/colors.es.js.map}

@@ -1 +1 @@
-{"version":3,"file":"colors-DL1dYffC.js","sources":["../src/design/lightTheme/colors.ts"],"sourcesContent":["import {\r\n  BACKGROUNDS,\r\n  BRAND,\r\n  BRAND_PRIMARY_SCALE,\r\n} from \"../colors\";\r\nimport { ProtonColorScale, ProtonPalette } from \"../types\";\r\n\r\nconst LIGHT_GRAY = \"#DDDDDD\";\r\nexport const BORDER = LIGHT_GRAY;\r\nexport const ELEVATION = \"#F7F8F9\";\r\nexport const LIGHT_GRAYSCALE: ProtonColorScale = {\r\n  SUPER_DARK: \"#141211\",\r\n  DARK: \"#4D4D4D\",\r\n  MEDIUM: \"#7D7D7D\",\r\n  MEDIUM_LIGHT: \"#B1B1B1\",\r\n  LIGHT: LIGHT_GRAY,\r\n  LIGHTEST: \"#F0F1F2\",\r\n  SUPER_LIGHT: ELEVATION,\r\n  WHITE: \"#FFFFFF\",\r\n};\r\n\r\nexport const LIGHT_SECONDARY_SCALE: ProtonColorScale = {\r\n  SUPER_DARK: \"#032026\",\r\n  DARK: \"#084657\",\r\n  MEDIUM: \"#2085BA\",\r\n  MEDIUM_LIGHT: \"#44A8EB\",\r\n  LIGHT: \"#70B9F6\",\r\n  LIGHTEST: \"#9DCBFC\",\r\n  SUPER_LIGHT: \"#C8DFFF\",\r\n  WHITE: \"#f5f9ff\",\r\n};\r\n\r\nexport const LIGHT_PALETTE: ProtonPalette = {\r\n  BASE_COLOR: BACKGROUNDS.WHITE,\r\n  BRAND,\r\n  GRAYSCALE: LIGHT_GRAYSCALE,\r\n  PRIMARY: BRAND_PRIMARY_SCALE,\r\n  SECONDARY: LIGHT_SECONDARY_SCALE,\r\n};\r\n"],"names":["LIGHT_GRAY","BORDER","ELEVATION","LIGHT_GRAYSCALE","LIGHT_SECONDARY_SCALE","LIGHT_PALETTE","BACKGROUNDS","BRAND","BRAND_PRIMARY_SCALE"],"mappings":"qDAOMA,EAAa,UACNC,EAASD,EACTE,EAAY,UACZC,EAAoC,CAC/C,WAAY,UACZ,KAAM,UACN,OAAQ,UACR,aAAc,UACd,MAAOH,EACP,SAAU,UACV,YAAaE,EACb,MAAO,SACT,EAEaE,EAA0C,CACrD,WAAY,UACZ,KAAM,UACN,OAAQ,UACR,aAAc,UACd,MAAO,UACP,SAAU,UACV,YAAa,UACb,MAAO,SACT,EAEaC,EAA+B,CAC1C,WAAYC,EAAY,YAAA,MAAA,MACxBC,EAAA,MACA,UAAWJ,EACX,QAASK,EAAA,oBACT,UAAWJ,CACb"}
+{"version":3,"file":"colors.es.js","sources":["../../../src/design/lightTheme/colors.ts"],"sourcesContent":["import {\r\n  BACKGROUNDS,\r\n  BRAND,\r\n  BRAND_PRIMARY_SCALE,\r\n} from \"../colors\";\r\nimport { ProtonColorScale, ProtonPalette } from \"../types\";\r\n\r\nconst LIGHT_GRAY = \"#DDDDDD\";\r\nexport const BORDER = LIGHT_GRAY;\r\nexport const ELEVATION = \"#F7F8F9\";\r\nexport const LIGHT_GRAYSCALE: ProtonColorScale = {\r\n  SUPER_DARK: \"#141211\",\r\n  DARK: \"#4D4D4D\",\r\n  MEDIUM: \"#7D7D7D\",\r\n  MEDIUM_LIGHT: \"#B1B1B1\",\r\n  LIGHT: LIGHT_GRAY,\r\n  LIGHTEST: \"#F0F1F2\",\r\n  SUPER_LIGHT: ELEVATION,\r\n  WHITE: \"#FFFFFF\",\r\n};\r\n\r\nexport const LIGHT_SECONDARY_SCALE: ProtonColorScale = {\r\n  SUPER_DARK: \"#032026\",\r\n  DARK: \"#084657\",\r\n  MEDIUM: \"#2085BA\",\r\n  MEDIUM_LIGHT: \"#44A8EB\",\r\n  LIGHT: \"#70B9F6\",\r\n  LIGHTEST: \"#9DCBFC\",\r\n  SUPER_LIGHT: \"#C8DFFF\",\r\n  WHITE: \"#f5f9ff\",\r\n};\r\n\r\nexport const LIGHT_PALETTE: ProtonPalette = {\r\n  BASE_COLOR: BACKGROUNDS.WHITE,\r\n  BRAND,\r\n  GRAYSCALE: LIGHT_GRAYSCALE,\r\n  PRIMARY: BRAND_PRIMARY_SCALE,\r\n  SECONDARY: LIGHT_SECONDARY_SCALE,\r\n};\r\n"],"names":["LIGHT_GRAY","BORDER","ELEVATION","LIGHT_GRAYSCALE","LIGHT_SECONDARY_SCALE","LIGHT_PALETTE","BACKGROUNDS","BRAND","BRAND_PRIMARY_SCALE"],"mappings":";AAOA,MAAMA,IAAa,WACNC,IAASD,GACTE,IAAY,WACZC,IAAoC;AAAA,EAC/C,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,OAAOH;AAAA,EACP,UAAU;AAAA,EACV,aAAaE;AAAA,EACb,OAAO;AACT,GAEaE,IAA0C;AAAA,EACrD,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,OAAO;AAAA,EACP,UAAU;AAAA,EACV,aAAa;AAAA,EACb,OAAO;AACT,GAEaC,IAA+B;AAAA,EAC1C,YAAYC,EAAY;AAAA,EACxB,OAAAC;AAAA,EACA,WAAWJ;AAAA,EACX,SAASK;AAAA,EACT,WAAWJ;AACb;"}

package/dist/design/lightTheme/stylesheet.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("../../utils/color2k.cjs.js"),o=require("../colors.cjs.js"),r=require("./colors.cjs.js"),t={"--proton-control__background-color":o.BACKGROUNDS.WHITE,"--proton-control__background-color-light":r.ELEVATION,"--proton-control__text-color":r.LIGHT_GRAYSCALE.DARK,"--proton-control__title-color":r.LIGHT_GRAYSCALE.SUPER_DARK,"--proton-control__border-color":r.BORDER,"--proton-control__hover-color":r.LIGHT_GRAYSCALE.SUPER_LIGHT,"--proton-control__shadow-color":_.transparentize(r.LIGHT_GRAYSCALE.SUPER_DARK,.9),"--proton-control__border-radius":"4px","--proton-control__interactive-color":o.BRAND.PRIMARY_LIGHT,"--proton-color__primary":o.BRAND.PRIMARY,"--proton-color__primary-light":o.BRAND.PRIMARY_LIGHT,"--proton-color__primary-super-light":o.BRAND.PRIMARY_SUPER_LIGHT,"--proton-color__secondary":o.BRAND.SECONDARY,"--proton-color__secondary-light":o.BRAND.SECONDARY_LIGHT,"--proton-color__secondary-super-light":o.BRAND.SECONDARY_SUPER_LIGHT,"--proton-color__danger-super-dark":o.DANGER.SUPER_DARK,"--proton-color__danger-dark":o.DANGER.DARK,"--proton-color__danger-medium":o.DANGER.MEDIUM,"--proton-color__danger-light":o.DANGER.LIGHT,"--proton-color__danger-super-light":o.DANGER.SUPER_LIGHT,"--proton-color__warning-dark":o.WARNING.DARK,"--proton-color__warning-medium":o.WARNING.MEDIUM,"--proton-color__warning-light":o.WARNING.LIGHT,"--proton-color__warning-super-light":o.WARNING.SUPER_LIGHT,"--proton-color__success-dark":o.SUCCESS.DARK,"--proton-color__success-medium":o.SUCCESS.MEDIUM,"--proton-color__success-light":o.SUCCESS.LIGHT,"--proton-color__success-super-light":o.SUCCESS.SUPER_LIGHT,"--proton-color__gray-super-dark":r.LIGHT_GRAYSCALE.SUPER_DARK,"--proton-color__gray-dark":r.LIGHT_GRAYSCALE.DARK,"--proton-color__gray-medium":r.LIGHT_GRAYSCALE.MEDIUM,"--proton-color__gray-medium-light":r.LIGHT_GRAYSCALE.MEDIUM_LIGHT,"--proton-color__gray-light":r.LIGHT_GRAYSCALE.LIGHT,"--proton-color__gray-lightest":r.LIGHT_GRAYSCALE.LIGHTEST,"--proton-color__gray-super-light":r.LIGHT_GRAYSCALE.SUPER_LIGHT,"--proton-color__white":r.LIGHT_GRAYSCALE.WHITE};exports.LIGHT_STYLESHEET=t;
+//# sourceMappingURL=stylesheet.cjs.js.map

package/dist/design/lightTheme/stylesheet.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stylesheet.cjs.js","sources":["../../../src/design/lightTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\r\nimport { BACKGROUNDS, BRAND, DANGER, WARNING, SUCCESS } from \"../colors\";\r\nimport { ELEVATION, LIGHT_GRAYSCALE } from \"./colors\";\r\nimport { BORDER } from \"./colors\";\r\nimport type { ProtonStyleSheet } from \"../types\";\r\n\r\nexport const LIGHT_STYLESHEET: ProtonStyleSheet = {\r\n  // Control/component colors\r\n  \"--proton-control__background-color\": BACKGROUNDS.WHITE,\r\n  \"--proton-control__background-color-light\": ELEVATION,\r\n  \"--proton-control__text-color\": LIGHT_GRAYSCALE.DARK,\r\n  \"--proton-control__title-color\": LIGHT_GRAYSCALE.SUPER_DARK,\r\n  \"--proton-control__border-color\": BORDER,\r\n  \"--proton-control__hover-color\": LIGHT_GRAYSCALE.SUPER_LIGHT,\r\n  \"--proton-control__shadow-color\": transparentize(\r\n    LIGHT_GRAYSCALE.SUPER_DARK,\r\n    0.9\r\n  ),\r\n  \"--proton-control__border-radius\": \"4px\",\r\n  \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\r\n\r\n  // Brand colors\r\n  \"--proton-color__primary\": BRAND.PRIMARY,\r\n  \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\r\n  \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\r\n  \"--proton-color__secondary\": BRAND.SECONDARY,\r\n  \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\r\n  \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\r\n\r\n  // Semantic colors\r\n  \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\r\n  \"--proton-color__danger-dark\": DANGER.DARK,\r\n  \"--proton-color__danger-medium\": DANGER.MEDIUM,\r\n  \"--proton-color__danger-light\": DANGER.LIGHT,\r\n  \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\r\n  \"--proton-color__warning-dark\": WARNING.DARK,\r\n  \"--proton-color__warning-medium\": WARNING.MEDIUM,\r\n  \"--proton-color__warning-light\": WARNING.LIGHT,\r\n  \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\r\n  \"--proton-color__success-dark\": SUCCESS.DARK,\r\n  \"--proton-color__success-medium\": SUCCESS.MEDIUM,\r\n  \"--proton-color__success-light\": SUCCESS.LIGHT,\r\n  \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\r\n\r\n  // Grayscale colors\r\n  \"--proton-color__gray-super-dark\": LIGHT_GRAYSCALE.SUPER_DARK,\r\n  \"--proton-color__gray-dark\": LIGHT_GRAYSCALE.DARK,\r\n  \"--proton-color__gray-medium\": LIGHT_GRAYSCALE.MEDIUM,\r\n  \"--proton-color__gray-medium-light\": LIGHT_GRAYSCALE.MEDIUM_LIGHT,\r\n  \"--proton-color__gray-light\": LIGHT_GRAYSCALE.LIGHT,\r\n  \"--proton-color__gray-lightest\": LIGHT_GRAYSCALE.LIGHTEST,\r\n  \"--proton-color__gray-super-light\": LIGHT_GRAYSCALE.SUPER_LIGHT,\r\n  \"--proton-color__white\": LIGHT_GRAYSCALE.WHITE,\r\n};\r\n"],"names":["LIGHT_STYLESHEET","BACKGROUNDS","ELEVATION","LIGHT_GRAYSCALE","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":"yLAMaA,EAAqC,CAEhD,qCAAsCC,EAAY,YAAA,MAClD,2CAA4CC,EAAA,UAC5C,+BAAgCC,EAAgB,gBAAA,KAChD,gCAAiCA,EAAgB,gBAAA,WACjD,iCAAkCC,EAAA,OAClC,gCAAiCD,EAAgB,gBAAA,YACjD,iCAAkCE,EAAA,eAChCF,EAAAA,gBAAgB,WAChB,EACF,EACA,kCAAmC,MACnC,sCAAuCG,EAAM,MAAA,cAG7C,0BAA2BA,EAAM,MAAA,QACjC,gCAAiCA,EAAM,MAAA,cACvC,sCAAuCA,EAAM,MAAA,oBAC7C,4BAA6BA,EAAM,MAAA,UACnC,kCAAmCA,EAAM,MAAA,gBACzC,wCAAyCA,EAAM,MAAA,sBAG/C,oCAAqCC,EAAO,OAAA,WAC5C,8BAA+BA,EAAO,OAAA,KACtC,gCAAiCA,EAAO,OAAA,OACxC,+BAAgCA,EAAO,OAAA,MACvC,qCAAsCA,EAAO,OAAA,YAC7C,+BAAgCC,EAAQ,QAAA,KACxC,iCAAkCA,EAAQ,QAAA,OAC1C,gCAAiCA,EAAQ,QAAA,MACzC,sCAAuCA,EAAQ,QAAA,YAC/C,+BAAgCC,EAAQ,QAAA,KACxC,iCAAkCA,EAAQ,QAAA,OAC1C,gCAAiCA,EAAQ,QAAA,MACzC,sCAAuCA,EAAQ,QAAA,YAG/C,kCAAmCN,EAAgB,gBAAA,WACnD,4BAA6BA,EAAgB,gBAAA,KAC7C,8BAA+BA,EAAgB,gBAAA,OAC/C,oCAAqCA,EAAgB,gBAAA,aACrD,6BAA8BA,EAAgB,gBAAA,MAC9C,gCAAiCA,EAAgB,gBAAA,SACjD,mCAAoCA,EAAgB,gBAAA,YACpD,wBAAyBA,EAAgB,gBAAA,KAC3C"}

package/dist/{light.es.js → design/lightTheme/stylesheet.es.js}

@@ -1,16 +1,15 @@
-import { E as l, a as o, B as c } from "./colors-DMkDnu4U.mjs";
-import { L as g, b as T } from "./colors-DMkDnu4U.mjs";
-import { t as p } from "./color2k-CpDB_dpw.mjs";
-import { B as a, a as r, D as _, W as t, S as n } from "./colors-CWaj9dFz.mjs";
-const e = {
+import { transparentize as l } from "../../utils/color2k.es.js";
+import { BACKGROUNDS as c, BRAND as r, DANGER as _, WARNING as t, SUCCESS as n } from "../colors.es.js";
+import { ELEVATION as p, LIGHT_GRAYSCALE as o, BORDER as R } from "./colors.es.js";
+const g = {
   // Control/component colors
-  "--proton-control__background-color": a.WHITE,
-  "--proton-control__background-color-light": l,
+  "--proton-control__background-color": c.WHITE,
+  "--proton-control__background-color-light": p,
   "--proton-control__text-color": o.DARK,
   "--proton-control__title-color": o.SUPER_DARK,
-  "--proton-control__border-color": c,
+  "--proton-control__border-color": R,
   "--proton-control__hover-color": o.SUPER_LIGHT,
-  "--proton-control__shadow-color": p(
+  "--proton-control__shadow-color": l(
     o.SUPER_DARK,
     0.9
   ),
@@ -48,11 +47,6 @@ const e = {
   "--proton-color__white": o.WHITE
 };
 export {
-  c as LIGHT_BORDER,
-  l as LIGHT_ELEVATION,
-  o as LIGHT_GRAYSCALE,
-  g as LIGHT_PALETTE,
-  T as LIGHT_SECONDARY_SCALE,
-  e as LIGHT_STYLESHEET
+  g as LIGHT_STYLESHEET
 };
-//# sourceMappingURL=light.es.js.map
+//# sourceMappingURL=stylesheet.es.js.map

package/dist/design/lightTheme/stylesheet.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stylesheet.es.js","sources":["../../../src/design/lightTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\r\nimport { BACKGROUNDS, BRAND, DANGER, WARNING, SUCCESS } from \"../colors\";\r\nimport { ELEVATION, LIGHT_GRAYSCALE } from \"./colors\";\r\nimport { BORDER } from \"./colors\";\r\nimport type { ProtonStyleSheet } from \"../types\";\r\n\r\nexport const LIGHT_STYLESHEET: ProtonStyleSheet = {\r\n  // Control/component colors\r\n  \"--proton-control__background-color\": BACKGROUNDS.WHITE,\r\n  \"--proton-control__background-color-light\": ELEVATION,\r\n  \"--proton-control__text-color\": LIGHT_GRAYSCALE.DARK,\r\n  \"--proton-control__title-color\": LIGHT_GRAYSCALE.SUPER_DARK,\r\n  \"--proton-control__border-color\": BORDER,\r\n  \"--proton-control__hover-color\": LIGHT_GRAYSCALE.SUPER_LIGHT,\r\n  \"--proton-control__shadow-color\": transparentize(\r\n    LIGHT_GRAYSCALE.SUPER_DARK,\r\n    0.9\r\n  ),\r\n  \"--proton-control__border-radius\": \"4px\",\r\n  \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\r\n\r\n  // Brand colors\r\n  \"--proton-color__primary\": BRAND.PRIMARY,\r\n  \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\r\n  \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\r\n  \"--proton-color__secondary\": BRAND.SECONDARY,\r\n  \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\r\n  \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\r\n\r\n  // Semantic colors\r\n  \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\r\n  \"--proton-color__danger-dark\": DANGER.DARK,\r\n  \"--proton-color__danger-medium\": DANGER.MEDIUM,\r\n  \"--proton-color__danger-light\": DANGER.LIGHT,\r\n  \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\r\n  \"--proton-color__warning-dark\": WARNING.DARK,\r\n  \"--proton-color__warning-medium\": WARNING.MEDIUM,\r\n  \"--proton-color__warning-light\": WARNING.LIGHT,\r\n  \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\r\n  \"--proton-color__success-dark\": SUCCESS.DARK,\r\n  \"--proton-color__success-medium\": SUCCESS.MEDIUM,\r\n  \"--proton-color__success-light\": SUCCESS.LIGHT,\r\n  \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\r\n\r\n  // Grayscale colors\r\n  \"--proton-color__gray-super-dark\": LIGHT_GRAYSCALE.SUPER_DARK,\r\n  \"--proton-color__gray-dark\": LIGHT_GRAYSCALE.DARK,\r\n  \"--proton-color__gray-medium\": LIGHT_GRAYSCALE.MEDIUM,\r\n  \"--proton-color__gray-medium-light\": LIGHT_GRAYSCALE.MEDIUM_LIGHT,\r\n  \"--proton-color__gray-light\": LIGHT_GRAYSCALE.LIGHT,\r\n  \"--proton-color__gray-lightest\": LIGHT_GRAYSCALE.LIGHTEST,\r\n  \"--proton-color__gray-super-light\": LIGHT_GRAYSCALE.SUPER_LIGHT,\r\n  \"--proton-color__white\": LIGHT_GRAYSCALE.WHITE,\r\n};\r\n"],"names":["LIGHT_STYLESHEET","BACKGROUNDS","ELEVATION","LIGHT_GRAYSCALE","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":";;;AAMO,MAAMA,IAAqC;AAAA;AAAA,EAEhD,sCAAsCC,EAAY;AAAA,EAClD,4CAA4CC;AAAA,EAC5C,gCAAgCC,EAAgB;AAAA,EAChD,iCAAiCA,EAAgB;AAAA,EACjD,kCAAkCC;AAAA,EAClC,iCAAiCD,EAAgB;AAAA,EACjD,kCAAkCE;AAAA,IAChCF,EAAgB;AAAA,IAChB;AAAA,EACF;AAAA,EACA,mCAAmC;AAAA,EACnC,uCAAuCG,EAAM;AAAA;AAAA,EAG7C,2BAA2BA,EAAM;AAAA,EACjC,iCAAiCA,EAAM;AAAA,EACvC,uCAAuCA,EAAM;AAAA,EAC7C,6BAA6BA,EAAM;AAAA,EACnC,mCAAmCA,EAAM;AAAA,EACzC,yCAAyCA,EAAM;AAAA;AAAA,EAG/C,qCAAqCC,EAAO;AAAA,EAC5C,+BAA+BA,EAAO;AAAA,EACtC,iCAAiCA,EAAO;AAAA,EACxC,gCAAgCA,EAAO;AAAA,EACvC,sCAAsCA,EAAO;AAAA,EAC7C,gCAAgCC,EAAQ;AAAA,EACxC,kCAAkCA,EAAQ;AAAA,EAC1C,iCAAiCA,EAAQ;AAAA,EACzC,uCAAuCA,EAAQ;AAAA,EAC/C,gCAAgCC,EAAQ;AAAA,EACxC,kCAAkCA,EAAQ;AAAA,EAC1C,iCAAiCA,EAAQ;AAAA,EACzC,uCAAuCA,EAAQ;AAAA;AAAA,EAG/C,mCAAmCN,EAAgB;AAAA,EACnD,6BAA6BA,EAAgB;AAAA,EAC7C,+BAA+BA,EAAgB;AAAA,EAC/C,qCAAqCA,EAAgB;AAAA,EACrD,8BAA8BA,EAAgB;AAAA,EAC9C,iCAAiCA,EAAgB;AAAA,EACjD,oCAAoCA,EAAgB;AAAA,EACpD,yBAAyBA,EAAgB;AAC3C;"}

package/dist/design/lightTheme.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const E=require("./lightTheme/colors.cjs.js"),T=require("./lightTheme/stylesheet.cjs.js");exports.LIGHT_BORDER=E.BORDER;exports.LIGHT_ELEVATION=E.ELEVATION;exports.LIGHT_GRAYSCALE=E.LIGHT_GRAYSCALE;exports.LIGHT_PALETTE=E.LIGHT_PALETTE;exports.LIGHT_SECONDARY_SCALE=E.LIGHT_SECONDARY_SCALE;exports.LIGHT_STYLESHEET=T.LIGHT_STYLESHEET;
+//# sourceMappingURL=lightTheme.cjs.js.map

package/dist/design/lightTheme.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lightTheme.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/design/lightTheme.d.ts

@@ -0,0 +1,2 @@
+export * from '../src/design/lightTheme/index'
+export {}

package/dist/design/lightTheme.es.js

@@ -0,0 +1,11 @@
+import { BORDER as T, ELEVATION as I, LIGHT_GRAYSCALE as A, LIGHT_PALETTE as G, LIGHT_SECONDARY_SCALE as H } from "./lightTheme/colors.es.js";
+import { LIGHT_STYLESHEET as R } from "./lightTheme/stylesheet.es.js";
+export {
+  T as LIGHT_BORDER,
+  I as LIGHT_ELEVATION,
+  A as LIGHT_GRAYSCALE,
+  G as LIGHT_PALETTE,
+  H as LIGHT_SECONDARY_SCALE,
+  R as LIGHT_STYLESHEET
+};
+//# sourceMappingURL=lightTheme.es.js.map

package/dist/design/lightTheme.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lightTheme.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/design/theme.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t={DARK:"dark",LIGHT:"light"},e={[t.DARK]:"proton-ui__theme--dark",[t.LIGHT]:"proton-ui__theme--light"};exports.THEMES=t;exports.THEME_CLASSES=e;
+//# sourceMappingURL=theme.cjs.js.map

package/dist/design/theme.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.cjs.js","sources":["../../src/design/theme.ts"],"sourcesContent":["export const THEMES = {\r\n  DARK: \"dark\",\r\n  LIGHT: \"light\",\r\n} as const;\r\n\r\nexport const THEME_CLASSES = {\r\n  [THEMES.DARK]: \"proton-ui__theme--dark\",\r\n  [THEMES.LIGHT]: \"proton-ui__theme--light\",\r\n};"],"names":["THEMES","THEME_CLASSES"],"mappings":"gFAAO,MAAMA,EAAS,CACpB,KAAM,OACN,MAAO,OACT,EAEaC,EAAgB,CAC3B,CAACD,EAAO,IAAI,EAAG,yBACf,CAACA,EAAO,KAAK,EAAG,yBAClB"}

package/dist/design/theme.es.js

@@ -0,0 +1,12 @@
+const t = {
+  DARK: "dark",
+  LIGHT: "light"
+}, o = {
+  [t.DARK]: "proton-ui__theme--dark",
+  [t.LIGHT]: "proton-ui__theme--light"
+};
+export {
+  t as THEMES,
+  o as THEME_CLASSES
+};
+//# sourceMappingURL=theme.es.js.map

package/dist/design/theme.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.es.js","sources":["../../src/design/theme.ts"],"sourcesContent":["export const THEMES = {\r\n  DARK: \"dark\",\r\n  LIGHT: \"light\",\r\n} as const;\r\n\r\nexport const THEME_CLASSES = {\r\n  [THEMES.DARK]: \"proton-ui__theme--dark\",\r\n  [THEMES.LIGHT]: \"proton-ui__theme--light\",\r\n};"],"names":["THEMES","THEME_CLASSES"],"mappings":"AAAO,MAAMA,IAAS;AAAA,EACpB,MAAM;AAAA,EACN,OAAO;AACT,GAEaC,IAAgB;AAAA,EAC3B,CAACD,EAAO,IAAI,GAAG;AAAA,EACf,CAACA,EAAO,KAAK,GAAG;AAClB;"}

package/dist/design.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("./design/colors.cjs.js"),A=require("./design/theme.cjs.js");exports.BACKGROUNDS=S.BACKGROUNDS;exports.BRAND=S.BRAND;exports.BRAND_PRIMARY_SCALE=S.BRAND_PRIMARY_SCALE;exports.DANGER=S.DANGER;exports.SUCCESS=S.SUCCESS;exports.WARNING=S.WARNING;exports.THEMES=A.THEMES;exports.THEME_CLASSES=A.THEME_CLASSES;
+//# sourceMappingURL=design.cjs.js.map

package/dist/design.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"design.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/design.es.js

@@ -0,0 +1,13 @@
+import { BACKGROUNDS as E, BRAND as R, BRAND_PRIMARY_SCALE as N, DANGER as C, SUCCESS as o, WARNING as r } from "./design/colors.es.js";
+import { THEMES as B, THEME_CLASSES as G } from "./design/theme.es.js";
+export {
+  E as BACKGROUNDS,
+  R as BRAND,
+  N as BRAND_PRIMARY_SCALE,
+  C as DANGER,
+  o as SUCCESS,
+  B as THEMES,
+  G as THEME_CLASSES,
+  r as WARNING
+};
+//# sourceMappingURL=design.es.js.map

package/dist/design.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"design.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/hooks/useBreakpoint.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react");function c(t,i="down"){const e=i==="down"?`(max-width: ${t}px)`:`(min-width: ${t}px)`,[o,r]=d.useState(()=>typeof window<"u"?window.matchMedia(e).matches:!1);return d.useEffect(()=>{if(typeof window>"u")return;const n=window.matchMedia(e),a=s=>{r(s.matches)};return n.addEventListener("change",a),()=>n.removeEventListener("change",a)},[e]),o}exports.useBreakpoint=c;
+//# sourceMappingURL=useBreakpoint.cjs.js.map

package/dist/hooks/useBreakpoint.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBreakpoint.cjs.js","sources":["../../src/hooks/useBreakpoint.tsx"],"sourcesContent":["import { useState } from \"react\";\r\n\r\nimport { useEffect } from \"react\";\r\nimport { Breakpoint } from \"../constants\";\r\n\r\ntype BreakpointDirection = \"up\" | \"down\";\r\n\r\nexport function useBreakpoint(\r\n  breakpoint: Breakpoint,\r\n  direction: BreakpointDirection = \"down\"\r\n) {\r\n  const query =\r\n    direction === \"down\"\r\n      ? `(max-width: ${breakpoint}px)`\r\n      : `(min-width: ${breakpoint}px)`;\r\n\r\n  const [matches, setMatches] = useState(() =>\r\n    typeof window !== \"undefined\" ? window.matchMedia(query).matches : false\r\n  );\r\n\r\n  useEffect(() => {\r\n    if (typeof window === \"undefined\") return;\r\n\r\n    const mediaQuery = window.matchMedia(query);\r\n    const handler = (event: MediaQueryListEvent) => {\r\n      setMatches(event.matches);\r\n    };\r\n\r\n    mediaQuery.addEventListener(\"change\", handler);\r\n    return () => mediaQuery.removeEventListener(\"change\", handler);\r\n  }, [query]);\r\n\r\n  return matches;\r\n}\r\n"],"names":["useBreakpoint","breakpoint","direction","query","matches","setMatches","useState","useEffect","mediaQuery","handler","event"],"mappings":"yGAOgB,SAAAA,EACdC,EACAC,EAAiC,OACjC,CACA,MAAMC,EACJD,IAAc,OACV,eAAeD,CAAU,MACzB,eAAeA,CAAU,MAEzB,CAACG,EAASC,CAAU,EAAIC,EAAA,SAAS,IACrC,OAAO,OAAW,IAAc,OAAO,WAAWH,CAAK,EAAE,QAAU,EAAA,EAGrEI,OAAAA,EAAAA,UAAU,IAAM,CACV,GAAA,OAAO,OAAW,IAAa,OAE7B,MAAAC,EAAa,OAAO,WAAWL,CAAK,EACpCM,EAAWC,GAA+B,CAC9CL,EAAWK,EAAM,OAAO,CAAA,EAGf,OAAAF,EAAA,iBAAiB,SAAUC,CAAO,EACtC,IAAMD,EAAW,oBAAoB,SAAUC,CAAO,CAAA,EAC5D,CAACN,CAAK,CAAC,EAEHC,CACT"}

package/dist/hooks/useBreakpoint.es.js

@@ -0,0 +1,17 @@
+import { useState as s, useEffect as c } from "react";
+function h(t, i = "down") {
+  const e = i === "down" ? `(max-width: ${t}px)` : `(min-width: ${t}px)`, [o, a] = s(
+    () => typeof window < "u" ? window.matchMedia(e).matches : !1
+  );
+  return c(() => {
+    if (typeof window > "u") return;
+    const n = window.matchMedia(e), d = (r) => {
+      a(r.matches);
+    };
+    return n.addEventListener("change", d), () => n.removeEventListener("change", d);
+  }, [e]), o;
+}
+export {
+  h as useBreakpoint
+};
+//# sourceMappingURL=useBreakpoint.es.js.map

package/dist/hooks/useBreakpoint.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBreakpoint.es.js","sources":["../../src/hooks/useBreakpoint.tsx"],"sourcesContent":["import { useState } from \"react\";\r\n\r\nimport { useEffect } from \"react\";\r\nimport { Breakpoint } from \"../constants\";\r\n\r\ntype BreakpointDirection = \"up\" | \"down\";\r\n\r\nexport function useBreakpoint(\r\n  breakpoint: Breakpoint,\r\n  direction: BreakpointDirection = \"down\"\r\n) {\r\n  const query =\r\n    direction === \"down\"\r\n      ? `(max-width: ${breakpoint}px)`\r\n      : `(min-width: ${breakpoint}px)`;\r\n\r\n  const [matches, setMatches] = useState(() =>\r\n    typeof window !== \"undefined\" ? window.matchMedia(query).matches : false\r\n  );\r\n\r\n  useEffect(() => {\r\n    if (typeof window === \"undefined\") return;\r\n\r\n    const mediaQuery = window.matchMedia(query);\r\n    const handler = (event: MediaQueryListEvent) => {\r\n      setMatches(event.matches);\r\n    };\r\n\r\n    mediaQuery.addEventListener(\"change\", handler);\r\n    return () => mediaQuery.removeEventListener(\"change\", handler);\r\n  }, [query]);\r\n\r\n  return matches;\r\n}\r\n"],"names":["useBreakpoint","breakpoint","direction","query","matches","setMatches","useState","useEffect","mediaQuery","handler","event"],"mappings":";AAOgB,SAAAA,EACdC,GACAC,IAAiC,QACjC;AACA,QAAMC,IACJD,MAAc,SACV,eAAeD,CAAU,QACzB,eAAeA,CAAU,OAEzB,CAACG,GAASC,CAAU,IAAIC;AAAA,IAAS,MACrC,OAAO,SAAW,MAAc,OAAO,WAAWH,CAAK,EAAE,UAAU;AAAA,EAAA;AAGrE,SAAAI,EAAU,MAAM;AACV,QAAA,OAAO,SAAW,IAAa;AAE7B,UAAAC,IAAa,OAAO,WAAWL,CAAK,GACpCM,IAAU,CAACC,MAA+B;AAC9C,MAAAL,EAAWK,EAAM,OAAO;AAAA,IAAA;AAGf,WAAAF,EAAA,iBAAiB,UAAUC,CAAO,GACtC,MAAMD,EAAW,oBAAoB,UAAUC,CAAO;AAAA,EAAA,GAC5D,CAACN,CAAK,CAAC,GAEHC;AACT;"}

package/dist/hooks/useIsClosing.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react");function g({duration:i=200,onClose:t,overlayRef:e}){const[r,c]=s.useState(!1),[u,n]=s.useState(),a=s.useCallback(()=>{if(i<=0){console.warn("useIsClosing: Duration must be positive. Executing onClose immediately."),t==null||t();return}c(!0),e!=null&&e.current&&e.current.classList.add("proton-ScreenOverlay__fade-out");const d=setTimeout(()=>{t==null||t(),c(!1)},i);n(d)},[i,t,e]);return s.useEffect(()=>()=>{u&&clearTimeout(u)},[u]),{isClosing:r,handleClose:a}}exports.useIsClosing=g;
+//# sourceMappingURL=useIsClosing.cjs.js.map

package/dist/hooks/useIsClosing.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsClosing.cjs.js","sources":["../../src/hooks/useIsClosing.tsx"],"sourcesContent":["import { useState, useCallback, RefObject, useEffect } from \"react\";\r\n\r\ninterface UseIsClosingOptions {\r\n  /**\r\n   * Duration of the closing animation in milliseconds\r\n   * @default 200\r\n   */\r\n  duration?: number;\r\n  /**\r\n   * Callback to run after the closing animation completes\r\n   */\r\n  onClose?: () => void;\r\n  /**\r\n   * When passed, the fade-out class will be added to @ScreenOverlay on close\r\n   */\r\n  overlayRef?: RefObject<HTMLElement>;\r\n}\r\n\r\n/**\r\n * Hook to manage the closing animation state of a component\r\n * @interface UseIsClosingOptions\r\n * @returns Object containing isClosing state and handleClose function\r\n */\r\nexport function useIsClosing({\r\n  duration = 200,\r\n  onClose,\r\n  overlayRef,\r\n}: UseIsClosingOptions) {\r\n  const [isClosing, setIsClosing] = useState(false);\r\n  const [timeoutId, setTimeoutId] = useState<number>();\r\n\r\n  const handleClose = useCallback(() => {\r\n    if (duration <= 0) {\r\n      console.warn(\r\n        \"useIsClosing: Duration must be positive. Executing onClose immediately.\"\r\n      );\r\n      onClose?.();\r\n      return;\r\n    }\r\n\r\n    setIsClosing(true);\r\n\r\n    if (overlayRef?.current) {\r\n      overlayRef.current.classList.add(\"proton-ScreenOverlay__fade-out\");\r\n    }\r\n\r\n    const id = setTimeout(() => {\r\n      onClose?.();\r\n      setIsClosing(false);\r\n    }, duration);\r\n\r\n    setTimeoutId(id);\r\n  }, [duration, onClose, overlayRef]);\r\n\r\n  useEffect(() => {\r\n    return () => {\r\n      if (timeoutId) {\r\n        clearTimeout(timeoutId);\r\n      }\r\n    };\r\n  }, [timeoutId]);\r\n\r\n  return {\r\n    isClosing,\r\n    handleClose,\r\n  };\r\n}\r\n"],"names":["useIsClosing","duration","onClose","overlayRef","isClosing","setIsClosing","useState","timeoutId","setTimeoutId","handleClose","useCallback","id","useEffect"],"mappings":"yGAuBO,SAASA,EAAa,CAC3B,SAAAC,EAAW,IACX,QAAAC,EACA,WAAAC,CACF,EAAwB,CACtB,KAAM,CAACC,EAAWC,CAAY,EAAIC,WAAS,EAAK,EAC1C,CAACC,EAAWC,CAAY,EAAIF,EAAiB,SAAA,EAE7CG,EAAcC,EAAAA,YAAY,IAAM,CACpC,GAAIT,GAAY,EAAG,CACT,QAAA,KACN,yEAAA,EAEQC,GAAA,MAAAA,IACV,MACF,CAEAG,EAAa,EAAI,EAEbF,GAAA,MAAAA,EAAY,SACHA,EAAA,QAAQ,UAAU,IAAI,gCAAgC,EAG7D,MAAAQ,EAAK,WAAW,IAAM,CAChBT,GAAA,MAAAA,IACVG,EAAa,EAAK,GACjBJ,CAAQ,EAEXO,EAAaG,CAAE,CACd,EAAA,CAACV,EAAUC,EAASC,CAAU,CAAC,EAElCS,OAAAA,EAAAA,UAAU,IACD,IAAM,CACPL,GACF,aAAaA,CAAS,CACxB,EAED,CAACA,CAAS,CAAC,EAEP,CACL,UAAAH,EACA,YAAAK,CAAA,CAEJ"}

package/dist/hooks/useIsClosing.es.js

@@ -0,0 +1,30 @@
+import { useState as c, useCallback as d, useEffect as g } from "react";
+function f({
+  duration: s = 200,
+  onClose: t,
+  overlayRef: i
+}) {
+  const [r, e] = c(!1), [u, n] = c(), m = d(() => {
+    if (s <= 0) {
+      console.warn(
+        "useIsClosing: Duration must be positive. Executing onClose immediately."
+      ), t == null || t();
+      return;
+    }
+    e(!0), i != null && i.current && i.current.classList.add("proton-ScreenOverlay__fade-out");
+    const a = setTimeout(() => {
+      t == null || t(), e(!1);
+    }, s);
+    n(a);
+  }, [s, t, i]);
+  return g(() => () => {
+    u && clearTimeout(u);
+  }, [u]), {
+    isClosing: r,
+    handleClose: m
+  };
+}
+export {
+  f as useIsClosing
+};
+//# sourceMappingURL=useIsClosing.es.js.map

package/dist/hooks/useIsClosing.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIsClosing.es.js","sources":["../../src/hooks/useIsClosing.tsx"],"sourcesContent":["import { useState, useCallback, RefObject, useEffect } from \"react\";\r\n\r\ninterface UseIsClosingOptions {\r\n  /**\r\n   * Duration of the closing animation in milliseconds\r\n   * @default 200\r\n   */\r\n  duration?: number;\r\n  /**\r\n   * Callback to run after the closing animation completes\r\n   */\r\n  onClose?: () => void;\r\n  /**\r\n   * When passed, the fade-out class will be added to @ScreenOverlay on close\r\n   */\r\n  overlayRef?: RefObject<HTMLElement>;\r\n}\r\n\r\n/**\r\n * Hook to manage the closing animation state of a component\r\n * @interface UseIsClosingOptions\r\n * @returns Object containing isClosing state and handleClose function\r\n */\r\nexport function useIsClosing({\r\n  duration = 200,\r\n  onClose,\r\n  overlayRef,\r\n}: UseIsClosingOptions) {\r\n  const [isClosing, setIsClosing] = useState(false);\r\n  const [timeoutId, setTimeoutId] = useState<number>();\r\n\r\n  const handleClose = useCallback(() => {\r\n    if (duration <= 0) {\r\n      console.warn(\r\n        \"useIsClosing: Duration must be positive. Executing onClose immediately.\"\r\n      );\r\n      onClose?.();\r\n      return;\r\n    }\r\n\r\n    setIsClosing(true);\r\n\r\n    if (overlayRef?.current) {\r\n      overlayRef.current.classList.add(\"proton-ScreenOverlay__fade-out\");\r\n    }\r\n\r\n    const id = setTimeout(() => {\r\n      onClose?.();\r\n      setIsClosing(false);\r\n    }, duration);\r\n\r\n    setTimeoutId(id);\r\n  }, [duration, onClose, overlayRef]);\r\n\r\n  useEffect(() => {\r\n    return () => {\r\n      if (timeoutId) {\r\n        clearTimeout(timeoutId);\r\n      }\r\n    };\r\n  }, [timeoutId]);\r\n\r\n  return {\r\n    isClosing,\r\n    handleClose,\r\n  };\r\n}\r\n"],"names":["useIsClosing","duration","onClose","overlayRef","isClosing","setIsClosing","useState","timeoutId","setTimeoutId","handleClose","useCallback","id","useEffect"],"mappings":";AAuBO,SAASA,EAAa;AAAA,EAC3B,UAAAC,IAAW;AAAA,EACX,SAAAC;AAAA,EACA,YAAAC;AACF,GAAwB;AACtB,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAWC,CAAY,IAAIF,EAAiB,GAE7CG,IAAcC,EAAY,MAAM;AACpC,QAAIT,KAAY,GAAG;AACT,cAAA;AAAA,QACN;AAAA,MAAA,GAEQC,KAAA,QAAAA;AACV;AAAA,IACF;AAEA,IAAAG,EAAa,EAAI,GAEbF,KAAA,QAAAA,EAAY,WACHA,EAAA,QAAQ,UAAU,IAAI,gCAAgC;AAG7D,UAAAQ,IAAK,WAAW,MAAM;AAChB,MAAAT,KAAA,QAAAA,KACVG,EAAa,EAAK;AAAA,OACjBJ,CAAQ;AAEX,IAAAO,EAAaG,CAAE;AAAA,EACd,GAAA,CAACV,GAAUC,GAASC,CAAU,CAAC;AAElC,SAAAS,EAAU,MACD,MAAM;AACX,IAAIL,KACF,aAAaA,CAAS;AAAA,EACxB,GAED,CAACA,CAAS,CAAC,GAEP;AAAA,IACL,WAAAH;AAAA,IACA,aAAAK;AAAA,EAAA;AAEJ;"}

package/dist/hooks/useLockBodyScroll.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react");function r(e=!0){t.useLayoutEffect(()=>{if(!e)return;const o=window.getComputedStyle(document.body).overflow;return document.body.style.overflow="hidden",()=>{document.body.style.overflow=o}},[e])}exports.useLockBodyScroll=r;
+//# sourceMappingURL=useLockBodyScroll.cjs.js.map

package/dist/hooks/useLockBodyScroll.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLockBodyScroll.cjs.js","sources":["../../src/hooks/useLockBodyScroll.tsx"],"sourcesContent":["import { useLayoutEffect } from \"react\";\r\n\r\n/**\r\n * A React hook that prevents body scrolling while a component is mounted.\r\n * Useful for modals, overlays, and other components that should prevent background scrolling.\r\n */\r\nexport function useLockBodyScroll(isActive: boolean = true) {\r\n  useLayoutEffect(() => {\r\n    if (!isActive) return;\r\n\r\n    // Get original body overflow\r\n    const originalStyle = window.getComputedStyle(document.body).overflow;\r\n    // Prevent scrolling on mount\r\n    document.body.style.overflow = \"hidden\";\r\n    // Re-enable scrolling when component unmounts\r\n    return () => {\r\n      document.body.style.overflow = originalStyle;\r\n    };\r\n  }, [isActive]); // Empty array ensures effect is only run on mount and unmount\r\n}\r\n"],"names":["useLockBodyScroll","isActive","useLayoutEffect","originalStyle"],"mappings":"yGAMgB,SAAAA,EAAkBC,EAAoB,GAAM,CAC1DC,EAAAA,gBAAgB,IAAM,CACpB,GAAI,CAACD,EAAU,OAGf,MAAME,EAAgB,OAAO,iBAAiB,SAAS,IAAI,EAAE,SAEpD,gBAAA,KAAK,MAAM,SAAW,SAExB,IAAM,CACF,SAAA,KAAK,MAAM,SAAWA,CAAA,CACjC,EACC,CAACF,CAAQ,CAAC,CACf"}

package/dist/hooks/useLockBodyScroll.es.js

@@ -0,0 +1,14 @@
+import { useLayoutEffect as t } from "react";
+function d(o = !0) {
+  t(() => {
+    if (!o) return;
+    const e = window.getComputedStyle(document.body).overflow;
+    return document.body.style.overflow = "hidden", () => {
+      document.body.style.overflow = e;
+    };
+  }, [o]);
+}
+export {
+  d as useLockBodyScroll
+};
+//# sourceMappingURL=useLockBodyScroll.es.js.map

package/dist/hooks/useLockBodyScroll.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLockBodyScroll.es.js","sources":["../../src/hooks/useLockBodyScroll.tsx"],"sourcesContent":["import { useLayoutEffect } from \"react\";\r\n\r\n/**\r\n * A React hook that prevents body scrolling while a component is mounted.\r\n * Useful for modals, overlays, and other components that should prevent background scrolling.\r\n */\r\nexport function useLockBodyScroll(isActive: boolean = true) {\r\n  useLayoutEffect(() => {\r\n    if (!isActive) return;\r\n\r\n    // Get original body overflow\r\n    const originalStyle = window.getComputedStyle(document.body).overflow;\r\n    // Prevent scrolling on mount\r\n    document.body.style.overflow = \"hidden\";\r\n    // Re-enable scrolling when component unmounts\r\n    return () => {\r\n      document.body.style.overflow = originalStyle;\r\n    };\r\n  }, [isActive]); // Empty array ensures effect is only run on mount and unmount\r\n}\r\n"],"names":["useLockBodyScroll","isActive","useLayoutEffect","originalStyle"],"mappings":";AAMgB,SAAAA,EAAkBC,IAAoB,IAAM;AAC1D,EAAAC,EAAgB,MAAM;AACpB,QAAI,CAACD,EAAU;AAGf,UAAME,IAAgB,OAAO,iBAAiB,SAAS,IAAI,EAAE;AAEpD,oBAAA,KAAK,MAAM,WAAW,UAExB,MAAM;AACF,eAAA,KAAK,MAAM,WAAWA;AAAA,IAAA;AAAA,EACjC,GACC,CAACF,CAAQ,CAAC;AACf;"}

package/dist/hooks/usePalette.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../design/darkTheme/colors.cjs.js"),r=require("../design/lightTheme/colors.cjs.js"),o=require("react"),u=require("../utils/image.cjs.js"),P=require("../utils/palette.cjs.js"),T=require("../design/theme.cjs.js"),E=(e,n)=>{const[a,s]=o.useState(r.LIGHT_PALETTE),l=o.useCallback(async()=>{if(!e)return r.LIGHT_PALETTE;try{const t=await u.getDominantColor(e);return P.generatePalette(t)}catch(t){return console.error("Failed to generate palette:",t),r.LIGHT_PALETTE}},[e]);return o.useEffect(()=>{(async()=>{if(e){const c=await l();s(c);return}if(n===T.THEMES.DARK){s(i.DARK_PALETTE);return}s(r.LIGHT_PALETTE)})()},[e,n,l]),o.useMemo(()=>a,[a])};exports.usePalette=E;
+//# sourceMappingURL=usePalette.cjs.js.map

package/dist/hooks/usePalette.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePalette.cjs.js","sources":["../../src/hooks/usePalette.tsx"],"sourcesContent":["import { THEMES } from \"../design\";\r\nimport { DARK_PALETTE } from \"../design/darkTheme/colors\";\r\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\r\nimport { generatePalette, getDominantColor } from \"../utils\";\r\nimport { ProtonPalette } from \"../design/types\";\r\nimport { useEffect, useState, useCallback, useMemo } from \"react\";\r\n\r\n/**\r\n * Generates a palette based on a background image or theme.\r\n * @param backgroundImage - The URL of the background image to generate a palette from.\r\n * @param theme - The theme to generate a palette for.\r\n * @returns A Palette object containing the generated palette.\r\n */\r\nexport const usePalette = (\r\n  backgroundImage: HTMLImageElement | string | null,\r\n  theme: string\r\n): ProtonPalette => {\r\n  const [palette, setPalette] = useState<ProtonPalette>(LIGHT_PALETTE);\r\n\r\n  const getPalette = useCallback(async () => {\r\n    if (!backgroundImage) return LIGHT_PALETTE;\r\n\r\n    try {\r\n      const baseColor = await getDominantColor(\r\n        backgroundImage as HTMLImageElement & string\r\n      );\r\n      const newPalette = generatePalette(baseColor);\r\n\r\n      return newPalette;\r\n    } catch (error) {\r\n      console.error(\"Failed to generate palette:\", error);\r\n      return LIGHT_PALETTE;\r\n    }\r\n  }, [backgroundImage]);\r\n\r\n  useEffect(() => {\r\n    const fetchPalette = async () => {\r\n      if (backgroundImage) {\r\n        const newPalette = await getPalette();\r\n        setPalette(newPalette);\r\n        return;\r\n      }\r\n\r\n      if (theme === THEMES.DARK) {\r\n        setPalette(DARK_PALETTE);\r\n        return;\r\n      }\r\n\r\n      setPalette(LIGHT_PALETTE);\r\n    };\r\n\r\n    fetchPalette();\r\n  }, [backgroundImage, theme, getPalette]);\r\n\r\n  return useMemo(() => palette, [palette]);\r\n};\r\n"],"names":["usePalette","backgroundImage","theme","palette","setPalette","useState","LIGHT_PALETTE","getPalette","useCallback","baseColor","getDominantColor","generatePalette","error","useEffect","newPalette","THEMES","DARK_PALETTE","useMemo"],"mappings":"oTAaaA,EAAa,CACxBC,EACAC,IACkB,CAClB,KAAM,CAACC,EAASC,CAAU,EAAIC,WAAwBC,EAAa,aAAA,EAE7DC,EAAaC,EAAAA,YAAY,SAAY,CACrC,GAAA,CAACP,EAAwB,OAAAK,gBAEzB,GAAA,CACF,MAAMG,EAAY,MAAMC,EAAA,iBACtBT,CAAA,EAIK,OAFYU,kBAAgBF,CAAS,QAGrCG,EAAO,CACN,eAAA,MAAM,8BAA+BA,CAAK,EAC3CN,eACT,CAAA,EACC,CAACL,CAAe,CAAC,EAEpBY,OAAAA,EAAAA,UAAU,IAAM,EACO,SAAY,CAC/B,GAAIZ,EAAiB,CACb,MAAAa,EAAa,MAAMP,IACzBH,EAAWU,CAAU,EACrB,MACF,CAEI,GAAAZ,IAAUa,SAAO,KAAM,CACzBX,EAAWY,EAAY,YAAA,EACvB,MACF,CAEAZ,EAAWE,EAAa,aAAA,CAAA,IAIzB,EAAA,CAACL,EAAiBC,EAAOK,CAAU,CAAC,EAEhCU,EAAQ,QAAA,IAAMd,EAAS,CAACA,CAAO,CAAC,CACzC"}

package/dist/hooks/usePalette.es.js

@@ -0,0 +1,37 @@
+import { DARK_PALETTE as f } from "../design/darkTheme/colors.es.js";
+import { LIGHT_PALETTE as r } from "../design/lightTheme/colors.es.js";
+import { useState as i, useCallback as c, useEffect as P, useMemo as m } from "react";
+import { getDominantColor as p } from "../utils/image.es.js";
+import { generatePalette as u } from "../utils/palette.es.js";
+import { THEMES as E } from "../design/theme.es.js";
+const L = (t, n) => {
+  const [a, o] = i(r), l = c(async () => {
+    if (!t) return r;
+    try {
+      const e = await p(
+        t
+      );
+      return u(e);
+    } catch (e) {
+      return console.error("Failed to generate palette:", e), r;
+    }
+  }, [t]);
+  return P(() => {
+    (async () => {
+      if (t) {
+        const s = await l();
+        o(s);
+        return;
+      }
+      if (n === E.DARK) {
+        o(f);
+        return;
+      }
+      o(r);
+    })();
+  }, [t, n, l]), m(() => a, [a]);
+};
+export {
+  L as usePalette
+};
+//# sourceMappingURL=usePalette.es.js.map

package/dist/hooks/usePalette.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePalette.es.js","sources":["../../src/hooks/usePalette.tsx"],"sourcesContent":["import { THEMES } from \"../design\";\r\nimport { DARK_PALETTE } from \"../design/darkTheme/colors\";\r\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\r\nimport { generatePalette, getDominantColor } from \"../utils\";\r\nimport { ProtonPalette } from \"../design/types\";\r\nimport { useEffect, useState, useCallback, useMemo } from \"react\";\r\n\r\n/**\r\n * Generates a palette based on a background image or theme.\r\n * @param backgroundImage - The URL of the background image to generate a palette from.\r\n * @param theme - The theme to generate a palette for.\r\n * @returns A Palette object containing the generated palette.\r\n */\r\nexport const usePalette = (\r\n  backgroundImage: HTMLImageElement | string | null,\r\n  theme: string\r\n): ProtonPalette => {\r\n  const [palette, setPalette] = useState<ProtonPalette>(LIGHT_PALETTE);\r\n\r\n  const getPalette = useCallback(async () => {\r\n    if (!backgroundImage) return LIGHT_PALETTE;\r\n\r\n    try {\r\n      const baseColor = await getDominantColor(\r\n        backgroundImage as HTMLImageElement & string\r\n      );\r\n      const newPalette = generatePalette(baseColor);\r\n\r\n      return newPalette;\r\n    } catch (error) {\r\n      console.error(\"Failed to generate palette:\", error);\r\n      return LIGHT_PALETTE;\r\n    }\r\n  }, [backgroundImage]);\r\n\r\n  useEffect(() => {\r\n    const fetchPalette = async () => {\r\n      if (backgroundImage) {\r\n        const newPalette = await getPalette();\r\n        setPalette(newPalette);\r\n        return;\r\n      }\r\n\r\n      if (theme === THEMES.DARK) {\r\n        setPalette(DARK_PALETTE);\r\n        return;\r\n      }\r\n\r\n      setPalette(LIGHT_PALETTE);\r\n    };\r\n\r\n    fetchPalette();\r\n  }, [backgroundImage, theme, getPalette]);\r\n\r\n  return useMemo(() => palette, [palette]);\r\n};\r\n"],"names":["usePalette","backgroundImage","theme","palette","setPalette","useState","LIGHT_PALETTE","getPalette","useCallback","baseColor","getDominantColor","generatePalette","error","useEffect","newPalette","THEMES","DARK_PALETTE","useMemo"],"mappings":";;;;;;AAaa,MAAAA,IAAa,CACxBC,GACAC,MACkB;AAClB,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAwBC,CAAa,GAE7DC,IAAaC,EAAY,YAAY;AACrC,QAAA,CAACP,EAAwB,QAAAK;AAEzB,QAAA;AACF,YAAMG,IAAY,MAAMC;AAAA,QACtBT;AAAA,MAAA;AAIK,aAFYU,EAAgBF,CAAS;AAAA,aAGrCG,GAAO;AACN,qBAAA,MAAM,+BAA+BA,CAAK,GAC3CN;AAAA,IACT;AAAA,EAAA,GACC,CAACL,CAAe,CAAC;AAEpB,SAAAY,EAAU,MAAM;AAgBD,KAfQ,YAAY;AAC/B,UAAIZ,GAAiB;AACb,cAAAa,IAAa,MAAMP;AACzB,QAAAH,EAAWU,CAAU;AACrB;AAAA,MACF;AAEI,UAAAZ,MAAUa,EAAO,MAAM;AACzB,QAAAX,EAAWY,CAAY;AACvB;AAAA,MACF;AAEA,MAAAZ,EAAWE,CAAa;AAAA,IAAA;EAIzB,GAAA,CAACL,GAAiBC,GAAOK,CAAU,CAAC,GAEhCU,EAAQ,MAAMd,GAAS,CAACA,CAAO,CAAC;AACzC;"}

package/dist/hooks.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./useBreakpoint-DA-JqOu3.js"),P=require("./colors-CebzFjpe.js"),r=require("./colors-DL1dYffC.js"),o=require("react"),i=require("./image-CUSfY1_T.js"),T=require("./theme.cjs.js"),E=(e,l)=>{const[a,s]=o.useState(r.LIGHT_PALETTE),c=o.useCallback(async()=>{if(!e)return r.LIGHT_PALETTE;try{const t=await i.getDominantColor(e);return i.generatePalette(t)}catch(t){return console.error("Failed to generate palette:",t),r.LIGHT_PALETTE}},[e]);return o.useEffect(()=>{(async()=>{if(e){const u=await c();s(u);return}if(l===T.THEMES.DARK){s(P.DARK_PALETTE);return}s(r.LIGHT_PALETTE)})()},[e,l,c]),o.useMemo(()=>a,[a])};exports.useBreakpoint=n.useBreakpoint;exports.useIsClosing=n.useIsClosing;exports.useLockBodyScroll=n.useLockBodyScroll;exports.usePalette=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./hooks/useLockBodyScroll.cjs.js"),s=require("./hooks/useIsClosing.cjs.js"),o=require("./hooks/useBreakpoint.cjs.js"),t=require("./hooks/usePalette.cjs.js");exports.useLockBodyScroll=e.useLockBodyScroll;exports.useIsClosing=s.useIsClosing;exports.useBreakpoint=o.useBreakpoint;exports.usePalette=t.usePalette;
 //# sourceMappingURL=hooks.cjs.js.map

package/dist/hooks.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.cjs.js","sources":["../src/hooks/usePalette.tsx"],"sourcesContent":["import { THEMES } from \"../design\";\r\nimport { DARK_PALETTE } from \"../design/darkTheme/colors\";\r\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\r\nimport { generatePalette, getDominantColor } from \"../utils\";\r\nimport { ProtonPalette } from \"../design/types\";\r\nimport { useEffect, useState, useCallback, useMemo } from \"react\";\r\n\r\n/**\r\n * Generates a palette based on a background image or theme.\r\n * @param backgroundImage - The URL of the background image to generate a palette from.\r\n * @param theme - The theme to generate a palette for.\r\n * @returns A Palette object containing the generated palette.\r\n */\r\nexport const usePalette = (\r\n  backgroundImage: HTMLImageElement | string | null,\r\n  theme: string\r\n): ProtonPalette => {\r\n  const [palette, setPalette] = useState<ProtonPalette>(LIGHT_PALETTE);\r\n\r\n  const getPalette = useCallback(async () => {\r\n    if (!backgroundImage) return LIGHT_PALETTE;\r\n\r\n    try {\r\n      const baseColor = await getDominantColor(\r\n        backgroundImage as HTMLImageElement & string\r\n      );\r\n      const newPalette = generatePalette(baseColor);\r\n\r\n      return newPalette;\r\n    } catch (error) {\r\n      console.error(\"Failed to generate palette:\", error);\r\n      return LIGHT_PALETTE;\r\n    }\r\n  }, [backgroundImage]);\r\n\r\n  useEffect(() => {\r\n    const fetchPalette = async () => {\r\n      if (backgroundImage) {\r\n        const newPalette = await getPalette();\r\n        setPalette(newPalette);\r\n        return;\r\n      }\r\n\r\n      if (theme === THEMES.DARK) {\r\n        setPalette(DARK_PALETTE);\r\n        return;\r\n      }\r\n\r\n      setPalette(LIGHT_PALETTE);\r\n    };\r\n\r\n    fetchPalette();\r\n  }, [backgroundImage, theme, getPalette]);\r\n\r\n  return useMemo(() => palette, [palette]);\r\n};\r\n"],"names":["usePalette","backgroundImage","theme","palette","setPalette","useState","LIGHT_PALETTE","getPalette","useCallback","baseColor","getDominantColor","generatePalette","error","useEffect","newPalette","THEMES","DARK_PALETTE","useMemo"],"mappings":"mRAaaA,EAAa,CACxBC,EACAC,IACkB,CAClB,KAAM,CAACC,EAASC,CAAU,EAAIC,WAAwBC,EAAa,aAAA,EAE7DC,EAAaC,EAAAA,YAAY,SAAY,CACrC,GAAA,CAACP,EAAwB,OAAAK,gBAEzB,GAAA,CACF,MAAMG,EAAY,MAAMC,EAAA,iBACtBT,CAAA,EAIK,OAFYU,kBAAgBF,CAAS,QAGrCG,EAAO,CACN,eAAA,MAAM,8BAA+BA,CAAK,EAC3CN,eACT,CAAA,EACC,CAACL,CAAe,CAAC,EAEpBY,OAAAA,EAAAA,UAAU,IAAM,EACO,SAAY,CAC/B,GAAIZ,EAAiB,CACb,MAAAa,EAAa,MAAMP,IACzBH,EAAWU,CAAU,EACrB,MACF,CAEI,GAAAZ,IAAUa,SAAO,KAAM,CACzBX,EAAWY,EAAY,YAAA,EACvB,MACF,CAEAZ,EAAWE,EAAa,aAAA,CAAA,IAIzB,EAAA,CAACL,EAAiBC,EAAOK,CAAU,CAAC,EAEhCU,EAAQ,QAAA,IAAMd,EAAS,CAACA,CAAO,CAAC,CACzC"}
+{"version":3,"file":"hooks.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/hooks.es.js

@@ -1,40 +1,11 @@
-import { b as h, a as x, u as B } from "./useBreakpoint-CjRyGKN-.mjs";
-import { D as c } from "./colors-Ceyo4oCJ.mjs";
-import { L as r } from "./colors-DMkDnu4U.mjs";
-import { useState as i, useCallback as f, useEffect as u, useMemo as P } from "react";
-import { a as p, g as m } from "./image-DFyN0Kd9.mjs";
-import { THEMES as E } from "./theme.es.js";
-const C = (t, s) => {
-  const [a, o] = i(r), n = f(async () => {
-    if (!t) return r;
-    try {
-      const e = await p(
-        t
-      );
-      return m(e);
-    } catch (e) {
-      return console.error("Failed to generate palette:", e), r;
-    }
-  }, [t]);
-  return u(() => {
-    (async () => {
-      if (t) {
-        const l = await n();
-        o(l);
-        return;
-      }
-      if (s === E.DARK) {
-        o(c);
-        return;
-      }
-      o(r);
-    })();
-  }, [t, s, n]), P(() => a, [a]);
-};
+import { useLockBodyScroll as r } from "./hooks/useLockBodyScroll.es.js";
+import { useIsClosing as s } from "./hooks/useIsClosing.es.js";
+import { useBreakpoint as f } from "./hooks/useBreakpoint.es.js";
+import { usePalette as m } from "./hooks/usePalette.es.js";
 export {
-  h as useBreakpoint,
-  x as useIsClosing,
-  B as useLockBodyScroll,
-  C as usePalette
+  f as useBreakpoint,
+  s as useIsClosing,
+  r as useLockBodyScroll,
+  m as usePalette
 };
 //# sourceMappingURL=hooks.es.js.map

package/dist/hooks.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"hooks.es.js","sources":["../src/hooks/usePalette.tsx"],"sourcesContent":["import { THEMES } from \"../design\";\r\nimport { DARK_PALETTE } from \"../design/darkTheme/colors\";\r\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\r\nimport { generatePalette, getDominantColor } from \"../utils\";\r\nimport { ProtonPalette } from \"../design/types\";\r\nimport { useEffect, useState, useCallback, useMemo } from \"react\";\r\n\r\n/**\r\n * Generates a palette based on a background image or theme.\r\n * @param backgroundImage - The URL of the background image to generate a palette from.\r\n * @param theme - The theme to generate a palette for.\r\n * @returns A Palette object containing the generated palette.\r\n */\r\nexport const usePalette = (\r\n  backgroundImage: HTMLImageElement | string | null,\r\n  theme: string\r\n): ProtonPalette => {\r\n  const [palette, setPalette] = useState<ProtonPalette>(LIGHT_PALETTE);\r\n\r\n  const getPalette = useCallback(async () => {\r\n    if (!backgroundImage) return LIGHT_PALETTE;\r\n\r\n    try {\r\n      const baseColor = await getDominantColor(\r\n        backgroundImage as HTMLImageElement & string\r\n      );\r\n      const newPalette = generatePalette(baseColor);\r\n\r\n      return newPalette;\r\n    } catch (error) {\r\n      console.error(\"Failed to generate palette:\", error);\r\n      return LIGHT_PALETTE;\r\n    }\r\n  }, [backgroundImage]);\r\n\r\n  useEffect(() => {\r\n    const fetchPalette = async () => {\r\n      if (backgroundImage) {\r\n        const newPalette = await getPalette();\r\n        setPalette(newPalette);\r\n        return;\r\n      }\r\n\r\n      if (theme === THEMES.DARK) {\r\n        setPalette(DARK_PALETTE);\r\n        return;\r\n      }\r\n\r\n      setPalette(LIGHT_PALETTE);\r\n    };\r\n\r\n    fetchPalette();\r\n  }, [backgroundImage, theme, getPalette]);\r\n\r\n  return useMemo(() => palette, [palette]);\r\n};\r\n"],"names":["usePalette","backgroundImage","theme","palette","setPalette","useState","LIGHT_PALETTE","getPalette","useCallback","baseColor","getDominantColor","generatePalette","error","useEffect","newPalette","THEMES","DARK_PALETTE","useMemo"],"mappings":";;;;;;AAaa,MAAAA,IAAa,CACxBC,GACAC,MACkB;AAClB,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAwBC,CAAa,GAE7DC,IAAaC,EAAY,YAAY;AACrC,QAAA,CAACP,EAAwB,QAAAK;AAEzB,QAAA;AACF,YAAMG,IAAY,MAAMC;AAAA,QACtBT;AAAA,MAAA;AAIK,aAFYU,EAAgBF,CAAS;AAAA,aAGrCG,GAAO;AACN,qBAAA,MAAM,+BAA+BA,CAAK,GAC3CN;AAAA,IACT;AAAA,EAAA,GACC,CAACL,CAAe,CAAC;AAEpB,SAAAY,EAAU,MAAM;AAgBD,KAfQ,YAAY;AAC/B,UAAIZ,GAAiB;AACb,cAAAa,IAAa,MAAMP;AACzB,QAAAH,EAAWU,CAAU;AACrB;AAAA,MACF;AAEI,UAAAZ,MAAUa,EAAO,MAAM;AACzB,QAAAX,EAAWY,CAAY;AACvB;AAAA,MACF;AAEA,MAAAZ,EAAWE,CAAa;AAAA,IAAA;EAIzB,GAAA,CAACL,GAAiBC,GAAOK,CAAU,CAAC,GAEhCU,EAAQ,MAAMd,GAAS,CAACA,CAAO,CAAC;AACzC;"}
+{"version":3,"file":"hooks.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}