@udixio/theme 1.2.0 → 1.3.1

package/dist/{loader-C_BIrsO2.js → loader-C8_TyOuS.js}

@@ -898,34 +898,6 @@ class Hct {
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-function extendSpecVersion(originlColor, extendedColor) {
-  return DynamicColor.fromPalette({
-    name: originlColor.name,
-    palette: (s) => extendedColor.palette(s),
-    tone: (s) => extendedColor.tone(s),
-    isBackground: originlColor.isBackground,
-    chromaMultiplier: (s) => {
-      const chromaMultiplier = extendedColor.chromaMultiplier;
-      return chromaMultiplier !== void 0 ? chromaMultiplier(s) : 1;
-    },
-    background: (s) => {
-      const background = extendedColor.background;
-      return background !== void 0 ? background(s) : void 0;
-    },
-    secondBackground: (s) => {
-      const secondBackground = extendedColor.secondBackground;
-      return secondBackground !== void 0 ? secondBackground(s) : void 0;
-    },
-    contrastCurve: (s) => {
-      const contrastCurve = extendedColor.contrastCurve;
-      return contrastCurve !== void 0 ? contrastCurve(s) : void 0;
-    },
-    toneDeltaPair: (s) => {
-      const toneDeltaPair = extendedColor.toneDeltaPair;
-      return toneDeltaPair !== void 0 ? toneDeltaPair(s) : void 0;
-    }
-  });
-}
 class DynamicColor {
   /**
    * The base constructor for DynamicColor.
@@ -956,11 +928,11 @@ class DynamicColor {
    * @param contrastCurve A `ContrastCurve` object specifying how its contrast
    *     against its background should behave in various contrast levels
    *     options.
-   * @param toneDeltaPair A `ToneDeltaPair` object specifying a tone delta
+   * @param adjustTone A `AdjustTone` object specifying a tone delta
    *     constraint between two colors. One of them must be the color being
    *     constructed.
    */
-  constructor(name, palette, tone, isBackground, chromaMultiplier, background, secondBackground, contrastCurve, toneDeltaPair) {
+  constructor(name, palette, tone, isBackground, chromaMultiplier, background, secondBackground, contrastCurve, adjustTone) {
     __publicField(this, "hctCache", /* @__PURE__ */ new Map());
     this.name = name;
     this.palette = palette;
@@ -970,7 +942,7 @@ class DynamicColor {
     this.background = background;
     this.secondBackground = secondBackground;
     this.contrastCurve = contrastCurve;
-    this.toneDeltaPair = toneDeltaPair;
+    this.adjustTone = adjustTone;
     if (!background && secondBackground) {
       throw new Error(
         `Color ${name} has secondBackgrounddefined, but background is not defined.`
@@ -1003,7 +975,7 @@ class DynamicColor {
       args.background,
       args.secondBackground,
       args.contrastCurve,
-      args.toneDeltaPair
+      args.adjustTone
     );
   }
   static getInitialToneFromBackground(background) {
@@ -1078,7 +1050,7 @@ class DynamicColor {
       background: this.background,
       secondBackground: this.secondBackground,
       contrastCurve: this.contrastCurve,
-      toneDeltaPair: this.toneDeltaPair
+      adjustTone: this.adjustTone
     });
   }
   /**
@@ -1122,59 +1094,9 @@ class DynamicColor {
    *     contrast level is.
    */
   getTone(scheme) {
-    const toneDeltaPair = this.toneDeltaPair ? this.toneDeltaPair(scheme) : void 0;
-    if (toneDeltaPair) {
-      const roleA = toneDeltaPair.roleA;
-      const roleB = toneDeltaPair.roleB;
-      const polarity = toneDeltaPair.polarity;
-      const constraint = toneDeltaPair.constraint;
-      const absoluteDelta = polarity === "darker" || polarity === "relative_lighter" && scheme.isDark || polarity === "relative_darker" && !scheme.isDark ? -toneDeltaPair.delta : toneDeltaPair.delta;
-      const amRoleA = this.name === roleA.name;
-      const selfRole = amRoleA ? roleA : roleB;
-      const refRole = amRoleA ? roleB : roleA;
-      let selfTone = selfRole.tone(scheme);
-      const refTone = refRole.getTone(scheme);
-      const relativeDelta = absoluteDelta * (amRoleA ? 1 : -1);
-      if (constraint === "exact") {
-        selfTone = clampDouble(0, 100, refTone + relativeDelta);
-      } else if (constraint === "nearer") {
-        if (relativeDelta > 0) {
-          selfTone = clampDouble(
-            0,
-            100,
-            clampDouble(refTone, refTone + relativeDelta, selfTone)
-          );
-        } else {
-          selfTone = clampDouble(
-            0,
-            100,
-            clampDouble(refTone + relativeDelta, refTone, selfTone)
-          );
-        }
-      } else if (constraint === "farther") {
-        if (relativeDelta > 0) {
-          selfTone = clampDouble(refTone + relativeDelta, 100, selfTone);
-        } else {
-          selfTone = clampDouble(0, refTone + relativeDelta, selfTone);
-        }
-      }
-      if (this.background && this.contrastCurve) {
-        const background = this.background(scheme);
-        const contrastCurve = this.contrastCurve(scheme);
-        if (background && contrastCurve) {
-          const bgTone = background.getTone(scheme);
-          const selfContrast = contrastCurve.get(scheme.contrastLevel);
-          selfTone = Contrast.ratioOfTones(bgTone, selfTone) >= selfContrast && scheme.contrastLevel >= 0 ? selfTone : DynamicColor.foregroundTone(bgTone, selfContrast);
-        }
-      }
-      if (this.isBackground && !this.name.endsWith("_fixed_dim")) {
-        if (selfTone >= 57) {
-          selfTone = clampDouble(65, 100, selfTone);
-        } else {
-          selfTone = clampDouble(0, 49, selfTone);
-        }
-      }
-      return selfTone;
+    const adjustTone = this.adjustTone ? this.adjustTone(scheme) : void 0;
+    if (adjustTone) {
+      return adjustTone({ scheme, dynamicColor: this });
     } else {
       let answer = this.tone(scheme);
       if (this.background == void 0 || this.background(scheme) === void 0 || this.contrastCurve == void 0 || this.contrastCurve(scheme) === void 0) {
@@ -1274,7 +1196,66 @@ class ToneDeltaPair {
     this.constraint = constraint;
     this.constraint = constraint ?? "exact";
   }
+  adjustedTone({
+    scheme,
+    dynamicColor
+  }) {
+    const roleA = this.roleA;
+    const roleB = this.roleB;
+    const polarity = this.polarity;
+    const constraint = this.constraint;
+    const absoluteDelta = polarity === "darker" || polarity === "relative_lighter" && scheme.isDark || polarity === "relative_darker" && !scheme.isDark ? -this.delta : this.delta;
+    const amRoleA = dynamicColor.name === roleA.name;
+    const selfRole = amRoleA ? roleA : roleB;
+    const refRole = amRoleA ? roleB : roleA;
+    let selfTone = selfRole.tone(scheme);
+    const refTone = refRole.getTone(scheme);
+    const relativeDelta = absoluteDelta * (amRoleA ? 1 : -1);
+    if (constraint === "exact") {
+      selfTone = clampDouble(0, 100, refTone + relativeDelta);
+    } else if (constraint === "nearer") {
+      if (relativeDelta > 0) {
+        selfTone = clampDouble(
+          0,
+          100,
+          clampDouble(refTone, refTone + relativeDelta, selfTone)
+        );
+      } else {
+        selfTone = clampDouble(
+          0,
+          100,
+          clampDouble(refTone + relativeDelta, refTone, selfTone)
+        );
+      }
+    } else if (constraint === "farther") {
+      if (relativeDelta > 0) {
+        selfTone = clampDouble(refTone + relativeDelta, 100, selfTone);
+      } else {
+        selfTone = clampDouble(0, refTone + relativeDelta, selfTone);
+      }
+    }
+    if (dynamicColor.background && dynamicColor.contrastCurve) {
+      const background = dynamicColor.background(scheme);
+      const contrastCurve = dynamicColor.contrastCurve(scheme);
+      if (background && contrastCurve) {
+        const bgTone = background.getTone(scheme);
+        const selfContrast = contrastCurve.get(scheme.contrastLevel);
+        selfTone = Contrast.ratioOfTones(bgTone, selfTone) >= selfContrast && scheme.contrastLevel >= 0 ? selfTone : DynamicColor.foregroundTone(bgTone, selfContrast);
+      }
+    }
+    if (dynamicColor.isBackground && !dynamicColor.name.endsWith("_fixed_dim")) {
+      if (selfTone >= 57) {
+        selfTone = clampDouble(65, 100, selfTone);
+      } else {
+        selfTone = clampDouble(0, 49, selfTone);
+      }
+    }
+    return selfTone;
+  }
 }
+const toneDeltaPair = (...params) => {
+  return (args) => new ToneDeltaPair(...params).adjustedTone(args);
+};
 function argbToRgb(argb) {
   return {
     r: argb >> 16 & 255,
@@ -1453,7 +1434,7 @@ class ColorManager {
       isBackground: true,
       background: (s) => highestSurface(s, this),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         this.get(colorContainerKey).getMaterialColor(),
         this.get(colorKey).getMaterialColor(),
         5,
@@ -1474,7 +1455,7 @@ class ColorManager {
       isBackground: true,
       background: (s) => this.get("surfaceContainerHigh").getMaterialColor(),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         this.get(colorDimKey).getMaterialColor(),
         this.get(colorKey).getMaterialColor(),
         5,
@@ -1501,7 +1482,7 @@ class ColorManager {
       },
       isBackground: true,
       background: (s) => highestSurface(s, this),
-      toneDeltaPair: (s) => void 0,
+      adjustTone: (s) => void 0,
       contrastCurve: (s) => s.contrastLevel > 0 ? getCurve(1.5) : void 0
     });
     this.createOrUpdate(onColorContainerKey, {
@@ -1523,7 +1504,7 @@ class ColorManager {
       palette: (s) => s.getPalette(colorKey),
       tone: (s) => this.get(colorFixedKey).getMaterialColor().getTone(s),
       isBackground: true,
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         this.get(colorFixedDimKey).getMaterialColor(),
         this.get(colorFixedKey).getMaterialColor(),
         5,
@@ -1713,6 +1694,9 @@ class ThemeApi {
   //   Object.assign(this.themeOptions, options);
   //   return this.theme();
   // }
+  get sourceColorHex() {
+    return this.schemeManager.get().sourceColorHct;
+  }
   create(options) {
     this.schemeManager.createOrUpdate({
       ...options,
@@ -1790,6 +1774,9 @@ const tonalSpotVariant = {
   },
   customPalettes: ({ colorHct }) => TonalPalette.fromHueAndChroma(colorHct.hue, 16)
 };
+const inverseTone = (tone) => {
+  return 100 - tone;
+};
 const defaultColors = (colorService) => {
   const getColor = (key) => {
     return colorService.getColor(key).getMaterialColor();
@@ -1804,6 +1791,9 @@ const defaultColors = (colorService) => {
         if (s.isDark) {
           return 4;
         } else {
+          if (s.variant == "fidelity") {
+            return 100;
+          }
           if (Hct.isYellow(s.getPalette("neutral").hue)) {
             return 99;
           } else if (s.variant === "vibrant") {
@@ -2099,6 +2089,8 @@ const defaultColors = (colorService) => {
             0,
             Hct.isYellow(s.getPalette("primary").hue) ? 25 : Hct.isCyan(s.getPalette("primary").hue) ? 88 : 98
           );
+        } else if (s.variant == "fidelity") {
+          return s.sourceColorHct.tone;
         } else {
           return tMaxC(
             s.getPalette("primary"),
@@ -2110,7 +2102,18 @@ const defaultColors = (colorService) => {
       isBackground: true,
       background: (s) => highestSurface(s, colorService),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => s.variant == "fidelity" ? () => {
+        const surfaceTone = colorService.getColor("surface").getMaterialColor().tone(s);
+        const primaryTone = colorService.getColor("primary").getMaterialColor().tone(s);
+        let selfTone = primaryTone;
+        if (Contrast.ratioOfTones(surfaceTone, selfTone) < 3) {
+          const result = inverseTone(primaryTone);
+          if (Contrast.ratioOfTones(surfaceTone, result) >= 3) {
+            selfTone = result;
+          }
+        }
+        return selfTone;
+      } : toneDeltaPair(
         colorService.getColor("primaryContainer").getMaterialColor(),
         colorService.getColor("primary").getMaterialColor(),
         5,
@@ -2133,7 +2136,7 @@ const defaultColors = (colorService) => {
       isBackground: true,
       background: (s) => getColor("surfaceContainerHigh"),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         colorService.getColor("primaryDim").getMaterialColor(),
         colorService.getColor("primary").getMaterialColor(),
         5,
@@ -2160,6 +2163,13 @@ const defaultColors = (colorService) => {
             78,
             Hct.isCyan(s.getPalette("primary").hue) ? 88 : 90
           );
+        }
+        if (s.variant == "fidelity") {
+          return s.isDark ? tMaxC(s.getPalette("primary"), 30, 93) : tMaxC(
+            s.getPalette("primary"),
+            78,
+            Hct.isCyan(s.getPalette("primary").hue) ? 88 : 90
+          );
         } else {
           return s.isDark ? tMinC(s.getPalette("primary"), 66, 93) : tMaxC(
             s.getPalette("primary"),
@@ -2170,7 +2180,14 @@ const defaultColors = (colorService) => {
       },
       isBackground: true,
       background: (s) => highestSurface(s, colorService),
-      toneDeltaPair: (s) => void 0,
+      adjustTone: (s) => s.variant == "fidelity" ? toneDeltaPair(
+        colorService.getColor("primary").getMaterialColor(),
+        colorService.getColor("primaryContainer").getMaterialColor(),
+        15,
+        "relative_darker",
+        true,
+        "farther"
+      ) : void 0,
       contrastCurve: (s) => s.contrastLevel > 0 ? getCurve(1.5) : void 0
     },
     onPrimaryContainer: {
@@ -2196,7 +2213,7 @@ const defaultColors = (colorService) => {
       palette: (s) => s.getPalette("primary"),
       tone: (s) => colorService.getColor("primaryFixed").getMaterialColor().getTone(s),
       isBackground: true,
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         getColor("primaryFixedDim"),
         getColor("primaryFixed"),
         5,
@@ -2238,7 +2255,7 @@ const defaultColors = (colorService) => {
       isBackground: true,
       background: (s) => highestSurface(s, colorService),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         getColor("secondaryContainer"),
         getColor("secondary"),
         5,
@@ -2259,7 +2276,7 @@ const defaultColors = (colorService) => {
       isBackground: true,
       background: (s) => getColor("surfaceContainerHigh"),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         getColor("secondaryDim"),
         getColor("secondary"),
         5,
@@ -2286,7 +2303,7 @@ const defaultColors = (colorService) => {
       },
       isBackground: true,
       background: (s) => highestSurface(s, colorService),
-      toneDeltaPair: (s) => void 0,
+      adjustTone: (s) => void 0,
       contrastCurve: (s) => s.contrastLevel > 0 ? getCurve(1.5) : void 0
     },
     onSecondaryContainer: {
@@ -2312,7 +2329,7 @@ const defaultColors = (colorService) => {
       palette: (s) => s.getPalette("secondary"),
       tone: (s) => getColor("secondaryFixed").getTone(s),
       isBackground: true,
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         getColor("secondaryFixedDim"),
         getColor("secondaryFixed"),
         5,
@@ -2350,7 +2367,7 @@ const defaultColors = (colorService) => {
       isBackground: true,
       background: (s) => highestSurface(s, colorService),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         getColor("tertiaryContainer"),
         getColor("tertiary"),
         5,
@@ -2371,7 +2388,7 @@ const defaultColors = (colorService) => {
       isBackground: true,
       background: (s) => getColor("surfaceContainerHigh"),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         getColor("tertiaryDim"),
         getColor("tertiary"),
         5,
@@ -2404,7 +2421,7 @@ const defaultColors = (colorService) => {
       },
       isBackground: true,
       background: (s) => highestSurface(s, colorService),
-      toneDeltaPair: (s) => void 0,
+      adjustTone: (s) => void 0,
       contrastCurve: (s) => s.contrastLevel > 0 ? getCurve(1.5) : void 0
     },
     onTertiaryContainer: {
@@ -2430,7 +2447,7 @@ const defaultColors = (colorService) => {
       palette: (s) => s.getPalette("tertiary"),
       tone: (s) => getColor("tertiaryFixed").getTone(s),
       isBackground: true,
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         getColor("tertiaryFixedDim"),
         getColor("tertiaryFixed"),
         5,
@@ -2460,7 +2477,7 @@ const defaultColors = (colorService) => {
       isBackground: true,
       background: (s) => highestSurface(s, colorService),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         colorService.getColor("errorContainer").getMaterialColor(),
         colorService.getColor("error").getMaterialColor(),
         5,
@@ -2475,7 +2492,7 @@ const defaultColors = (colorService) => {
       isBackground: true,
       background: (s) => getColor("surfaceContainerHigh"),
       contrastCurve: (s) => getCurve(4.5),
-      toneDeltaPair: (s) => new ToneDeltaPair(
+      adjustTone: (s) => toneDeltaPair(
         getColor("errorDim"),
         getColor("error"),
         5,
@@ -2496,7 +2513,7 @@ const defaultColors = (colorService) => {
       },
       isBackground: true,
       background: (s) => highestSurface(s, colorService),
-      toneDeltaPair: (s) => void 0,
+      adjustTone: (s) => void 0,
       contrastCurve: (s) => s.contrastLevel > 0 ? getCurve(1.5) : void 0
     },
     onErrorContainer: {
@@ -2646,11 +2663,8 @@ const loader = async (config) => {
       api.plugins.initPlugins(api);
     }
   };
-  const load = async () => {
-    await api.plugins.loadPlugins();
-  };
   init();
-  await load();
+  await api.load();
   return api;
 };
 export {
@@ -2660,7 +2674,7 @@ export {
   Hct as H,
   PluginModule as P,
   SchemeManager as S,
-  ToneDeltaPair as T,
+  ThemeModule as T,
   Variant as V,
   AppModule as a,
   API as b,
@@ -2671,15 +2685,14 @@ export {
   bootstrap as g,
   highestSurface as h,
   ContrastCurve as i,
-  extendSpecVersion as j,
-  PluginApi as k,
+  PluginApi as j,
+  tonalSpotVariant as k,
   loader as l,
-  ThemeModule as m,
-  Scheme as n,
-  ThemeApi as o,
-  getPiecewiseHue as p,
-  getRotatedHue as q,
+  Scheme as m,
+  ThemeApi as n,
+  getPiecewiseHue as o,
+  getRotatedHue as p,
+  VariantManager as q,
   registerModule as r,
-  VariantManager as s,
-  tonalSpotVariant as t
+  toneDeltaPair as t
 };