@octaviaflow/type 1.0.0 → 2.0.0

package/es/index.js

@@ -1,17 +1,6 @@
 import { px, baseFontSize, rem, breakpoint, breakpoints } from '@octaviaflow/layout';
 
-/**
- * Copyright OctaviaFlow
- * Author: Vishal Kumar
- * Created: 11/November/2025
- * 
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-// Font family fallbacks for: IBM Plex Mono, IBM Plex Sans, IBM Plex Sans
-// Condensed, IBM Plex Sans Hebrew, and IBM Plex Serif
-var fontFamilies = {
+const fontFamilies = {
   mono: "'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace",
   sans: "'IBM Plex Sans', system-ui, -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', sans-serif",
   sansCondensed: "'IBM Plex Sans Condensed', 'Helvetica Neue', Arial, sans-serif",
@@ -20,66 +9,49 @@ var fontFamilies = {
 };
 function fontFamily(name) {
   if (!fontFamilies[name]) {
-    throw new Error("Unable to find font family: `".concat(name, "`. Expected one of: ") + "[".concat(Object.keys(fontFamilies).join(', '), "]"));
+    throw new Error(
+      `Unable to find font family: \`${name}\`. Expected one of: [${Object.keys(fontFamilies).join(", ")}]`
+    );
   }
   return {
     fontFamily: fontFamilies[name]
   };
 }
 
-/**
- * Copyright OctaviaFlow
- * Author: Vishal Kumar
- * Created: 11/November/2025
- * 
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-var fontWeights = {
+const fontWeights = {
   light: 300,
   regular: 400,
   semibold: 600
 };
 function fontWeight(weight) {
   if (!fontWeights[weight]) {
-    throw new Error("Unable to find font weight: `".concat(weight, "`. Expected one of: ") + "[".concat(Object.keys(fontWeights).join(', '), "]"));
+    throw new Error(
+      `Unable to find font weight: \`${weight}\`. Expected one of: [${Object.keys(fontWeights).join(", ")}]`
+    );
   }
   return {
     fontWeight: fontWeights[weight]
   };
 }
 
-/**
- * Copyright OctaviaFlow
- * Author: Vishal Kumar
- * Created: 11/November/2025
- * 
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
 function print(block) {
-  return Object.keys(block).reduce(function (acc, key, index) {
-    // Short-circuit on the foreign key 'breakpoints'. This is used in our
-    // tokens for fluid type and should not be printed. In the future, we should
-    // tie this to media query outputs.
-    if (key === 'breakpoints') {
+  return Object.keys(block).reduce((acc, key, index) => {
+    if (key === "breakpoints") {
       return acc;
     }
-    var property = "".concat(paramCase(key), ": ").concat(block[key], ";");
+    const property = `${paramCase(key)}: ${block[key]};`;
     if (index === 0) {
       return property;
     }
-    return acc + '\n' + property;
-  }, '');
+    return acc + "\n" + property;
+  }, "");
 }
 function paramCase(string) {
-  var result = '';
-  for (var i = 0; i < string.length; i++) {
-    var character = string[i];
+  let result = "";
+  for (let i = 0; i < string.length; i++) {
+    const character = string[i];
     if (character === character.toUpperCase()) {
-      result += '-' + character.toLowerCase();
+      result += "-" + character.toLowerCase();
       continue;
     }
     result += character;
@@ -87,24 +59,16 @@ function paramCase(string) {
   return result;
 }
 
-/**
- * Copyright OctaviaFlow
- * Author: Vishal Kumar
- * Created: 11/November/2025
- * 
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-var reset = {
+const reset = {
   html: {
     fontSize: px(baseFontSize)
   },
   body: {
     fontFamily: fontFamilies.sans,
     fontWeight: fontWeights.regular,
-    textRendering: 'optimizeLegibility',
-    '-webkit-font-smoothing': 'antialiased',
-    '-moz-osx-font-smoothing': 'grayscale'
+    textRendering: "optimizeLegibility",
+    "-webkit-font-smoothing": "antialiased",
+    "-moz-osx-font-smoothing": "grayscale"
   },
   strong: {
     fontWeight: fontWeights.semibold
@@ -114,242 +78,173 @@ var reset = {
   }
 };
 
-/**
- * Copyright OctaviaFlow
- * Author: Vishal Kumar
- * Created: 11/November/2025
- * 
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-/**
- * Get the type size for the given step
- * @param {number} step
- * @returns {number}
- */
 function getTypeSize(step) {
   if (step <= 1) {
     return 12;
   }
-  // Yn = Yn-1 + {FLOOR[(n - 2) / 4] + 1} * 2
   return getTypeSize(step - 1) + Math.floor((step - 2) / 4 + 1) * 2;
 }
