@spark-ui/theme-utils 6.2.6 → 6.2.8

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.2.8](https://github.com/adevinta/spark/compare/v6.2.7...v6.2.8) (2024-10-09)
+
+### Bug Fixes
+
+- **theme-utils:** fixed large font size for color contrast check ([2cd41f8](https://github.com/adevinta/spark/commit/2cd41f8198505a8091be2544351e2afe7475b592))
+
+## [6.2.7](https://github.com/adevinta/spark/compare/v6.2.6...v6.2.7) (2024-10-09)
+
+**Note:** Version bump only for package @spark-ui/theme-utils
+
 ## [6.2.6](https://github.com/adevinta/spark/compare/v6.2.5...v6.2.6) (2024-10-08)
 
 **Note:** Version bump only for package @spark-ui/theme-utils

package/dist/contrastCheck.d.ts

@@ -0,0 +1,656 @@
+import { Theme } from './types';
+/**
+ * https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html
+ *
+ * - Normal text  expected ratio: 4.5:1
+ * - Large text (>= 18pt or 14pt with bold font) expected ratio: 3:1
+ *
+ * (1pt = 1.333px, therefore 14pt and 18pt are equivalent to approximately 18.5px and 24px)
+ *
+ *
+ * How to read contrast:
+ *
+ * In the ratio "4.5:1", the 4.5 represents the luminance of the lighter color compared to the darker color, which is 1.
+ * A ratio of 4.5:1 means the lighter color is 4.5 times brighter than the darker color.
+ *
+ * 1:1 – No contrast (the two colors are identical).
+ * 21:1 (maximum contrast, black vs. white).
+ */
+export declare function checkColorContrast(hex1: string, hex2: string, fontSizePx: number): {
+    contrastRatio: string;
+    score: string;
+    textSize: string;
+    colors: [string, string];
+};
+export declare const getThemeContrastReport: (theme: Theme) => {
+    main: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    mainHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    mainContainer: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    mainContainerHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    support: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    supportHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    supportContainer: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    supportContainerHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    accent: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    accentHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    accentContainer: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    accentContainerHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    basic: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    basicHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    basicContainer: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    basicContainerHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    success: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    successHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    successContainer: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    successContainerHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    error: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    errorHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    errorContainer: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    errorContainerHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    alert: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    alertHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    alertContainer: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    alertContainerHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    info: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    infoHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    infoContainer: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    infoContainerHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    neutral: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    neutralHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    neutralContainer: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    neutralContainerHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    background: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    backgroundVariant: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    surface: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    surfaceHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    surfaceInverse: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+    surfaceInverseHovered: {
+        small: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        large: {
+            contrastRatio: string;
+            score: string;
+            textSize: string;
+            colors: [string, string];
+        };
+        previewStyles: string;
+    };
+};

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export { createTheme } from './createTheme';
 export { defaultTheme } from './defaultTheme';
 export { defaultThemeDark } from './defaultThemeDark';
+export { getThemeContrastReport, checkColorContrast } from './contrastCheck';
 export type { Theme, ThemeConfig } from './types';

package/dist/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("deepmerge"),e={borderRadius:{none:"0px",sm:"0.25rem",md:"0.5rem",lg:"1rem",xl:"1.5rem",full:"9999px"},borderWidth:{none:"0px",sm:"1px",md:"2px"},boxShadow:{sm:"0 1px 2px 0 rgba(108 129 157 / 0.50)",DEFAULT:"0 4px 8px 0 rgba(108 129 157 / 0.50)",md:"0 6px 12px 0 rgba(108 129 157 / 0.50)",lg:"0 8px 16px 0 rgba(108 129 157 / 0.50)",xl:"0 12px 24px 0 rgba(108 129 157 / 0.50)",none:"none"},colors:{basic:"#094171",onBasic:"#FFFFFF",basicHovered:"#0C5291",basicContainer:"#E6F2FD",onBasicContainer:"#152233",basicContainerHovered:"#F4F9FE",accent:"#8526D9",onAccent:"#FFFFFF",accentHovered:"#9F47EB",accentContainer:"#E9D6FA",onAccentContainer:"#362555",accentContainerHovered:"#F5EDFD",accentVariant:"#501782",onAccentVariant:"#FFFFFF",accentVariantHovered:"#6B1FAD",main:"#EC5A13",onMain:"#FFFFFF",mainHovered:"#F07B42",mainContainer:"#FFE9DE",onMainContainer:"#89380F",mainContainerHovered:"#FFF2EB",mainVariant:"#B84A14",onMainVariant:"#FFFFFF",mainVariantHovered:"#EC5A13",support:"#094171",onSupport:"#FFFFFF",supportHovered:"#0C5291",supportContainer:"#E6F2FD",onSupportContainer:"#152233",supportContainerHovered:"#F4F9FE",supportVariant:"#0C5291",onSupportVariant:"#FFFFFF",supportVariantHovered:"#0F69B9",success:"#3E7A40",onSuccess:"#FFFFFF",successHovered:"#4E9850",successContainer:"#DCEADC",onSuccessContainer:"#2F5B30",successContainerHovered:"#EDF5EE",alert:"#FFAA00",onAlert:"#202730",alertHovered:"#FFBB33",alertContainer:"#FFEECC",onAlertContainer:"#996600",alertContainerHovered:"#FFF6E5",error:"#D93426",onError:"#FFFFFF",errorHovered:"#E05D52",errorContainer:"#F7D7D4",onErrorContainer:"#822017",errorContainerHovered:"#FBECEB",info:"#1388EC",onInfo:"#FFFFFF",infoHovered:"#69B2F3",infoContainer:"#C2E0FA",onInfoContainer:"#0C5291",infoContainerHovered:"#E6F2FD",neutral:"#4F6076",onNeutral:"#FFFFFF",neutralHovered:"#6C819D",neutralContainer:"#F0F2F5",onNeutralContainer:"#3A4757",neutralContainerHovered:"#F6F8F9",background:"#FFFFFF",onBackground:"#152233",backgroundVariant:"#F4F9FE",onBackgroundVariant:"#152233",surface:"#FFFFFF",onSurface:"#152233",surfaceHovered:"#F6F8F9",surfaceInverse:"#2B3441",onSurfaceInverse:"#FFFFFF",surfaceInverseHovered:"#3A4757",outline:"#ACB8C7",outlineHigh:"#202730",overlay:"#202730B8",onOverlay:"#FFFFFF"},fontFamily:{sans:'"Nunito Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"',mono:'SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace'},fontSize:{display1:{fontSize:"2.5rem",lineHeight:"3.5rem",fontWeight:"700"},display1Expanded:{fontSize:"3rem",lineHeight:"4rem",fontWeight:"700"},display2:{fontSize:"2rem",lineHeight:"2.75rem",fontWeight:"700"},display2Expanded:{fontSize:"2.5rem",lineHeight:"3.5rem",fontWeight:"700"},display3:{fontSize:"1.5rem",lineHeight:"2rem",fontWeight:"700"},display3Expanded:{fontSize:"2rem",lineHeight:"2.75rem",fontWeight:"700"},headline1:{fontSize:"1.25rem",lineHeight:"1.75rem",fontWeight:"700"},headline1Expanded:{fontSize:"1.5rem",lineHeight:"2rem",fontWeight:"700"},headline2:{fontSize:"1.125rem",lineHeight:"1.5rem",fontWeight:"700"},headline2Expanded:{fontSize:"1.25rem",lineHeight:"1.75rem",fontWeight:"700"},subhead:{fontSize:"1rem",lineHeight:"1.5rem",fontWeight:"700"},subheadExpanded:{fontSize:"1rem",lineHeight:"1.5rem",fontWeight:"700"},body1:{fontSize:"1rem",lineHeight:"1.5rem"},body2:{fontSize:"0.875rem",lineHeight:"1.25rem"},caption:{fontSize:"0.75rem",lineHeight:"1rem"},small:{fontSize:"0.625rem",lineHeight:"0.875rem"},body1Link:{fontSize:"1rem",lineHeight:"1.5rem"},body2Link:{fontSize:"0.875rem",lineHeight:"1.125rem"},captionLink:{fontSize:"0.75rem",lineHeight:"1rem"},callout:{fontSize:"1rem",lineHeight:"1.5rem"}},fontWeight:{regular:"400",medium:"500",semiBold:"600",bold:"700"},opacity:{0:"0",none:"1",dim1:"0.72",dim2:"0.56",dim3:"0.40",dim4:"0.16",dim5:"0.08"},screens:{sm:"640px",md:"768px",lg:"1024px",xl:"1280px"},spacing:{auto:"auto",none:"0px",sm:"0.25rem",md:"0.5rem",lg:"1rem",xl:"1.5rem","2xl":"2rem","3xl":"2.5rem"},zIndex:{hide:"-1",base:"0",raised:"1",dropdown:"1000",sticky:"1100",overlay:"1300",modal:"1400",popover:"1500",skipLink:"1600",toast:"1700",tooltip:"1800"}};function n(o,r=e){return a(r,o)}const i=n({boxShadow:{sm:"0 1px 2px 0 rgba(0 0 0 / 0.50)",DEFAULT:"0 4px 8px 0 rgba(0 0 0 / 0.50)",md:"0 6px 12px 0 rgba(0 0 0 / 0.50)",lg:"0 8px 16px 0 rgba(0 0 0 / 0.50)",xl:"0 12px 24px 0 rgba(0 0 0 / 0.50)",none:"none"},colors:{basic:"#C2E0FA",onBasic:"#152233",basicHovered:"#9FCEF7",basicContainer:"#094171",onBasicContainer:"#F4F9FE",basicContainerHovered:"#152233",accent:"#CFA3F5",onAccent:"#1B052E",accentHovered:"#AC7DDD",accentContainer:"#501782",onAccentContainer:"#F5EDFD",accentContainerHovered:"#360F57",accentVariant:"#B775F0",onAccentVariant:"#1B052E",accentVariantHovered:"#B775F0",main:"#F07B42",onMain:"#2F1305",mainHovered:"#EC5A13",mainContainer:"#89380F",onMainContainer:"#FFF2EB",mainContainerHovered:"#5C250A",mainVariant:"#F49D71",onMainVariant:"#2F1305",mainVariantHovered:"#F07B42",support:"#C2E0FA",onSupport:"#152233",supportHovered:"#9FCEF7",supportContainer:"#094171",onSupportContainer:"#F4F9FE",supportContainerHovered:"#152233",supportVariant:"#E6F2FD",onSupportVariant:"#152233",supportVariantHovered:"#C2E0FA",success:"#95C196",onSuccess:"#101E10",successHovered:"#71AD73",successContainer:"#2F5B30",onSuccessContainer:"#EDF5EE",successContainerHovered:"#1F3D20",alert:"#FFCC66",onAlert:"#332200",alertHovered:"#FFBB33",alertContainer:"#664400",onAlertContainer:"#FFF6E5",alertContainerHovered:"#332200",error:"#E8867D",onError:"#2B0B08",errorHovered:"#E05D52",errorContainer:"#822017",onErrorContainer:"#FBECEB",errorContainerHovered:"#57150F",info:"#9FCEF7",onInfo:"#152233",infoHovered:"#69B2F3",infoContainer:"#0C5291",onInfoContainer:"#F4F9FE",infoContainerHovered:"#094171",neutral:"#ACB8C7",onNeutral:"#202730",neutralHovered:"#6C819D",neutralContainer:"#3A4757",onNeutralContainer:"#F6F8F9",neutralContainerHovered:"#2B3441",background:"#202730",onBackground:"#F6F8F9",backgroundVariant:"#13171D",onBackgroundVariant:"#F6F8F9",surface:"#202730",onSurface:"#F6F8F9",surfaceHovered:"#000000",surfaceInverse:"#F6F8F9",onSurfaceInverse:"#2B3441",surfaceInverseHovered:"#F0F2F5",outline:"#4F6076",outlineHigh:"#F0F2F5",overlay:"#2B3441B8",onOverlay:"#F6F8F9"}});exports.createTheme=n,exports.defaultTheme=e,exports.defaultThemeDark=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("deepmerge"),F={borderRadius:{none:"0px",sm:"0.25rem",md:"0.5rem",lg:"1rem",xl:"1.5rem",full:"9999px"},borderWidth:{none:"0px",sm:"1px",md:"2px"},boxShadow:{sm:"0 1px 2px 0 rgba(108 129 157 / 0.50)",DEFAULT:"0 4px 8px 0 rgba(108 129 157 / 0.50)",md:"0 6px 12px 0 rgba(108 129 157 / 0.50)",lg:"0 8px 16px 0 rgba(108 129 157 / 0.50)",xl:"0 12px 24px 0 rgba(108 129 157 / 0.50)",none:"none"},colors:{basic:"#094171",onBasic:"#FFFFFF",basicHovered:"#0C5291",basicContainer:"#E6F2FD",onBasicContainer:"#152233",basicContainerHovered:"#F4F9FE",accent:"#8526D9",onAccent:"#FFFFFF",accentHovered:"#9F47EB",accentContainer:"#E9D6FA",onAccentContainer:"#362555",accentContainerHovered:"#F5EDFD",accentVariant:"#501782",onAccentVariant:"#FFFFFF",accentVariantHovered:"#6B1FAD",main:"#EC5A13",onMain:"#FFFFFF",mainHovered:"#F07B42",mainContainer:"#FFE9DE",onMainContainer:"#89380F",mainContainerHovered:"#FFF2EB",mainVariant:"#B84A14",onMainVariant:"#FFFFFF",mainVariantHovered:"#EC5A13",support:"#094171",onSupport:"#FFFFFF",supportHovered:"#0C5291",supportContainer:"#E6F2FD",onSupportContainer:"#152233",supportContainerHovered:"#F4F9FE",supportVariant:"#0C5291",onSupportVariant:"#FFFFFF",supportVariantHovered:"#0F69B9",success:"#3E7A40",onSuccess:"#FFFFFF",successHovered:"#4E9850",successContainer:"#DCEADC",onSuccessContainer:"#2F5B30",successContainerHovered:"#EDF5EE",alert:"#FFAA00",onAlert:"#202730",alertHovered:"#FFBB33",alertContainer:"#FFEECC",onAlertContainer:"#996600",alertContainerHovered:"#FFF6E5",error:"#D93426",onError:"#FFFFFF",errorHovered:"#E05D52",errorContainer:"#F7D7D4",onErrorContainer:"#822017",errorContainerHovered:"#FBECEB",info:"#1388EC",onInfo:"#FFFFFF",infoHovered:"#69B2F3",infoContainer:"#C2E0FA",onInfoContainer:"#0C5291",infoContainerHovered:"#E6F2FD",neutral:"#4F6076",onNeutral:"#FFFFFF",neutralHovered:"#6C819D",neutralContainer:"#F0F2F5",onNeutralContainer:"#3A4757",neutralContainerHovered:"#F6F8F9",background:"#FFFFFF",onBackground:"#152233",backgroundVariant:"#F4F9FE",onBackgroundVariant:"#152233",surface:"#FFFFFF",onSurface:"#152233",surfaceHovered:"#F6F8F9",surfaceInverse:"#2B3441",onSurfaceInverse:"#FFFFFF",surfaceInverseHovered:"#3A4757",outline:"#ACB8C7",outlineHigh:"#202730",overlay:"#202730B8",onOverlay:"#FFFFFF"},fontFamily:{sans:'"Nunito Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"',mono:'SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace'},fontSize:{display1:{fontSize:"2.5rem",lineHeight:"3.5rem",fontWeight:"700"},display1Expanded:{fontSize:"3rem",lineHeight:"4rem",fontWeight:"700"},display2:{fontSize:"2rem",lineHeight:"2.75rem",fontWeight:"700"},display2Expanded:{fontSize:"2.5rem",lineHeight:"3.5rem",fontWeight:"700"},display3:{fontSize:"1.5rem",lineHeight:"2rem",fontWeight:"700"},display3Expanded:{fontSize:"2rem",lineHeight:"2.75rem",fontWeight:"700"},headline1:{fontSize:"1.25rem",lineHeight:"1.75rem",fontWeight:"700"},headline1Expanded:{fontSize:"1.5rem",lineHeight:"2rem",fontWeight:"700"},headline2:{fontSize:"1.125rem",lineHeight:"1.5rem",fontWeight:"700"},headline2Expanded:{fontSize:"1.25rem",lineHeight:"1.75rem",fontWeight:"700"},subhead:{fontSize:"1rem",lineHeight:"1.5rem",fontWeight:"700"},subheadExpanded:{fontSize:"1rem",lineHeight:"1.5rem",fontWeight:"700"},body1:{fontSize:"1rem",lineHeight:"1.5rem"},body2:{fontSize:"0.875rem",lineHeight:"1.25rem"},caption:{fontSize:"0.75rem",lineHeight:"1rem"},small:{fontSize:"0.625rem",lineHeight:"0.875rem"},body1Link:{fontSize:"1rem",lineHeight:"1.5rem"},body2Link:{fontSize:"0.875rem",lineHeight:"1.125rem"},captionLink:{fontSize:"0.75rem",lineHeight:"1rem"},callout:{fontSize:"1rem",lineHeight:"1.5rem"}},fontWeight:{regular:"400",medium:"500",semiBold:"600",bold:"700"},opacity:{0:"0",none:"1",dim1:"0.72",dim2:"0.56",dim3:"0.40",dim4:"0.16",dim5:"0.08"},screens:{sm:"640px",md:"768px",lg:"1024px",xl:"1280px"},spacing:{auto:"auto",none:"0px",sm:"0.25rem",md:"0.5rem",lg:"1rem",xl:"1.5rem","2xl":"2rem","3xl":"2.5rem"},zIndex:{hide:"-1",base:"0",raised:"1",dropdown:"1000",sticky:"1100",overlay:"1300",modal:"1400",popover:"1500",skipLink:"1600",toast:"1700",tooltip:"1800"}};function l(r,e=F){return p(e,r)}const v=l({boxShadow:{sm:"0 1px 2px 0 rgba(0 0 0 / 0.50)",DEFAULT:"0 4px 8px 0 rgba(0 0 0 / 0.50)",md:"0 6px 12px 0 rgba(0 0 0 / 0.50)",lg:"0 8px 16px 0 rgba(0 0 0 / 0.50)",xl:"0 12px 24px 0 rgba(0 0 0 / 0.50)",none:"none"},colors:{basic:"#C2E0FA",onBasic:"#152233",basicHovered:"#9FCEF7",basicContainer:"#094171",onBasicContainer:"#F4F9FE",basicContainerHovered:"#152233",accent:"#CFA3F5",onAccent:"#1B052E",accentHovered:"#AC7DDD",accentContainer:"#501782",onAccentContainer:"#F5EDFD",accentContainerHovered:"#360F57",accentVariant:"#B775F0",onAccentVariant:"#1B052E",accentVariantHovered:"#B775F0",main:"#F07B42",onMain:"#2F1305",mainHovered:"#EC5A13",mainContainer:"#89380F",onMainContainer:"#FFF2EB",mainContainerHovered:"#5C250A",mainVariant:"#F49D71",onMainVariant:"#2F1305",mainVariantHovered:"#F07B42",support:"#C2E0FA",onSupport:"#152233",supportHovered:"#9FCEF7",supportContainer:"#094171",onSupportContainer:"#F4F9FE",supportContainerHovered:"#152233",supportVariant:"#E6F2FD",onSupportVariant:"#152233",supportVariantHovered:"#C2E0FA",success:"#95C196",onSuccess:"#101E10",successHovered:"#71AD73",successContainer:"#2F5B30",onSuccessContainer:"#EDF5EE",successContainerHovered:"#1F3D20",alert:"#FFCC66",onAlert:"#332200",alertHovered:"#FFBB33",alertContainer:"#664400",onAlertContainer:"#FFF6E5",alertContainerHovered:"#332200",error:"#E8867D",onError:"#2B0B08",errorHovered:"#E05D52",errorContainer:"#822017",onErrorContainer:"#FBECEB",errorContainerHovered:"#57150F",info:"#9FCEF7",onInfo:"#152233",infoHovered:"#69B2F3",infoContainer:"#0C5291",onInfoContainer:"#F4F9FE",infoContainerHovered:"#094171",neutral:"#ACB8C7",onNeutral:"#202730",neutralHovered:"#6C819D",neutralContainer:"#3A4757",onNeutralContainer:"#F6F8F9",neutralContainerHovered:"#2B3441",background:"#202730",onBackground:"#F6F8F9",backgroundVariant:"#13171D",onBackgroundVariant:"#F6F8F9",surface:"#202730",onSurface:"#F6F8F9",surfaceHovered:"#000000",surfaceInverse:"#F6F8F9",onSurfaceInverse:"#2B3441",surfaceInverseHovered:"#F0F2F5",outline:"#4F6076",outlineHigh:"#F0F2F5",overlay:"#2B3441B8",onOverlay:"#F6F8F9"}});function c(r){const e=[parseInt(r.slice(1,3),16)/255,parseInt(r.slice(3,5),16)/255,parseInt(r.slice(5,7),16)/255].map(o=>o<=.03928?o/12.92:Math.pow((o+.055)/1.055,2.4));return .2126*e[0]+.7152*e[1]+.0722*e[2]}function C(r,e){const o=e>=24;return r>=7?"AAA":r>=4.5&&!o||r>=3&&o?"AA":"Failed"}function t(r,e,o){const a=function(u,d){const i=c(u),s=c(d);return(Math.max(i,s)+.05)/(Math.min(i,s)+.05)}(r,e);return{contrastRatio:a.toFixed(2),score:C(a,o),textSize:o>=24?"Large":"Small",colors:[r,e]}}const n=(r,e)=>({small:t(r,e,16),large:t(r,e,24)});exports.checkColorContrast=t,exports.createTheme=l,exports.defaultTheme=F,exports.defaultThemeDark=v,exports.getThemeContrastReport=r=>{const{colors:e}=r;return{main:{previewStyles:"bg-main text-on-main",...n(e.main,e.onMain)},mainHovered:{previewStyles:"bg-main-hovered text-on-main",...n(e.mainHovered,e.onMain)},mainContainer:{previewStyles:"bg-main-container text-on-main-container",...n(e.mainContainer,e.onMainContainer)},mainContainerHovered:{previewStyles:"bg-main-container-hovered text-on-main-container",...n(e.mainContainerHovered,e.onMainContainer)},support:{previewStyles:"bg-support text-on-support",...n(e.support,e.onSupport)},supportHovered:{previewStyles:"bg-support-hovered text-on-support",...n(e.supportHovered,e.onSupport)},supportContainer:{previewStyles:"bg-support-container text-on-support-container",...n(e.supportContainer,e.onSupportContainer)},supportContainerHovered:{previewStyles:"bg-support-container-hovered text-on-support-container",...n(e.supportContainerHovered,e.onSupportContainer)},accent:{previewStyles:"bg-accent text-on-accent",...n(e.accent,e.onAccent)},accentHovered:{previewStyles:"bg-accent-hovered text-on-accent",...n(e.accentHovered,e.onAccent)},accentContainer:{previewStyles:"bg-accent-container text-on-accent-container",...n(e.accentContainer,e.onAccentContainer)},accentContainerHovered:{previewStyles:"bg-accent-container-hovered text-on-accent-container",...n(e.accentContainerHovered,e.onAccentContainer)},basic:{previewStyles:"bg-basic text-on-basic",...n(e.basic,e.onBasic)},basicHovered:{previewStyles:"bg-basic-hovered text-on-basic",...n(e.basicHovered,e.onBasic)},basicContainer:{previewStyles:"bg-basic-container text-on-basic-container",...n(e.basicContainer,e.onBasicContainer)},basicContainerHovered:{previewStyles:"bg-basic-container-hovered text-on-basic-container",...n(e.basicContainerHovered,e.onBasicContainer)},success:{previewStyles:"bg-success text-on-success",...n(e.success,e.onSuccess)},successHovered:{previewStyles:"bg-success-hovered text-on-success",...n(e.successHovered,e.onSuccess)},successContainer:{previewStyles:"bg-success-container text-on-success-container",...n(e.successContainer,e.onSuccessContainer)},successContainerHovered:{previewStyles:"bg-success-container-hovered text-on-success-container",...n(e.successContainerHovered,e.onSuccessContainer)},error:{previewStyles:"bg-error text-on-error",...n(e.error,e.onError)},errorHovered:{previewStyles:"bg-error-hovered text-on-error",...n(e.errorHovered,e.onError)},errorContainer:{previewStyles:"bg-error-container text-on-error-container",...n(e.errorContainer,e.onErrorContainer)},errorContainerHovered:{previewStyles:"bg-error-container-hovered text-on-error-container",...n(e.errorContainerHovered,e.onErrorContainer)},alert:{previewStyles:"bg-alert text-on-alert",...n(e.alert,e.onAlert)},alertHovered:{previewStyles:"bg-alert-hovered text-on-alert",...n(e.alertHovered,e.onAlert)},alertContainer:{previewStyles:"bg-alert-container text-on-alert-container",...n(e.alertContainer,e.onAlertContainer)},alertContainerHovered:{previewStyles:"bg-alert-container-hovered text-on-alert-container",...n(e.alertContainerHovered,e.onAlertContainer)},info:{previewStyles:"bg-info text-on-info",...n(e.info,e.onInfo)},infoHovered:{previewStyles:"bg-info-hovered text-on-info",...n(e.infoHovered,e.onInfo)},infoContainer:{previewStyles:"bg-info-container text-on-info-container",...n(e.infoContainer,e.onInfoContainer)},infoContainerHovered:{previewStyles:"bg-info-container-hovered text-on-info-container",...n(e.infoContainerHovered,e.onInfoContainer)},neutral:{previewStyles:"bg-neutral text-on-neutral",...n(e.neutral,e.onNeutral)},neutralHovered:{previewStyles:"bg-neutral-hovered text-on-neutral",...n(e.neutralHovered,e.onNeutral)},neutralContainer:{previewStyles:"bg-neutral-container text-on-neutral-container",...n(e.neutralContainer,e.onNeutralContainer)},neutralContainerHovered:{previewStyles:"bg-neutral-container-hovered text-on-neutral-container",...n(e.neutralContainerHovered,e.onNeutralContainer)},background:{previewStyles:"bg-background text-on-background",...n(e.background,e.onBackground)},backgroundVariant:{previewStyles:"bg-background-variant text-on-background-variant",...n(e.backgroundVariant,e.onBackgroundVariant)},surface:{previewStyles:"bg-surface text-on-surface",...n(e.surface,e.onSurface)},surfaceHovered:{previewStyles:"bg-surface-hovered text-on-surface",...n(e.surfaceHovered,e.onSurface)},surfaceInverse:{previewStyles:"bg-surface-inverse text-on-surface-inverse",...n(e.surfaceInverse,e.onSurfaceInverse)},surfaceInverseHovered:{previewStyles:"bg-surface-inverse-hovered text-on-surface-inverse",...n(e.surfaceInverseHovered,e.onSurfaceInverse)}}};

package/dist/index.mjs

@@ -1,11 +1,32 @@
-import o from "deepmerge";
-const r = { borderRadius: { none: "0px", sm: "0.25rem", md: "0.5rem", lg: "1rem", xl: "1.5rem", full: "9999px" }, borderWidth: { none: "0px", sm: "1px", md: "2px" }, boxShadow: { sm: "0 1px 2px 0 rgba(108 129 157 / 0.50)", DEFAULT: "0 4px 8px 0 rgba(108 129 157 / 0.50)", md: "0 6px 12px 0 rgba(108 129 157 / 0.50)", lg: "0 8px 16px 0 rgba(108 129 157 / 0.50)", xl: "0 12px 24px 0 rgba(108 129 157 / 0.50)", none: "none" }, colors: { basic: "#094171", onBasic: "#FFFFFF", basicHovered: "#0C5291", basicContainer: "#E6F2FD", onBasicContainer: "#152233", basicContainerHovered: "#F4F9FE", accent: "#8526D9", onAccent: "#FFFFFF", accentHovered: "#9F47EB", accentContainer: "#E9D6FA", onAccentContainer: "#362555", accentContainerHovered: "#F5EDFD", accentVariant: "#501782", onAccentVariant: "#FFFFFF", accentVariantHovered: "#6B1FAD", main: "#EC5A13", onMain: "#FFFFFF", mainHovered: "#F07B42", mainContainer: "#FFE9DE", onMainContainer: "#89380F", mainContainerHovered: "#FFF2EB", mainVariant: "#B84A14", onMainVariant: "#FFFFFF", mainVariantHovered: "#EC5A13", support: "#094171", onSupport: "#FFFFFF", supportHovered: "#0C5291", supportContainer: "#E6F2FD", onSupportContainer: "#152233", supportContainerHovered: "#F4F9FE", supportVariant: "#0C5291", onSupportVariant: "#FFFFFF", supportVariantHovered: "#0F69B9", success: "#3E7A40", onSuccess: "#FFFFFF", successHovered: "#4E9850", successContainer: "#DCEADC", onSuccessContainer: "#2F5B30", successContainerHovered: "#EDF5EE", alert: "#FFAA00", onAlert: "#202730", alertHovered: "#FFBB33", alertContainer: "#FFEECC", onAlertContainer: "#996600", alertContainerHovered: "#FFF6E5", error: "#D93426", onError: "#FFFFFF", errorHovered: "#E05D52", errorContainer: "#F7D7D4", onErrorContainer: "#822017", errorContainerHovered: "#FBECEB", info: "#1388EC", onInfo: "#FFFFFF", infoHovered: "#69B2F3", infoContainer: "#C2E0FA", onInfoContainer: "#0C5291", infoContainerHovered: "#E6F2FD", neutral: "#4F6076", onNeutral: "#FFFFFF", neutralHovered: "#6C819D", neutralContainer: "#F0F2F5", onNeutralContainer: "#3A4757", neutralContainerHovered: "#F6F8F9", background: "#FFFFFF", onBackground: "#152233", backgroundVariant: "#F4F9FE", onBackgroundVariant: "#152233", surface: "#FFFFFF", onSurface: "#152233", surfaceHovered: "#F6F8F9", surfaceInverse: "#2B3441", onSurfaceInverse: "#FFFFFF", surfaceInverseHovered: "#3A4757", outline: "#ACB8C7", outlineHigh: "#202730", overlay: "#202730B8", onOverlay: "#FFFFFF" }, fontFamily: { sans: '"Nunito Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"', mono: 'SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace' }, fontSize: { display1: { fontSize: "2.5rem", lineHeight: "3.5rem", fontWeight: "700" }, display1Expanded: { fontSize: "3rem", lineHeight: "4rem", fontWeight: "700" }, display2: { fontSize: "2rem", lineHeight: "2.75rem", fontWeight: "700" }, display2Expanded: { fontSize: "2.5rem", lineHeight: "3.5rem", fontWeight: "700" }, display3: { fontSize: "1.5rem", lineHeight: "2rem", fontWeight: "700" }, display3Expanded: { fontSize: "2rem", lineHeight: "2.75rem", fontWeight: "700" }, headline1: { fontSize: "1.25rem", lineHeight: "1.75rem", fontWeight: "700" }, headline1Expanded: { fontSize: "1.5rem", lineHeight: "2rem", fontWeight: "700" }, headline2: { fontSize: "1.125rem", lineHeight: "1.5rem", fontWeight: "700" }, headline2Expanded: { fontSize: "1.25rem", lineHeight: "1.75rem", fontWeight: "700" }, subhead: { fontSize: "1rem", lineHeight: "1.5rem", fontWeight: "700" }, subheadExpanded: { fontSize: "1rem", lineHeight: "1.5rem", fontWeight: "700" }, body1: { fontSize: "1rem", lineHeight: "1.5rem" }, body2: { fontSize: "0.875rem", lineHeight: "1.25rem" }, caption: { fontSize: "0.75rem", lineHeight: "1rem" }, small: { fontSize: "0.625rem", lineHeight: "0.875rem" }, body1Link: { fontSize: "1rem", lineHeight: "1.5rem" }, body2Link: { fontSize: "0.875rem", lineHeight: "1.125rem" }, captionLink: { fontSize: "0.75rem", lineHeight: "1rem" }, callout: { fontSize: "1rem", lineHeight: "1.5rem" } }, fontWeight: { regular: "400", medium: "500", semiBold: "600", bold: "700" }, opacity: { 0: "0", none: "1", dim1: "0.72", dim2: "0.56", dim3: "0.40", dim4: "0.16", dim5: "0.08" }, screens: { sm: "640px", md: "768px", lg: "1024px", xl: "1280px" }, spacing: { auto: "auto", none: "0px", sm: "0.25rem", md: "0.5rem", lg: "1rem", xl: "1.5rem", "2xl": "2rem", "3xl": "2.5rem" }, zIndex: { hide: "-1", base: "0", raised: "1", dropdown: "1000", sticky: "1100", overlay: "1300", modal: "1400", popover: "1500", skipLink: "1600", toast: "1700", tooltip: "1800" } };
-function a(e, n = r) {
-  return o(n, e);
+import u from "deepmerge";
+const d = { borderRadius: { none: "0px", sm: "0.25rem", md: "0.5rem", lg: "1rem", xl: "1.5rem", full: "9999px" }, borderWidth: { none: "0px", sm: "1px", md: "2px" }, boxShadow: { sm: "0 1px 2px 0 rgba(108 129 157 / 0.50)", DEFAULT: "0 4px 8px 0 rgba(108 129 157 / 0.50)", md: "0 6px 12px 0 rgba(108 129 157 / 0.50)", lg: "0 8px 16px 0 rgba(108 129 157 / 0.50)", xl: "0 12px 24px 0 rgba(108 129 157 / 0.50)", none: "none" }, colors: { basic: "#094171", onBasic: "#FFFFFF", basicHovered: "#0C5291", basicContainer: "#E6F2FD", onBasicContainer: "#152233", basicContainerHovered: "#F4F9FE", accent: "#8526D9", onAccent: "#FFFFFF", accentHovered: "#9F47EB", accentContainer: "#E9D6FA", onAccentContainer: "#362555", accentContainerHovered: "#F5EDFD", accentVariant: "#501782", onAccentVariant: "#FFFFFF", accentVariantHovered: "#6B1FAD", main: "#EC5A13", onMain: "#FFFFFF", mainHovered: "#F07B42", mainContainer: "#FFE9DE", onMainContainer: "#89380F", mainContainerHovered: "#FFF2EB", mainVariant: "#B84A14", onMainVariant: "#FFFFFF", mainVariantHovered: "#EC5A13", support: "#094171", onSupport: "#FFFFFF", supportHovered: "#0C5291", supportContainer: "#E6F2FD", onSupportContainer: "#152233", supportContainerHovered: "#F4F9FE", supportVariant: "#0C5291", onSupportVariant: "#FFFFFF", supportVariantHovered: "#0F69B9", success: "#3E7A40", onSuccess: "#FFFFFF", successHovered: "#4E9850", successContainer: "#DCEADC", onSuccessContainer: "#2F5B30", successContainerHovered: "#EDF5EE", alert: "#FFAA00", onAlert: "#202730", alertHovered: "#FFBB33", alertContainer: "#FFEECC", onAlertContainer: "#996600", alertContainerHovered: "#FFF6E5", error: "#D93426", onError: "#FFFFFF", errorHovered: "#E05D52", errorContainer: "#F7D7D4", onErrorContainer: "#822017", errorContainerHovered: "#FBECEB", info: "#1388EC", onInfo: "#FFFFFF", infoHovered: "#69B2F3", infoContainer: "#C2E0FA", onInfoContainer: "#0C5291", infoContainerHovered: "#E6F2FD", neutral: "#4F6076", onNeutral: "#FFFFFF", neutralHovered: "#6C819D", neutralContainer: "#F0F2F5", onNeutralContainer: "#3A4757", neutralContainerHovered: "#F6F8F9", background: "#FFFFFF", onBackground: "#152233", backgroundVariant: "#F4F9FE", onBackgroundVariant: "#152233", surface: "#FFFFFF", onSurface: "#152233", surfaceHovered: "#F6F8F9", surfaceInverse: "#2B3441", onSurfaceInverse: "#FFFFFF", surfaceInverseHovered: "#3A4757", outline: "#ACB8C7", outlineHigh: "#202730", overlay: "#202730B8", onOverlay: "#FFFFFF" }, fontFamily: { sans: '"Nunito Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"', mono: 'SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace' }, fontSize: { display1: { fontSize: "2.5rem", lineHeight: "3.5rem", fontWeight: "700" }, display1Expanded: { fontSize: "3rem", lineHeight: "4rem", fontWeight: "700" }, display2: { fontSize: "2rem", lineHeight: "2.75rem", fontWeight: "700" }, display2Expanded: { fontSize: "2.5rem", lineHeight: "3.5rem", fontWeight: "700" }, display3: { fontSize: "1.5rem", lineHeight: "2rem", fontWeight: "700" }, display3Expanded: { fontSize: "2rem", lineHeight: "2.75rem", fontWeight: "700" }, headline1: { fontSize: "1.25rem", lineHeight: "1.75rem", fontWeight: "700" }, headline1Expanded: { fontSize: "1.5rem", lineHeight: "2rem", fontWeight: "700" }, headline2: { fontSize: "1.125rem", lineHeight: "1.5rem", fontWeight: "700" }, headline2Expanded: { fontSize: "1.25rem", lineHeight: "1.75rem", fontWeight: "700" }, subhead: { fontSize: "1rem", lineHeight: "1.5rem", fontWeight: "700" }, subheadExpanded: { fontSize: "1rem", lineHeight: "1.5rem", fontWeight: "700" }, body1: { fontSize: "1rem", lineHeight: "1.5rem" }, body2: { fontSize: "0.875rem", lineHeight: "1.25rem" }, caption: { fontSize: "0.75rem", lineHeight: "1rem" }, small: { fontSize: "0.625rem", lineHeight: "0.875rem" }, body1Link: { fontSize: "1rem", lineHeight: "1.5rem" }, body2Link: { fontSize: "0.875rem", lineHeight: "1.125rem" }, captionLink: { fontSize: "0.75rem", lineHeight: "1rem" }, callout: { fontSize: "1rem", lineHeight: "1.5rem" } }, fontWeight: { regular: "400", medium: "500", semiBold: "600", bold: "700" }, opacity: { 0: "0", none: "1", dim1: "0.72", dim2: "0.56", dim3: "0.40", dim4: "0.16", dim5: "0.08" }, screens: { sm: "640px", md: "768px", lg: "1024px", xl: "1280px" }, spacing: { auto: "auto", none: "0px", sm: "0.25rem", md: "0.5rem", lg: "1rem", xl: "1.5rem", "2xl": "2rem", "3xl": "2.5rem" }, zIndex: { hide: "-1", base: "0", raised: "1", dropdown: "1000", sticky: "1100", overlay: "1300", modal: "1400", popover: "1500", skipLink: "1600", toast: "1700", tooltip: "1800" } };
+function p(r, e = d) {
+  return u(e, r);
 }
-const t = a({ boxShadow: { sm: "0 1px 2px 0 rgba(0 0 0 / 0.50)", DEFAULT: "0 4px 8px 0 rgba(0 0 0 / 0.50)", md: "0 6px 12px 0 rgba(0 0 0 / 0.50)", lg: "0 8px 16px 0 rgba(0 0 0 / 0.50)", xl: "0 12px 24px 0 rgba(0 0 0 / 0.50)", none: "none" }, colors: { basic: "#C2E0FA", onBasic: "#152233", basicHovered: "#9FCEF7", basicContainer: "#094171", onBasicContainer: "#F4F9FE", basicContainerHovered: "#152233", accent: "#CFA3F5", onAccent: "#1B052E", accentHovered: "#AC7DDD", accentContainer: "#501782", onAccentContainer: "#F5EDFD", accentContainerHovered: "#360F57", accentVariant: "#B775F0", onAccentVariant: "#1B052E", accentVariantHovered: "#B775F0", main: "#F07B42", onMain: "#2F1305", mainHovered: "#EC5A13", mainContainer: "#89380F", onMainContainer: "#FFF2EB", mainContainerHovered: "#5C250A", mainVariant: "#F49D71", onMainVariant: "#2F1305", mainVariantHovered: "#F07B42", support: "#C2E0FA", onSupport: "#152233", supportHovered: "#9FCEF7", supportContainer: "#094171", onSupportContainer: "#F4F9FE", supportContainerHovered: "#152233", supportVariant: "#E6F2FD", onSupportVariant: "#152233", supportVariantHovered: "#C2E0FA", success: "#95C196", onSuccess: "#101E10", successHovered: "#71AD73", successContainer: "#2F5B30", onSuccessContainer: "#EDF5EE", successContainerHovered: "#1F3D20", alert: "#FFCC66", onAlert: "#332200", alertHovered: "#FFBB33", alertContainer: "#664400", onAlertContainer: "#FFF6E5", alertContainerHovered: "#332200", error: "#E8867D", onError: "#2B0B08", errorHovered: "#E05D52", errorContainer: "#822017", onErrorContainer: "#FBECEB", errorContainerHovered: "#57150F", info: "#9FCEF7", onInfo: "#152233", infoHovered: "#69B2F3", infoContainer: "#0C5291", onInfoContainer: "#F4F9FE", infoContainerHovered: "#094171", neutral: "#ACB8C7", onNeutral: "#202730", neutralHovered: "#6C819D", neutralContainer: "#3A4757", onNeutralContainer: "#F6F8F9", neutralContainerHovered: "#2B3441", background: "#202730", onBackground: "#F6F8F9", backgroundVariant: "#13171D", onBackgroundVariant: "#F6F8F9", surface: "#202730", onSurface: "#F6F8F9", surfaceHovered: "#000000", surfaceInverse: "#F6F8F9", onSurfaceInverse: "#2B3441", surfaceInverseHovered: "#F0F2F5", outline: "#4F6076", outlineHigh: "#F0F2F5", overlay: "#2B3441B8", onOverlay: "#F6F8F9" } });
+const m = p({ boxShadow: { sm: "0 1px 2px 0 rgba(0 0 0 / 0.50)", DEFAULT: "0 4px 8px 0 rgba(0 0 0 / 0.50)", md: "0 6px 12px 0 rgba(0 0 0 / 0.50)", lg: "0 8px 16px 0 rgba(0 0 0 / 0.50)", xl: "0 12px 24px 0 rgba(0 0 0 / 0.50)", none: "none" }, colors: { basic: "#C2E0FA", onBasic: "#152233", basicHovered: "#9FCEF7", basicContainer: "#094171", onBasicContainer: "#F4F9FE", basicContainerHovered: "#152233", accent: "#CFA3F5", onAccent: "#1B052E", accentHovered: "#AC7DDD", accentContainer: "#501782", onAccentContainer: "#F5EDFD", accentContainerHovered: "#360F57", accentVariant: "#B775F0", onAccentVariant: "#1B052E", accentVariantHovered: "#B775F0", main: "#F07B42", onMain: "#2F1305", mainHovered: "#EC5A13", mainContainer: "#89380F", onMainContainer: "#FFF2EB", mainContainerHovered: "#5C250A", mainVariant: "#F49D71", onMainVariant: "#2F1305", mainVariantHovered: "#F07B42", support: "#C2E0FA", onSupport: "#152233", supportHovered: "#9FCEF7", supportContainer: "#094171", onSupportContainer: "#F4F9FE", supportContainerHovered: "#152233", supportVariant: "#E6F2FD", onSupportVariant: "#152233", supportVariantHovered: "#C2E0FA", success: "#95C196", onSuccess: "#101E10", successHovered: "#71AD73", successContainer: "#2F5B30", onSuccessContainer: "#EDF5EE", successContainerHovered: "#1F3D20", alert: "#FFCC66", onAlert: "#332200", alertHovered: "#FFBB33", alertContainer: "#664400", onAlertContainer: "#FFF6E5", alertContainerHovered: "#332200", error: "#E8867D", onError: "#2B0B08", errorHovered: "#E05D52", errorContainer: "#822017", onErrorContainer: "#FBECEB", errorContainerHovered: "#57150F", info: "#9FCEF7", onInfo: "#152233", infoHovered: "#69B2F3", infoContainer: "#0C5291", onInfoContainer: "#F4F9FE", infoContainerHovered: "#094171", neutral: "#ACB8C7", onNeutral: "#202730", neutralHovered: "#6C819D", neutralContainer: "#3A4757", onNeutralContainer: "#F6F8F9", neutralContainerHovered: "#2B3441", background: "#202730", onBackground: "#F6F8F9", backgroundVariant: "#13171D", onBackgroundVariant: "#F6F8F9", surface: "#202730", onSurface: "#F6F8F9", surfaceHovered: "#000000", surfaceInverse: "#F6F8F9", onSurfaceInverse: "#2B3441", surfaceInverseHovered: "#F0F2F5", outline: "#4F6076", outlineHigh: "#F0F2F5", overlay: "#2B3441B8", onOverlay: "#F6F8F9" } });
+function s(r) {
+  const e = [parseInt(r.slice(1, 3), 16) / 255, parseInt(r.slice(3, 5), 16) / 255, parseInt(r.slice(5, 7), 16) / 255].map((o) => o <= 0.03928 ? o / 12.92 : Math.pow((o + 0.055) / 1.055, 2.4));
+  return 0.2126 * e[0] + 0.7152 * e[1] + 0.0722 * e[2];
+}
+function v(r, e) {
+  const o = e >= 24;
+  return r >= 7 ? "AAA" : r >= 4.5 && !o || r >= 3 && o ? "AA" : "Failed";
+}
+function c(r, e, o) {
+  const t = function(F, l) {
+    const a = s(F), i = s(l);
+    return (Math.max(a, i) + 0.05) / (Math.min(a, i) + 0.05);
+  }(r, e);
+  return { contrastRatio: t.toFixed(2), score: v(t, o), textSize: o >= 24 ? "Large" : "Small", colors: [r, e] };
+}
+const n = (r, e) => ({ small: c(r, e, 16), large: c(r, e, 24) }), g = (r) => {
+  const { colors: e } = r;
+  return { main: { previewStyles: "bg-main text-on-main", ...n(e.main, e.onMain) }, mainHovered: { previewStyles: "bg-main-hovered text-on-main", ...n(e.mainHovered, e.onMain) }, mainContainer: { previewStyles: "bg-main-container text-on-main-container", ...n(e.mainContainer, e.onMainContainer) }, mainContainerHovered: { previewStyles: "bg-main-container-hovered text-on-main-container", ...n(e.mainContainerHovered, e.onMainContainer) }, support: { previewStyles: "bg-support text-on-support", ...n(e.support, e.onSupport) }, supportHovered: { previewStyles: "bg-support-hovered text-on-support", ...n(e.supportHovered, e.onSupport) }, supportContainer: { previewStyles: "bg-support-container text-on-support-container", ...n(e.supportContainer, e.onSupportContainer) }, supportContainerHovered: { previewStyles: "bg-support-container-hovered text-on-support-container", ...n(e.supportContainerHovered, e.onSupportContainer) }, accent: { previewStyles: "bg-accent text-on-accent", ...n(e.accent, e.onAccent) }, accentHovered: { previewStyles: "bg-accent-hovered text-on-accent", ...n(e.accentHovered, e.onAccent) }, accentContainer: { previewStyles: "bg-accent-container text-on-accent-container", ...n(e.accentContainer, e.onAccentContainer) }, accentContainerHovered: { previewStyles: "bg-accent-container-hovered text-on-accent-container", ...n(e.accentContainerHovered, e.onAccentContainer) }, basic: { previewStyles: "bg-basic text-on-basic", ...n(e.basic, e.onBasic) }, basicHovered: { previewStyles: "bg-basic-hovered text-on-basic", ...n(e.basicHovered, e.onBasic) }, basicContainer: { previewStyles: "bg-basic-container text-on-basic-container", ...n(e.basicContainer, e.onBasicContainer) }, basicContainerHovered: { previewStyles: "bg-basic-container-hovered text-on-basic-container", ...n(e.basicContainerHovered, e.onBasicContainer) }, success: { previewStyles: "bg-success text-on-success", ...n(e.success, e.onSuccess) }, successHovered: { previewStyles: "bg-success-hovered text-on-success", ...n(e.successHovered, e.onSuccess) }, successContainer: { previewStyles: "bg-success-container text-on-success-container", ...n(e.successContainer, e.onSuccessContainer) }, successContainerHovered: { previewStyles: "bg-success-container-hovered text-on-success-container", ...n(e.successContainerHovered, e.onSuccessContainer) }, error: { previewStyles: "bg-error text-on-error", ...n(e.error, e.onError) }, errorHovered: { previewStyles: "bg-error-hovered text-on-error", ...n(e.errorHovered, e.onError) }, errorContainer: { previewStyles: "bg-error-container text-on-error-container", ...n(e.errorContainer, e.onErrorContainer) }, errorContainerHovered: { previewStyles: "bg-error-container-hovered text-on-error-container", ...n(e.errorContainerHovered, e.onErrorContainer) }, alert: { previewStyles: "bg-alert text-on-alert", ...n(e.alert, e.onAlert) }, alertHovered: { previewStyles: "bg-alert-hovered text-on-alert", ...n(e.alertHovered, e.onAlert) }, alertContainer: { previewStyles: "bg-alert-container text-on-alert-container", ...n(e.alertContainer, e.onAlertContainer) }, alertContainerHovered: { previewStyles: "bg-alert-container-hovered text-on-alert-container", ...n(e.alertContainerHovered, e.onAlertContainer) }, info: { previewStyles: "bg-info text-on-info", ...n(e.info, e.onInfo) }, infoHovered: { previewStyles: "bg-info-hovered text-on-info", ...n(e.infoHovered, e.onInfo) }, infoContainer: { previewStyles: "bg-info-container text-on-info-container", ...n(e.infoContainer, e.onInfoContainer) }, infoContainerHovered: { previewStyles: "bg-info-container-hovered text-on-info-container", ...n(e.infoContainerHovered, e.onInfoContainer) }, neutral: { previewStyles: "bg-neutral text-on-neutral", ...n(e.neutral, e.onNeutral) }, neutralHovered: { previewStyles: "bg-neutral-hovered text-on-neutral", ...n(e.neutralHovered, e.onNeutral) }, neutralContainer: { previewStyles: "bg-neutral-container text-on-neutral-container", ...n(e.neutralContainer, e.onNeutralContainer) }, neutralContainerHovered: { previewStyles: "bg-neutral-container-hovered text-on-neutral-container", ...n(e.neutralContainerHovered, e.onNeutralContainer) }, background: { previewStyles: "bg-background text-on-background", ...n(e.background, e.onBackground) }, backgroundVariant: { previewStyles: "bg-background-variant text-on-background-variant", ...n(e.backgroundVariant, e.onBackgroundVariant) }, surface: { previewStyles: "bg-surface text-on-surface", ...n(e.surface, e.onSurface) }, surfaceHovered: { previewStyles: "bg-surface-hovered text-on-surface", ...n(e.surfaceHovered, e.onSurface) }, surfaceInverse: { previewStyles: "bg-surface-inverse text-on-surface-inverse", ...n(e.surfaceInverse, e.onSurfaceInverse) }, surfaceInverseHovered: { previewStyles: "bg-surface-inverse-hovered text-on-surface-inverse", ...n(e.surfaceInverseHovered, e.onSurfaceInverse) } };
+};
 export {
-  a as createTheme,
-  r as defaultTheme,
-  t as defaultThemeDark
+  c as checkColorContrast,
+  p as createTheme,
+  d as defaultTheme,
+  m as defaultThemeDark,
+  g as getThemeContrastReport
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spark-ui/theme-utils",
-  "version": "6.2.6",
+  "version": "6.2.8",
   "description": "package for managing Spark theme configuration",
   "publishConfig": {
     "access": "public"
@@ -35,5 +35,5 @@
   },
   "homepage": "https://sparkui.vercel.app",
   "license": "MIT",
-  "gitHead": "d9f580ee964df14e31c3b02fbef77063444ee4e9"
+  "gitHead": "2615fd787cf800026466d65320e705db0ba651ea"
 }