@atlaskit/tokens 13.1.0 → 13.1.1

package/dist/esm/utils/hct-color-utils/contrast.js

@@ -28,9 +28,9 @@ import _createClass from "@babel/runtime/helpers/createClass";
 //
 // tslint:disable:class-as-namespace
 
-import * as utils from './color-utils';
-import * as math from './math-utils';
-
+import { clampDouble } from './clamp-double';
+import { lstarFromY } from './lstar-from-y';
+import { yFromLstar } from './y-from-lstar';
 /**
  * Utility methods for calculating contrast given two colors, or calculating a
  * color given one color and a contrast ratio.
@@ -57,9 +57,9 @@ export var Contrast = /*#__PURE__*/function () {
      * @param toneB Tone between 0 and 100. Values outside will be clamped.
      */
     function ratioOfTones(toneA, toneB) {
-      toneA = math.clampDouble(0.0, 100.0, toneA);
-      toneB = math.clampDouble(0.0, 100.0, toneB);
-      return Contrast.ratioOfYs(utils.yFromLstar(toneA), utils.yFromLstar(toneB));
+      toneA = clampDouble(0.0, 100.0, toneA);
+      toneB = clampDouble(0.0, 100.0, toneB);
+      return Contrast.ratioOfYs(yFromLstar(toneA), yFromLstar(toneB));
     }
   }, {
     key: "ratioOfYs",
@@ -85,7 +85,7 @@ export var Contrast = /*#__PURE__*/function () {
       if (tone < 0.0 || tone > 100.0) {
         return -1.0;
       }
-      var darkY = utils.yFromLstar(tone);
+      var darkY = yFromLstar(tone);
       var lightY = ratio * (darkY + 5.0) - 5.0;
       var realContrast = Contrast.ratioOfYs(lightY, darkY);
       var delta = Math.abs(realContrast - ratio);
@@ -95,7 +95,7 @@ export var Contrast = /*#__PURE__*/function () {
 
       // Ensure gamut mapping, which requires a 'range' on tone, will still result
       // the correct ratio by darkening slightly.
-      var returnValue = utils.lstarFromY(lightY) + 0.4;
+      var returnValue = lstarFromY(lightY) + 0.4;
       if (returnValue < 0 || returnValue > 100) {
         return -1;
       }
@@ -118,7 +118,7 @@ export var Contrast = /*#__PURE__*/function () {
       if (tone < 0.0 || tone > 100.0) {
         return -1.0;
       }
-      var lightY = utils.yFromLstar(tone);
+      var lightY = yFromLstar(tone);
       var darkY = (lightY + 5.0) / ratio - 5.0;
       var realContrast = Contrast.ratioOfYs(lightY, darkY);
       var delta = Math.abs(realContrast - ratio);
@@ -128,7 +128,7 @@ export var Contrast = /*#__PURE__*/function () {
 
       // Ensure gamut mapping, which requires a 'range' on tone, will still result
       // the correct ratio by darkening slightly.
-      var returnValue = utils.lstarFromY(darkY) - 0.4;
+      var returnValue = lstarFromY(darkY) - 0.4;
       if (returnValue < 0 || returnValue > 100) {
         return -1;
       }

package/dist/esm/utils/hct-color-utils/green-from-argb.js

@@ -0,0 +1,6 @@
+/**
+ * Returns the green component of a color in ARGB format.
+ */
+export function greenFromArgb(argb) {
+  return argb >> 8 & 255;
+}

package/dist/esm/utils/hct-color-utils/hct.js

@@ -23,9 +23,16 @@ import _createClass from "@babel/runtime/helpers/createClass";
  * limitations under the License.
  */
 
-import * as utils from './color-utils';
+import { argbFromLinrgb } from './argb-from-linrgb';
+import { argbFromLstar } from './argb-from-lstar';
+import { argbFromXyz } from './argb-from-xyz';
+import { linearized } from './linearized';
+import { lstarFromArgb } from './lstar-from-argb';
+import { lstarFromY } from './lstar-from-y';
 import * as math from './math-utils';
 import { ViewingConditions } from './viewing-conditions';
+import { yFromLstar } from './y-from-lstar';
+
 /**
  * A color system built using CAM16 hue and chroma, and L* from
  * L*a*b*.
@@ -54,7 +61,7 @@ export var Hct = /*#__PURE__*/function () {
     var cam = Cam16.fromInt(argb);
     this.internalHue = cam.hue;
     this.internalChroma = cam.chroma;
-    this.internalTone = utils.lstarFromArgb(argb);
+    this.internalTone = lstarFromArgb(argb);
   }
   return _createClass(Hct, [{
     key: "toInt",
@@ -118,7 +125,7 @@ export var Hct = /*#__PURE__*/function () {
       var cam = Cam16.fromInt(argb);
       this.internalHue = cam.hue;
       this.internalChroma = cam.chroma;
-      this.internalTone = utils.lstarFromArgb(argb);
+      this.internalTone = lstarFromArgb(argb);
       this.argb = argb;
     }
 
@@ -149,7 +156,7 @@ export var Hct = /*#__PURE__*/function () {
       // 3. Create HCT from:
       // - CAM16 using default VC with XYZ coordinates in specified VC.
       // - L* converted from Y in XYZ coordinates in specified VC.
-      var recastHct = Hct.from(recastInVc.hue, recastInVc.chroma, utils.lstarFromY(viewedInVc[1]));
+      var recastHct = Hct.from(recastInVc.hue, recastInVc.chroma, lstarFromY(viewedInVc[1]));
       return recastHct;
     }
   }], [{
@@ -300,7 +307,7 @@ var Cam16 = /*#__PURE__*/function () {
       var x = 1.86206786 * rF - 1.01125463 * gF + 0.14918677 * bF;
       var y = 0.38752654 * rF + 0.62144744 * gF - 0.00897398 * bF;
       var z = -0.0158415 * rF - 0.03412294 * gF + 1.04996444 * bF;
-      var argb = utils.argbFromXyz(x, y, z);
+      var argb = argbFromXyz(x, y, z);
       return argb;
     }
 
@@ -358,9 +365,9 @@ var Cam16 = /*#__PURE__*/function () {
       var red = (argb & 0x00ff0000) >> 16;
       var green = (argb & 0x0000ff00) >> 8;
       var blue = argb & 0x000000ff;
-      var redL = utils.linearized(red);
-      var greenL = utils.linearized(green);
-      var blueL = utils.linearized(blue);
+      var redL = linearized(red);
+      var greenL = linearized(green);
+      var blueL = linearized(blue);
       var x = 0.41233895 * redL + 0.35762064 * greenL + 0.18051042 * blueL;
       var y = 0.2126 * redL + 0.7152 * greenL + 0.0722 * blueL;
       var z = 0.01932141 * redL + 0.11916382 * greenL + 0.95034478 * blueL;
@@ -881,7 +888,7 @@ var HctSolver = /*#__PURE__*/function () {
           if (linrgb[0] > 100.01 || linrgb[1] > 100.01 || linrgb[2] > 100.01) {
             return 0;
           }
-          return utils.argbFromLinrgb(linrgb);
+          return argbFromLinrgb(linrgb);
         }
         // Iterates with Newton method,
         // Using 2 * fn(j) / j as the approximation of fn'(j)
@@ -906,17 +913,17 @@ var HctSolver = /*#__PURE__*/function () {
     key: "solveToInt",
     value: function solveToInt(hueDegrees, chroma, lstar) {
       if (chroma < 0.0001 || lstar < 0.0001 || lstar > 99.9999) {
-        return utils.argbFromLstar(lstar);
+        return argbFromLstar(lstar);
       }
       hueDegrees = math.sanitizeDegreesDouble(hueDegrees);
       var hueRadians = hueDegrees / 180 * Math.PI;
-      var y = utils.yFromLstar(lstar);
+      var y = yFromLstar(lstar);
       var exactAnswer = HctSolver.findResultByJ(hueRadians, chroma, y);
       if (exactAnswer !== 0) {
         return exactAnswer;
       }
       var linrgb = HctSolver.bisectToLimit(y, hueRadians);
-      return utils.argbFromLinrgb(linrgb);
+      return argbFromLinrgb(linrgb);
     }
 
     /**

package/dist/esm/utils/hct-color-utils/index.js

@@ -1,3 +1,4 @@
 export { Hct } from './hct';
 export { Contrast } from './contrast';
-export { argbFromRgba, rgbaFromArgb } from './color-utils';
+export { argbFromRgba } from './argb-from-rgba';
+export { rgbaFromArgb } from './rgba-from-argb';

package/dist/esm/utils/hct-color-utils/lab-f.js

@@ -0,0 +1,9 @@
+export function labF(t) {
+  var e = 216.0 / 24389.0;
+  var kappa = 24389.0 / 27.0;
+  if (t > e) {
+    return Math.pow(t, 1.0 / 3.0);
+  } else {
+    return (kappa * t + 16) / 116;
+  }
+}

package/dist/esm/utils/hct-color-utils/lab-invf.js

@@ -0,0 +1,10 @@
+export function labInvf(ft) {
+  var e = 216.0 / 24389.0;
+  var kappa = 24389.0 / 27.0;
+  var ft3 = ft * ft * ft;
+  if (ft3 > e) {
+    return ft3;
+  } else {
+    return (116 * ft - 16) / kappa;
+  }
+}

package/dist/esm/utils/hct-color-utils/lstar-from-argb.js

@@ -0,0 +1,28 @@
+import { blueFromArgb } from './blue-from-argb';
+import { greenFromArgb } from './green-from-argb';
+import { labF } from './lab-f';
+import { linearized } from './linearized';
+import { matrixMultiply } from './matrix-multiply';
+import { redFromArgb } from './red-from-argb';
+var SRGB_TO_XYZ = [[0.41233895, 0.35762064, 0.18051042], [0.2126, 0.7152, 0.0722], [0.01932141, 0.11916382, 0.95034478]];
+
+/**
+ * Converts a color from XYZ to ARGB.
+ */
+function xyzFromArgb(argb) {
+  var r = linearized(redFromArgb(argb));
+  var g = linearized(greenFromArgb(argb));
+  var b = linearized(blueFromArgb(argb));
+  return matrixMultiply([r, g, b], SRGB_TO_XYZ);
+}
+
+/**
+ * Computes the L* value of a color in ARGB representation.
+ *
+ * @param argb ARGB representation of a color
+ * @return L*, from L*a*b*, coordinate of the color
+ */
+export function lstarFromArgb(argb) {
+  var y = xyzFromArgb(argb)[1];
+  return 116.0 * labF(y / 100.0) - 16.0;
+}

package/dist/esm/utils/hct-color-utils/lstar-from-y.js

@@ -0,0 +1,16 @@
+import { labF } from './lab-f';
+
+/**
+ * Converts a Y value to an L* value.
+ *
+ * L* in L*a*b* and Y in XYZ measure the same quantity, luminance.
+ *
+ * L* measures perceptual luminance, a linear scale. Y in XYZ
+ * measures relative luminance, a logarithmic scale.
+ *
+ * @param y Y in XYZ
+ * @return L* in L*a*b*
+ */
+export function lstarFromY(y) {
+  return labF(y / 100.0) * 116.0 - 16.0;
+}

package/dist/esm/utils/hct-color-utils/red-from-argb.js

@@ -0,0 +1,6 @@
+/**
+ * Returns the red component of a color in ARGB format.
+ */
+export function redFromArgb(argb) {
+  return argb >> 16 & 255;
+}

package/dist/esm/utils/hct-color-utils/rgba-from-argb.js

@@ -0,0 +1,22 @@
+import { alphaFromArgb } from './alpha-from-argb';
+import { blueFromArgb } from './blue-from-argb';
+import { greenFromArgb } from './green-from-argb';
+import { redFromArgb } from './red-from-argb';
+/**
+ * Return RGBA from a given int32 color
+ *
+ * @param argb ARGB representation of a int32 color.
+ * @return RGBA representation of a int32 color.
+ */
+export function rgbaFromArgb(argb) {
+  var r = redFromArgb(argb);
+  var g = greenFromArgb(argb);
+  var b = blueFromArgb(argb);
+  var a = alphaFromArgb(argb);
+  return {
+    r: r,
+    g: g,
+    b: b,
+    a: a
+  };
+}

package/dist/esm/utils/hct-color-utils/viewing-conditions.js

@@ -2,8 +2,9 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _ViewingConditions;
-import * as utils from './color-utils';
 import * as math from './math-utils';
+import { whitePointD65 } from './white-point-d65';
+import { yFromLstar } from './y-from-lstar';
 export var ViewingConditions = /*#__PURE__*/function () {
   function ViewingConditions(n, aw, nbb, ncb, c, nc, rgbD, fl, fLRoot, z) {
     _classCallCheck(this, ViewingConditions);
@@ -44,8 +45,8 @@ export var ViewingConditions = /*#__PURE__*/function () {
      *       self-luminous objects like displays.
      */
     function make() {
-      var whitePoint = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : utils.whitePointD65();
-      var adaptingLuminance = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 200.0 / Math.PI * utils.yFromLstar(50.0) / 100.0;
+      var whitePoint = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : whitePointD65();
+      var adaptingLuminance = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 200.0 / Math.PI * yFromLstar(50.0) / 100.0;
       var backgroundLstar = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 50.0;
       var surround = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 2.0;
       var discountingIlluminant = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
@@ -63,7 +64,7 @@ export var ViewingConditions = /*#__PURE__*/function () {
       var k4 = k * k * k * k;
       var k4F = 1.0 - k4;
       var fl = k4 * adaptingLuminance + 0.1 * k4F * k4F * Math.cbrt(5.0 * adaptingLuminance);
-      var n = utils.yFromLstar(backgroundLstar) / whitePoint[1];
+      var n = yFromLstar(backgroundLstar) / whitePoint[1];
       var z = 1.48 + Math.sqrt(n);
       var nbb = 0.725 / Math.pow(n, 0.2);
       var ncb = nbb;

package/dist/esm/utils/hct-color-utils/white-point-d65.js

@@ -0,0 +1,8 @@
+/**
+ * Returns the standard white point; white on a sunny day.
+ *
+ * @return The white point
+ */
+export function whitePointD65() {
+  return [95.047, 100.0, 108.883];
+}

package/dist/esm/utils/hct-color-utils/y-from-lstar.js

@@ -0,0 +1,16 @@
+import { labInvf } from './lab-invf';
+
+/**
+ * Converts an L* value to a Y value.
+ *
+ * L* in L*a*b* and Y in XYZ measure the same quantity, luminance.
+ *
+ * L* measures perceptual luminance, a linear scale. Y in XYZ
+ * measures relative luminance, a logarithmic scale.
+ *
+ * @param lstar L* in L*a*b*
+ * @return Y in XYZ
+ */
+export function yFromLstar(lstar) {
+  return 100.0 * labInvf((lstar + 16.0) / 116.0);
+}

package/dist/esm/utils/hex-to-hsl.js

@@ -0,0 +1,46 @@
+import { isValidHex } from './is-valid-hex';
+export function hexToHSL(hex) {
+  if (!isValidHex(hex)) {
+    throw new Error('Invalid HEX');
+  }
+  var r = 0,
+    g = 0,
+    b = 0;
+  if (hex.length === 4) {
+    r = '0x' + hex[1] + hex[1];
+    g = '0x' + hex[2] + hex[2];
+    b = '0x' + hex[3] + hex[3];
+  } else if (hex.length === 7) {
+    r = '0x' + hex[1] + hex[2];
+    g = '0x' + hex[3] + hex[4];
+    b = '0x' + hex[5] + hex[6];
+  }
+  // Then to HSL
+  r /= 255;
+  g /= 255;
+  b /= 255;
+  var cmin = Math.min(r, g, b),
+    cmax = Math.max(r, g, b),
+    delta = cmax - cmin,
+    h = 0,
+    s = 0,
+    l = 0;
+  if (delta === 0) {
+    h = 0;
+  } else if (cmax === r) {
+    h = (g - b) / delta % 6;
+  } else if (cmax === g) {
+    h = (b - r) / delta + 2;
+  } else {
+    h = (r - g) / delta + 4;
+  }
+  h = Math.round(h * 60);
+  if (h < 0) {
+    h += 360;
+  }
+  l = (cmax + cmin) / 2;
+  s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
+  s = +(s * 100).toFixed(1);
+  l = +(l * 100).toFixed(1);
+  return [h, s, l];
+}

package/dist/esm/utils/hex-to-rgb-a.js

@@ -0,0 +1,14 @@
+import { getAlpha } from './get-alpha';
+import { isValidHex } from './is-valid-hex';
+export function hexToRgbA(hex) {
+  if (!isValidHex(hex)) {
+    throw new Error('Invalid HEX');
+  }
+  var c;
+  c = hex.substring(1).split('');
+  if (c.length === 3) {
+    c = [c[0], c[0], c[1], c[1], c[2], c[2]];
+  }
+  c = '0x' + c.join('');
+  return [c >> 16 & 255, c >> 8 & 255, c & 255, getAlpha(hex)];
+}

package/dist/esm/utils/hex-to-rgb.js

@@ -0,0 +1,13 @@
+import { isValidHex } from './is-valid-hex';
+export function hexToRgb(hex) {
+  if (!isValidHex(hex)) {
+    throw new Error('Invalid HEX');
+  }
+  var c;
+  c = hex.substring(1).split('');
+  if (c.length === 3) {
+    c = [c[0], c[0], c[1], c[1], c[2], c[2]];
+  }
+  c = '0x' + c.join('');
+  return [c >> 16 & 255, c >> 8 & 255, c & 255];
+}

package/dist/esm/utils/is-valid-hex.js

@@ -0,0 +1,4 @@
+// valid hex color with 4, 6 or 8 digits
+export var isValidHex = function isValidHex(hex) {
+  return /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex);
+};

package/dist/esm/utils/reduce-token-map.js

@@ -0,0 +1,11 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import tokens from '../artifacts/token-names';
+export function reduceTokenMap(tokenMap, themeRamp) {
+  return Object.entries(tokenMap).reduce(function (acc, _ref) {
+    var _ref2 = _slicedToArray(_ref, 2),
+      key = _ref2[0],
+      value = _ref2[1];
+    var cssVar = tokens[key];
+    return cssVar ? "".concat(acc, "\n  ").concat(cssVar, ": ").concat(typeof value === 'string' ? value : themeRamp[value], ";") : acc;
+  }, '');
+}

package/dist/esm/utils/rgb-to-lab.js

@@ -0,0 +1,18 @@
+export function rgbToLab(rgb) {
+  var r = rgb[0] / 255,
+    g = rgb[1] / 255,
+    b = rgb[2] / 255,
+    x,
+    y,
+    z;
+  r = r > 0.04045 ? Math.pow((r + 0.055) / 1.055, 2.4) : r / 12.92;
+  g = g > 0.04045 ? Math.pow((g + 0.055) / 1.055, 2.4) : g / 12.92;
+  b = b > 0.04045 ? Math.pow((b + 0.055) / 1.055, 2.4) : b / 12.92;
+  x = (r * 0.4124 + g * 0.3576 + b * 0.1805) / 0.95047;
+  y = (r * 0.2126 + g * 0.7152 + b * 0.0722) / 1.0;
+  z = (r * 0.0193 + g * 0.1192 + b * 0.9505) / 1.08883;
+  x = x > 0.008856 ? Math.pow(x, 1 / 3) : 7.787 * x + 16 / 116;
+  y = y > 0.008856 ? Math.pow(y, 1 / 3) : 7.787 * y + 16 / 116;
+  z = z > 0.008856 ? Math.pow(z, 1 / 3) : 7.787 * z + 16 / 116;
+  return [116 * y - 16, 500 * (x - y), 200 * (y - z)];
+}

package/dist/types/artifacts/palettes-raw/palette.d.ts

@@ -1,6 +1,6 @@
 /**
  * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::3ab6d06ceee07a33f01831ba39d1781a>>
+ * @codegen <<SignedSource::53794f446833e9543b9fc09809fc6844>>
  * @codegenCommand yarn build tokens
  */
 type TokenValue = string | number;

package/dist/types/entry-points/theme-state-transformer.d.ts

@@ -1 +1,2 @@
-export { themeStringToObject, themeObjectToString } from '../theme-state-transformer';
+export { themeStringToObject } from '../theme-string-to-object';
+export { themeObjectToString } from '../theme-object-to-string';

package/dist/types/index.d.ts

@@ -9,7 +9,8 @@ export { default as getSSRAutoScript } from './get-ssr-auto-script';
 export { default as useThemeObserver } from './use-theme-observer';
 export { default as ThemeMutationObserver } from './theme-mutation-observer';
 export { default as getGlobalTheme } from './get-global-theme';
-export { themeStringToObject, themeObjectToString } from './theme-state-transformer';
+export { themeStringToObject } from './theme-string-to-object';
+export { themeObjectToString } from './theme-object-to-string';
 export { default as themeImportMap } from './artifacts/theme-import-map';
 export type { CSSToken } from './artifacts/token-names';
 export type { ActiveTokens } from './artifacts/types';

package/dist/types/is-color-mode.d.ts

@@ -0,0 +1,2 @@
+import type { ThemeColorModes } from './theme-color-modes';
+export declare const isColorMode: (modeId: string) => modeId is ThemeColorModes;

package/dist/types/is-theme-ids.d.ts

@@ -0,0 +1,2 @@
+import type { ThemeIds } from './theme-config';
+export declare const isThemeIds: (themeId: string) => themeId is ThemeIds;

package/dist/types/is-theme-kind.d.ts

@@ -0,0 +1,4 @@
+declare const themeKinds: readonly ["light", "dark", "spacing", "typography", "shape", "motion"];
+type ThemeKind = (typeof themeKinds)[number];
+export declare const isThemeKind: (themeKind: string) => themeKind is ThemeKind;
+export {};

package/dist/types/theme-color-modes.d.ts

@@ -5,3 +5,4 @@
  * The idea is there may exist many color themes, but every theme must either fit into light or dark.
  */
 export declare const themeColorModes: readonly ["light", "dark", "auto"];
+export type ThemeColorModes = (typeof themeColorModes)[number];

package/dist/types/theme-config.d.ts

@@ -1,8 +1,9 @@
-import { type themeColorModes } from './theme-color-modes';
-import { themeIds } from './theme-ids';
 /**
  * This file contains the source of truth for themes and all associated meta data.
  */
+import type { ThemeColorModes } from './theme-color-modes';
+import { type ThemeIds } from './theme-ids';
+import type { ThemeState } from './theme-state';
 /**
  * Themes: The internal identifier of a theme.
  * These ids are what the actual theme files/folders are called.
@@ -23,7 +24,6 @@ export type ThemeOverrides = Themes;
  * In the future other types may be introduced such as typography.
  */
 type ThemeKinds = 'color' | 'spacing' | 'typography' | 'shape' | 'motion';
-export type ThemeColorModes = (typeof themeColorModes)[number];
 export type DataColorModes = Exclude<ThemeColorModes, 'auto'>;
 /**
  * Contrast preferences: The system contrast preference
@@ -31,7 +31,6 @@ export type DataColorModes = Exclude<ThemeColorModes, 'auto'>;
 declare const themeContrastModes: readonly ["more", "no-preference", "auto"];
 export type ThemeContrastModes = (typeof themeContrastModes)[number];
 export type DataContrastModes = 'more' | 'no-preference' | 'auto';
-export type ThemeIds = (typeof themeIds)[number];
 /**
  * Theme override ids: the equivalent of themeIds for theme overrides.
  * Theme overrides are temporary and there may not be any defined at times.
@@ -102,40 +101,6 @@ interface ThemeConfig {
     increasesContrastFor?: ThemeIds;
 }
 declare const themeConfig: Record<Themes | ThemeOverrides, ThemeConfig>;
-type HEX = `#${string}`;
-export type CSSColor = HEX;
-/**
- * ThemeOptionsSchema: additional configuration options used to customize Atlassian's themes
- */
-export interface ThemeOptionsSchema {
-    brandColor: CSSColor;
-}
-/**
- * ThemeState: the standard representation of an app's current theme and preferences
- */
-export interface ThemeState {
-    light: Extract<ThemeIds, 'light' | 'light-future' | 'dark' | 'dark-future' | 'light-increased-contrast' | 'dark-increased-contrast'>;
-    dark: Extract<ThemeIds, 'light' | 'light-future' | 'dark' | 'dark-future' | 'light-increased-contrast' | 'dark-increased-contrast'>;
-    colorMode: ThemeColorModes;
-    contrastMode: ThemeContrastModes;
-    shape?: Extract<ThemeIds, 'shape'>;
-    spacing: Extract<ThemeIds, 'spacing'>;
-    typography: Extract<ThemeIds, 'typography'>;
-    motion?: Extract<ThemeIds, 'motion'>;
-    UNSAFE_themeOptions?: ThemeOptionsSchema;
-}
-/**
- * Can't evaluate typography feature flags at the module level,
- * it will always resolve to false when server side rendered or when flags are loaded async.
- */
-interface ThemeStateDefaults extends Omit<ThemeState, 'shape' | 'motion'> {
-    shape: () => ThemeState['shape'];
-    motion: () => ThemeState['motion'];
-}
-/**
- * themeStateDefaults: the default values for ThemeState used by theming utilities
- */
-export declare const themeStateDefaults: ThemeStateDefaults;
 /**
  * Represents theme state once mounted to the page
  * (the page doesn't have an "auto" color mode, it's either light or dark)
@@ -144,5 +109,8 @@ export interface ActiveThemeState extends ThemeState {
     colorMode: DataColorModes;
 }
 export default themeConfig;
-export { themeColorModes } from './theme-color-modes';
-export { themeIds } from './theme-ids';
+export { themeColorModes, type ThemeColorModes } from './theme-color-modes';
+export { themeIds, type ThemeIds } from './theme-ids';
+export { themeStateDefaults } from './theme-state-defaults';
+export { type ThemeOptionsSchema, type CSSColor } from './theme-options-schema';
+export { type ThemeState } from './theme-state';

package/dist/types/theme-ids.d.ts

@@ -1,3 +1,4 @@
+export type ThemeIds = (typeof themeIds)[number];
 /**
  * Theme ids: The value that will be mounted to the DOM as a data attr
  * For example: `data-theme="light:light dark:dark spacing:spacing"

package/dist/types/theme-object-to-string.d.ts

@@ -0,0 +1,13 @@
+import type { ThemeState } from './theme-state';
+/**
+ * Converts a theme object to a string formatted for the `data-theme` HTML attribute.
+ *
+ * @param {object} themes The themes that should be applied.
+ *
+ * @example
+ * ```
+ * themeObjectToString({ dark: 'dark', light: 'light', spacing: 'spacing' });
+ * // returns 'dark:dark light:light spacing:spacing'
+ * ```
+ */
+export declare const themeObjectToString: (themeState: Partial<ThemeState>) => string;

package/dist/types/theme-options-schema.d.ts

@@ -0,0 +1,7 @@
+export type CSSColor = `#${string}`;
+/**
+ * ThemeOptionsSchema: additional configuration options used to customize Atlassian's themes
+ */
+export interface ThemeOptionsSchema {
+    brandColor: CSSColor;
+}

package/dist/types/theme-state-defaults.d.ts

@@ -0,0 +1,14 @@
+import type { ThemeState } from './theme-state';
+/**
+ * Can't evaluate typography feature flags at the module level,
+ * it will always resolve to false when server side rendered or when flags are loaded async.
+ */
+interface ThemeStateDefaults extends Omit<ThemeState, 'shape' | 'motion'> {
+    shape: () => ThemeState['shape'];
+    motion: () => ThemeState['motion'];
+}
+/**
+ * themeStateDefaults: the default values for ThemeState used by theming utilities
+ */
+export declare const themeStateDefaults: ThemeStateDefaults;
+export {};

package/dist/types/theme-state.d.ts

@@ -0,0 +1,17 @@
+import type { ThemeColorModes } from './theme-color-modes';
+import type { ThemeContrastModes, ThemeOptionsSchema } from './theme-config';
+import type { ThemeIds } from './theme-ids';
+/**
+ * ThemeState: the standard representation of an app's current theme and preferences
+ */
+export interface ThemeState {
+    light: Extract<ThemeIds, 'light' | 'light-future' | 'dark' | 'dark-future' | 'light-increased-contrast' | 'dark-increased-contrast'>;
+    dark: Extract<ThemeIds, 'light' | 'light-future' | 'dark' | 'dark-future' | 'light-increased-contrast' | 'dark-increased-contrast'>;
+    colorMode: ThemeColorModes;
+    contrastMode: ThemeContrastModes;
+    shape?: Extract<ThemeIds, 'shape'>;
+    spacing: Extract<ThemeIds, 'spacing'>;
+    typography: Extract<ThemeIds, 'typography'>;
+    motion?: Extract<ThemeIds, 'motion'>;
+    UNSAFE_themeOptions?: ThemeOptionsSchema;
+}

package/dist/types/{theme-state-transformer.d.ts → theme-string-to-object.d.ts}

@@ -12,15 +12,3 @@ import type { ThemeState } from './theme-config';
  * ```
  */
 export declare const themeStringToObject: (themeState: string) => Partial<ThemeState>;
-/**
- * Converts a theme object to a string formatted for the `data-theme` HTML attribute.
- *
- * @param {object} themes The themes that should be applied.
- *
- * @example
- * ```
- * themeObjectToString({ dark: 'dark', light: 'light', spacing: 'spacing' });
- * // returns 'dark:dark light:light spacing:spacing'
- * ```
- */
-export declare const themeObjectToString: (themeState: Partial<ThemeState>) => string;