+const scale = [
+  12,
+  14,
+  16,
+  18,
+  20,
+  24,
+  28,
+  32,
+  36,
+  42,
+  48,
+  54,
+  60,
+  68,
+  76,
+  84,
+  92,
+  102,
+  112,
+  122,
+  132,
+  144,
+  156
+];
 
-/**
- * The default type scale for 23 steps. Inlined as an array here through running
- * the follow step:
- *
- * > Array.from({ length: 23 }, (_, i) => getTypeSize(i + 1))
- */
-var scale = [12, 14, 16, 18, 20, 24, 28, 32, 36, 42, 48, 54, 60, 68, 76, 84, 92, 102, 112, 122, 132, 144, 156];
-
-function _defineProperty(e, r, t) {
-  return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
-    value: t,
-    enumerable: !0,
-    configurable: !0,
-    writable: !0
-  }) : e[r] = t, e;
-}
-function ownKeys(e, r) {
-  var t = Object.keys(e);
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(e);
-    r && (o = o.filter(function (r) {
-      return Object.getOwnPropertyDescriptor(e, r).enumerable;
-    })), t.push.apply(t, o);
-  }
-  return t;
-}
-function _objectSpread2(e) {
-  for (var r = 1; r < arguments.length; r++) {
-    var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
-      _defineProperty(e, r, t[r]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
-      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
-    });
-  }
-  return e;
-}
-function _objectWithoutProperties(e, t) {
-  if (null == e) return {};
-  var o,
-    r,
-    i = _objectWithoutPropertiesLoose(e, t);
-  if (Object.getOwnPropertySymbols) {
-    var n = Object.getOwnPropertySymbols(e);
-    for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
-  }
-  return i;
-}
-function _objectWithoutPropertiesLoose(r, e) {
-  if (null == r) return {};
-  var t = {};
-  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
-    if (-1 !== e.indexOf(n)) continue;
-    t[n] = r[n];
-  }
-  return t;
-}
-function _toPrimitive(t, r) {
-  if ("object" != typeof t || !t) return t;
-  var e = t[Symbol.toPrimitive];
-  if (void 0 !== e) {
-    var i = e.call(t, r || "default");
-    if ("object" != typeof i) return i;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return ("string" === r ? String : Number)(t);
-}
-function _toPropertyKey(t) {
-  var i = _toPrimitive(t, "string");
-  return "symbol" == typeof i ? i : i + "";
-}
-function _typeof(o) {
-  "@babel/helpers - typeof";
-
-  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
-    return typeof o;
-  } : function (o) {
-    return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
-  }, _typeof(o);
-}
-
-var caption01$1 = {
+const caption01$1 = {
   fontSize: rem(scale[0]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.33333,
   letterSpacing: px(0.32)
 };
-var caption02$1 = {
+const caption02$1 = {
   fontSize: rem(scale[1]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.28572,
   letterSpacing: px(0.32)
 };
-var label01$1 = {
+const label01$1 = {
   fontSize: rem(scale[0]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.33333,
   letterSpacing: px(0.32)
 };
-var label02$1 = {
+const label02$1 = {
   fontSize: rem(scale[1]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.28572,
   letterSpacing: px(0.16)
 };
-var helperText01$1 = {
+const helperText01$1 = {
   fontSize: rem(scale[0]),
   lineHeight: 1.33333,
   letterSpacing: px(0.32)
 };
-var helperText02$1 = {
+const helperText02$1 = {
   fontSize: rem(scale[1]),
   lineHeight: 1.28572,
   letterSpacing: px(0.16)
 };
-var bodyShort01$1 = {
+const bodyShort01$1 = {
   fontSize: rem(scale[1]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.28572,
   letterSpacing: px(0.16)
 };
-var bodyLong01$1 = {
+const bodyLong01$1 = {
   fontSize: rem(scale[1]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.42857,
   letterSpacing: px(0.16)
 };
-var bodyShort02$1 = {
+const bodyShort02$1 = {
   fontSize: rem(scale[2]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.375,
   letterSpacing: 0
 };
-var bodyLong02$1 = {
+const bodyLong02$1 = {
   fontSize: rem(scale[2]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.5,
   letterSpacing: 0
 };
-var code01$1 = {
+const code01$1 = {
   fontFamily: fontFamilies.mono,
   fontSize: rem(scale[0]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.33333,
   letterSpacing: px(0.32)
 };
-var code02$1 = {
+const code02$1 = {
   fontFamily: fontFamilies.mono,
   fontSize: rem(scale[1]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.42857,
   letterSpacing: px(0.32)
 };
-var heading01$1 = {
+const heading01$1 = {
   fontSize: rem(scale[1]),
   fontWeight: fontWeights.semibold,
   lineHeight: 1.42857,
   letterSpacing: px(0.16)
 };
-var productiveHeading01$1 = {
+const productiveHeading01$1 = {
   fontSize: rem(scale[1]),
   fontWeight: fontWeights.semibold,
   lineHeight: 1.28572,
   letterSpacing: px(0.16)
 };
-var heading02$1 = {
+const heading02$1 = {
   fontSize: rem(scale[2]),
   fontWeight: fontWeights.semibold,
   lineHeight: 1.5,
   letterSpacing: 0
 };
-var productiveHeading02$1 = {
+const productiveHeading02$1 = {
   fontSize: rem(scale[2]),
   fontWeight: fontWeights.semibold,
   lineHeight: 1.375,
   letterSpacing: 0
 };
-var productiveHeading03$1 = {
+const productiveHeading03$1 = {
   fontSize: rem(scale[4]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.4,
   letterSpacing: 0
 };
-var productiveHeading04$1 = {
+const productiveHeading04$1 = {
   fontSize: rem(scale[6]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.28572,
   letterSpacing: 0
 };
-var productiveHeading05$1 = {
+const productiveHeading05$1 = {
   fontSize: rem(scale[7]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.25,
   letterSpacing: 0
 };
-var productiveHeading06$1 = {
+const productiveHeading06$1 = {
   fontSize: rem(scale[9]),
   fontWeight: fontWeights.light,
   lineHeight: 1.199,
   letterSpacing: 0
 };
-var productiveHeading07$1 = {
+const productiveHeading07$1 = {
   fontSize: rem(scale[11]),
   fontWeight: fontWeights.light,
   lineHeight: 1.199,
   letterSpacing: 0
 };
-var expressiveHeading01$1 = _objectSpread2(_objectSpread2({}, heading01$1), {}, {
+const expressiveHeading01$1 = {
+  ...heading01$1,
   lineHeight: 1.25
-});
-var expressiveHeading02$1 = _objectSpread2(_objectSpread2({}, heading02$1), {}, {
+};
+const expressiveHeading02$1 = {
+  ...heading02$1,
   lineHeight: 1.5
-});
-var expressiveHeading03$1 = {
+};
+const expressiveHeading03$1 = {
   fontSize: rem(scale[4]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.4,
@@ -365,7 +260,7 @@ var expressiveHeading03$1 = {
     }
   }
 };
-var expressiveHeading04$1 = {
+const expressiveHeading04$1 = {
   fontSize: rem(scale[6]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.28572,
@@ -382,7 +277,7 @@ var expressiveHeading04$1 = {
     }
   }
 };
-var expressiveHeading05$1 = {
+const expressiveHeading05$1 = {
   fontSize: rem(scale[7]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.25,
@@ -410,7 +305,7 @@ var expressiveHeading05$1 = {
     }
   }
 };
-var expressiveHeading06$1 = {
+const expressiveHeading06$1 = {
   fontSize: rem(scale[7]),
   fontWeight: fontWeights.semibold,
   lineHeight: 1.25,
@@ -441,7 +336,7 @@ var expressiveHeading06$1 = {
     }
   }
 };
-var expressiveParagraph01$1 = {
+const expressiveParagraph01$1 = {
   fontSize: rem(scale[5]),
   fontWeight: fontWeights.light,
   lineHeight: 1.334,
@@ -457,7 +352,7 @@ var expressiveParagraph01$1 = {
     }
   }
 };
-var quotation01$1 = {
+const quotation01$1 = {
   fontFamily: fontFamilies.serif,
   fontSize: rem(scale[4]),
   fontWeight: fontWeights.regular,
@@ -489,7 +384,7 @@ var quotation01$1 = {
     }
   }
 };
-var quotation02$1 = {
+const quotation02$1 = {
   fontFamily: fontFamilies.serif,
   fontSize: rem(scale[7]),
   fontWeight: fontWeights.light,
@@ -513,7 +408,7 @@ var quotation02$1 = {
     }
   }
 };
-var display01$1 = {
+const display01$1 = {
   fontSize: rem(scale[9]),
   fontWeight: fontWeights.light,
   lineHeight: 1.19,
@@ -535,7 +430,7 @@ var display01$1 = {
     }
   }
 };
-var display02$1 = {
+const display02$1 = {
   fontSize: rem(scale[9]),
   fontWeight: fontWeights.semibold,
   lineHeight: 1.19,
@@ -557,7 +452,7 @@ var display02$1 = {
     }
   }
 };
-var display03$1 = {
+const display03$1 = {
   fontSize: rem(scale[9]),
   fontWeight: fontWeights.light,
   lineHeight: 1.19,
@@ -583,7 +478,7 @@ var display03$1 = {
     }
   }
 };
-var display04$1 = {
+const display04$1 = {
   fontSize: rem(scale[9]),
   fontWeight: fontWeights.light,
   lineHeight: 1.19,
@@ -610,53 +505,40 @@ var display04$1 = {
     }
   }
 };
-
-// Type changes - V11
-
-// Small styles
-// No changes for code-01, code-02, label-01, label-02
-var legal01$1 = {
+const legal01$1 = {
   fontSize: rem(scale[0]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.33333,
   letterSpacing: px(0.32)
 };
-var legal02$1 = {
+const legal02$1 = {
   fontSize: rem(scale[1]),
   fontWeight: fontWeights.regular,
   lineHeight: 1.28572,
   letterSpacing: px(0.16)
 };
-
-// Body styles
-var bodyCompact01$1 = bodyShort01$1;
-var bodyCompact02$1 = bodyShort02$1;
-var body01$1 = bodyLong01$1;
-var body02$1 = bodyLong02$1;
-
-// Fixed heading styles
-var headingCompact01$1 = productiveHeading01$1;
-var headingCompact02$1 = productiveHeading02$1;
-var heading03$1 = productiveHeading03$1;
-var heading04$1 = productiveHeading04$1;
-var heading05$1 = productiveHeading05$1;
-var heading06$1 = productiveHeading06$1;
-var heading07$1 = productiveHeading07$1;
-
-// Fluid heading styles
-var fluidHeading03$1 = expressiveHeading03$1;
-var fluidHeading04$1 = expressiveHeading04$1;
-var fluidHeading05$1 = expressiveHeading05$1;
-var fluidHeading06$1 = expressiveHeading06$1;
-
-// Additional fluid styles
-var fluidParagraph01$1 = expressiveParagraph01$1;
-var fluidQuotation01$1 = quotation01$1;
-var fluidQuotation02$1 = quotation02$1;
-var fluidDisplay01$1 = display01$1;
-var fluidDisplay02$1 = display02$1;
-var fluidDisplay03$1 = display03$1;
-var fluidDisplay04$1 = display04$1;
+const bodyCompact01$1 = bodyShort01$1;
+const bodyCompact02$1 = bodyShort02$1;
+const body01$1 = bodyLong01$1;
+const body02$1 = bodyLong02$1;
+const headingCompact01$1 = productiveHeading01$1;
+const headingCompact02$1 = productiveHeading02$1;
+const heading03$1 = productiveHeading03$1;
+const heading04$1 = productiveHeading04$1;
+const heading05$1 = productiveHeading05$1;
+const heading06$1 = productiveHeading06$1;
+const heading07$1 = productiveHeading07$1;
+const fluidHeading03$1 = expressiveHeading03$1;
+const fluidHeading04$1 = expressiveHeading04$1;
+const fluidHeading05$1 = expressiveHeading05$1;
+const fluidHeading06$1 = expressiveHeading06$1;
+const fluidParagraph01$1 = expressiveParagraph01$1;
+const fluidQuotation01$1 = quotation01$1;
+const fluidQuotation02$1 = quotation02$1;
+const fluidDisplay01$1 = display01$1;
+const fluidDisplay02$1 = display02$1;
+const fluidDisplay03$1 = display03$1;
+const fluidDisplay04$1 = display04$1;
 
 var styles = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -720,41 +602,40 @@ var styles = /*#__PURE__*/Object.freeze({
   fluidDisplay04: fluidDisplay04$1
 });
 
-var _excluded = ["breakpoints"];
-var breakpointNames = Object.keys(breakpoints);
+const breakpointNames = Object.keys(breakpoints);
 function next(name) {
   return breakpointNames[breakpointNames.indexOf(name) + 1];
 }
 function fluid(selector) {
-  var fluidBreakpoints = selector.breakpoints,
-    styles = _objectWithoutProperties(selector, _excluded);
-  if (_typeof(fluidBreakpoints) !== 'object') {
+  const { breakpoints: fluidBreakpoints, ...styles } = selector;
+  if (typeof fluidBreakpoints !== "object") {
     return styles;
   }
-  var fluidBreakpointNames = Object.keys(fluidBreakpoints);
+  const fluidBreakpointNames = Object.keys(fluidBreakpoints);
   if (fluidBreakpointNames.length === 0) {
     return styles;
   }
-  styles.fontSize = fluidTypeSize(styles, 'sm', fluidBreakpoints);
-  fluidBreakpointNames.forEach(function (name) {
-    styles[breakpoint(name)] = _objectSpread2(_objectSpread2({}, fluidBreakpoints[name]), {}, {
+  styles.fontSize = fluidTypeSize(styles, "sm", fluidBreakpoints);
+  fluidBreakpointNames.forEach((name) => {
+    styles[breakpoint(name)] = {
+      ...fluidBreakpoints[name],
       fontSize: fluidTypeSize(styles, name, fluidBreakpoints)
-    });
+    };
   });
   return styles;
 }
 function fluidTypeSize(defaultStyles, fluidBreakpointName, fluidBreakpoints) {
-  var breakpoint = breakpoints[fluidBreakpointName];
-  var fluidBreakpoint = fluidBreakpointName === 'sm' ? defaultStyles : fluidBreakpoints[fluidBreakpointName];
-  var maxFontSize = defaultStyles.fontSize;
-  var minFontSize = defaultStyles.fontSize;
+  const breakpoint = breakpoints[fluidBreakpointName];
+  const fluidBreakpoint = fluidBreakpointName === "sm" ? defaultStyles : fluidBreakpoints[fluidBreakpointName];
+  let maxFontSize = defaultStyles.fontSize;
+  let minFontSize = defaultStyles.fontSize;
   if (fluidBreakpoint.fontSize) {
     minFontSize = fluidBreakpoint.fontSize;
   }
-  var maxViewportWidth = breakpoint.width;
-  var minViewportWidth = breakpoint.width;
-  var nextBreakpointAvailable = next(fluidBreakpointName);
-  var nextFluidBreakpointName = null;
+  let maxViewportWidth = breakpoint.width;
+  let minViewportWidth = breakpoint.width;
+  let nextBreakpointAvailable = next(fluidBreakpointName);
+  let nextFluidBreakpointName = null;
   while (nextBreakpointAvailable) {
     if (fluidBreakpoints[nextBreakpointAvailable]) {
       nextFluidBreakpointName = nextBreakpointAvailable;
@@ -763,10 +644,16 @@ function fluidTypeSize(defaultStyles, fluidBreakpointName, fluidBreakpoints) {
     nextBreakpointAvailable = next(nextBreakpointAvailable);
   }
   if (nextFluidBreakpointName) {
-    var nextFluidBreakpoint = breakpoints[nextFluidBreakpointName];
+    const nextFluidBreakpoint = breakpoints[nextFluidBreakpointName];
     maxFontSize = fluidBreakpoints[nextFluidBreakpointName].fontSize;
     maxViewportWidth = nextFluidBreakpoint.width;
-    return "calc(".concat(minFontSize, " + ").concat(subtract(maxFontSize, minFontSize), " * ((100vw - ").concat(minViewportWidth, ") / ").concat(subtract(maxViewportWidth, minViewportWidth), "))");
+    return `calc(${minFontSize} + ${subtract(
+      maxFontSize,
+      minFontSize
+    )} * ((100vw - ${minViewportWidth}) / ${subtract(
+      maxViewportWidth,
+      minViewportWidth
+    )}))`;
   }
   return minFontSize;
 }
@@ -774,77 +661,124 @@ function subtract(a, b) {
   return parseFloat(a) - parseFloat(b);
 }
 
-/**
- * Copyright OctaviaFlow
- * Author: Vishal Kumar
- * Created: 11/November/2025
- * 
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-// Unstable tokens
-var caption01 = 'caption01';
-var caption02 = 'caption02';
-var label01 = 'label01';
-var label02 = 'label02';
-var helperText01 = 'helperText01';
-var helperText02 = 'helperText02';
-var bodyShort01 = 'bodyShort01';
-var bodyLong01 = 'bodyLong01';
-var bodyShort02 = 'bodyShort02';
-var bodyLong02 = 'bodyLong02';
-var code01 = 'code01';
-var code02 = 'code02';
-var heading01 = 'heading01';
-var productiveHeading01 = 'productiveHeading01';
-var heading02 = 'heading02';
-var productiveHeading02 = 'productiveHeading02';
-var productiveHeading03 = 'productiveHeading03';
-var productiveHeading04 = 'productiveHeading04';
-var productiveHeading05 = 'productiveHeading05';
-var productiveHeading06 = 'productiveHeading06';
-var productiveHeading07 = 'productiveHeading07';
-var expressiveHeading01 = 'expressiveHeading01';
-var expressiveHeading02 = 'expressiveHeading02';
-var expressiveHeading03 = 'expressiveHeading03';
-var expressiveHeading04 = 'expressiveHeading04';
-var expressiveHeading05 = 'expressiveHeading05';
-var expressiveHeading06 = 'expressiveHeading06';
-var expressiveParagraph01 = 'expressiveParagraph01';
-var quotation01 = 'quotation01';
-var quotation02 = 'quotation02';
-var display01 = 'display01';
-var display02 = 'display02';
-var display03 = 'display03';
-var display04 = 'display04';
-// V11 Tokens
-var legal01 = 'legal01';
-var legal02 = 'legal02';
-var bodyCompact01 = 'bodyCompact01';
-var bodyCompact02 = 'bodyCompact02';
-var body01 = 'body01';
-var body02 = 'body02';
-var headingCompact01 = 'headingCompact01';
-var headingCompact02 = 'headingCompact02';
-var heading03 = 'heading03';
-var heading04 = 'heading04';
-var heading05 = 'heading05';
-var heading06 = 'heading06';
-var heading07 = 'heading07';
-var fluidHeading03 = 'fluidHeading03';
-var fluidHeading04 = 'fluidHeading04';
-var fluidHeading05 = 'fluidHeading05';
-var fluidHeading06 = 'fluidHeading06';
-var fluidParagraph01 = 'fluidParagraph01';
-var fluidQuotation01 = 'fluidQuotation01';
-var fluidQuotation02 = 'fluidQuotation02';
-var fluidDisplay01 = 'fluidDisplay01';
-var fluidDisplay02 = 'fluidDisplay02';
-var fluidDisplay03 = 'fluidDisplay03';
-var fluidDisplay04 = 'fluidDisplay04';
-var unstable_tokens = [caption01, caption02, label01, label02, helperText01, helperText02, bodyShort01, bodyLong01, bodyShort02, bodyLong02, code01, code02, heading01, productiveHeading01, heading02, productiveHeading02, productiveHeading03, productiveHeading04, productiveHeading05, productiveHeading06, productiveHeading07, expressiveHeading01, expressiveHeading02, expressiveHeading03, expressiveHeading04, expressiveHeading05, expressiveHeading06, expressiveParagraph01, quotation01, quotation02, display01, display02, display03, display04,
-// V11 Tokens
-legal01, legal02, bodyCompact01, bodyCompact02, body01, body02, headingCompact01, headingCompact02, heading03, heading04, heading05, heading06, heading07, fluidHeading03, fluidHeading04, fluidHeading05, fluidHeading06, fluidParagraph01, fluidQuotation01, fluidQuotation02, fluidDisplay01, fluidDisplay02, fluidDisplay03, fluidDisplay04];
+const caption01 = "caption01";
+const caption02 = "caption02";
+const label01 = "label01";
+const label02 = "label02";
+const helperText01 = "helperText01";
+const helperText02 = "helperText02";
+const bodyShort01 = "bodyShort01";
+const bodyLong01 = "bodyLong01";
+const bodyShort02 = "bodyShort02";
+const bodyLong02 = "bodyLong02";
+const code01 = "code01";
+const code02 = "code02";
+const heading01 = "heading01";
+const productiveHeading01 = "productiveHeading01";
+const heading02 = "heading02";
+const productiveHeading02 = "productiveHeading02";
+const productiveHeading03 = "productiveHeading03";
+const productiveHeading04 = "productiveHeading04";
+const productiveHeading05 = "productiveHeading05";
+const productiveHeading06 = "productiveHeading06";
+const productiveHeading07 = "productiveHeading07";
+const expressiveHeading01 = "expressiveHeading01";
+const expressiveHeading02 = "expressiveHeading02";
+const expressiveHeading03 = "expressiveHeading03";
+const expressiveHeading04 = "expressiveHeading04";
+const expressiveHeading05 = "expressiveHeading05";
+const expressiveHeading06 = "expressiveHeading06";
+const expressiveParagraph01 = "expressiveParagraph01";
+const quotation01 = "quotation01";
+const quotation02 = "quotation02";
+const display01 = "display01";
+const display02 = "display02";
+const display03 = "display03";
+const display04 = "display04";
+const legal01 = "legal01";
+const legal02 = "legal02";
+const bodyCompact01 = "bodyCompact01";
+const bodyCompact02 = "bodyCompact02";
+const body01 = "body01";
+const body02 = "body02";
+const headingCompact01 = "headingCompact01";
+const headingCompact02 = "headingCompact02";
+const heading03 = "heading03";
+const heading04 = "heading04";
+const heading05 = "heading05";
+const heading06 = "heading06";
+const heading07 = "heading07";
+const fluidHeading03 = "fluidHeading03";
+const fluidHeading04 = "fluidHeading04";
+const fluidHeading05 = "fluidHeading05";
+const fluidHeading06 = "fluidHeading06";
+const fluidParagraph01 = "fluidParagraph01";
+const fluidQuotation01 = "fluidQuotation01";
+const fluidQuotation02 = "fluidQuotation02";
+const fluidDisplay01 = "fluidDisplay01";
+const fluidDisplay02 = "fluidDisplay02";
+const fluidDisplay03 = "fluidDisplay03";
+const fluidDisplay04 = "fluidDisplay04";
+const unstable_tokens = [
+  caption01,
+  caption02,
+  label01,
+  label02,
+  helperText01,
+  helperText02,
+  bodyShort01,
+  bodyLong01,
+  bodyShort02,
+  bodyLong02,
+  code01,
+  code02,
+  heading01,
+  productiveHeading01,
+  heading02,
+  productiveHeading02,
+  productiveHeading03,
+  productiveHeading04,
+  productiveHeading05,
+  productiveHeading06,
+  productiveHeading07,
+  expressiveHeading01,
+  expressiveHeading02,
+  expressiveHeading03,
+  expressiveHeading04,
+  expressiveHeading05,
+  expressiveHeading06,
+  expressiveParagraph01,
+  quotation01,
+  quotation02,
+  display01,
+  display02,
+  display03,
+  display04,
+  // V11 Tokens
+  legal01,
+  legal02,
+  bodyCompact01,
+  bodyCompact02,
+  body01,
+  body02,
+  headingCompact01,
+  headingCompact02,
+  heading03,
+  heading04,
+  heading05,
+  heading06,
+  heading07,
+  fluidHeading03,
+  fluidHeading04,
+  fluidHeading05,
+  fluidHeading06,
+  fluidParagraph01,
+  fluidQuotation01,
+  fluidQuotation02,
+  fluidDisplay01,
+  fluidDisplay02,
+  fluidDisplay03,
+  fluidDisplay04
+];
 
 export { body01$1 as body01, body02$1 as body02, bodyCompact01$1 as bodyCompact01, bodyCompact02$1 as bodyCompact02, bodyLong01$1 as bodyLong01, bodyLong02$1 as bodyLong02, bodyShort01$1 as bodyShort01, bodyShort02$1 as bodyShort02, caption01$1 as caption01, caption02$1 as caption02, code01$1 as code01, code02$1 as code02, display01$1 as display01, display02$1 as display02, display03$1 as display03, display04$1 as display04, expressiveHeading01$1 as expressiveHeading01, expressiveHeading02$1 as expressiveHeading02, expressiveHeading03$1 as expressiveHeading03, expressiveHeading04$1 as expressiveHeading04, expressiveHeading05$1 as expressiveHeading05, expressiveHeading06$1 as expressiveHeading06, expressiveParagraph01$1 as expressiveParagraph01, fluid, fluidDisplay01$1 as fluidDisplay01, fluidDisplay02$1 as fluidDisplay02, fluidDisplay03$1 as fluidDisplay03, fluidDisplay04$1 as fluidDisplay04, fluidHeading03$1 as fluidHeading03, fluidHeading04$1 as fluidHeading04, fluidHeading05$1 as fluidHeading05, fluidHeading06$1 as fluidHeading06, fluidParagraph01$1 as fluidParagraph01, fluidQuotation01$1 as fluidQuotation01, fluidQuotation02$1 as fluidQuotation02, fontFamilies, fontFamily, fontWeight, fontWeights, getTypeSize, heading01$1 as heading01, heading02$1 as heading02, heading03$1 as heading03, heading04$1 as heading04, heading05$1 as heading05, heading06$1 as heading06, heading07$1 as heading07, headingCompact01$1 as headingCompact01, headingCompact02$1 as headingCompact02, helperText01$1 as helperText01, helperText02$1 as helperText02, label01$1 as label01, label02$1 as label02, legal01$1 as legal01, legal02$1 as legal02, print, productiveHeading01$1 as productiveHeading01, productiveHeading02$1 as productiveHeading02, productiveHeading03$1 as productiveHeading03, productiveHeading04$1 as productiveHeading04, productiveHeading05$1 as productiveHeading05, productiveHeading06$1 as productiveHeading06, productiveHeading07$1 as productiveHeading07, quotation01$1 as quotation01, quotation02$1 as quotation02, reset, scale, styles, unstable_tokens };