@servicetitan/hammer-token 0.0.0-rc-1.48.0-20251104214834 → 0.0.0-rc-3.0.0-20260114215531

package/build/web/core/primitive.js

@@ -1,124 +1,380 @@
+/**
+ * @typedef {Object} TokenValue
+ * @property {string} value
+ */
+
+/**
+ * @typedef {Object} TokenWithAppearance
+ * @property {string} value
+ * @property {Object} extensions
+ * @property {Object} extensions.appearance
+ * @property {Object} extensions.appearance.dark
+ * @property {string} extensions.appearance.dark.value
+ */
+
+/** @type {TokenValue} */
 export const BreakpointSm = { value: "640px" };
+/** @type {TokenValue} */
 export const BreakpointMd = { value: "768px" };
+/** @type {TokenValue} */
 export const BreakpointLg = { value: "1024px" };
+/** @type {TokenValue} */
 export const BreakpointXl = { value: "1280px" };
+/** @type {TokenValue} */
 export const BreakpointXxl = { value: "1536px" };
-export const ColorBlue100 = { value: "#e0f2ff" };
-export const ColorBlue200 = { value: "#b5deff" };
-export const ColorBlue300 = { value: "#78bbfa" };
-export const ColorBlue400 = { value: "#3892f3" };
-export const ColorBlue500 = { value: "#0265dc" };
-export const ColorBlue600 = { value: "#004491" };
+/** @type {TokenValue} */
 export const ColorNeutral0 = { value: "#ffffff" };
+/** @type {TokenValue} */
 export const ColorNeutral10 = { value: "#fcfcfc" };
-export const ColorNeutral20 = { value: "#fafafa" };
-export const ColorNeutral30 = { value: "#f7f7f7" };
-export const ColorNeutral40 = { value: "#f5f5f5" };
+/** @type {TokenValue} */
+export const ColorNeutral20 = { value: "#f9f9f9" };
+/** @type {TokenValue} */
+export const ColorNeutral30 = { value: "#f6f6f6" };
+/** @type {TokenValue} */
+export const ColorNeutral40 = { value: "#f1f1f1" };
+/** @type {TokenValue} */
 export const ColorNeutral50 = { value: "#eeeeee" };
-export const ColorNeutral60 = { value: "#dfe0e1" };
-export const ColorNeutral70 = { value: "#bcbcbd" };
-export const ColorNeutral80 = { value: "#949596" };
-export const ColorNeutral90 = { value: "#737475" };
-export const ColorNeutral100 = { value: "#606162" };
-export const ColorNeutral200 = { value: "#444445" };
-export const ColorNeutral300 = { value: "#2d2e31" };
-export const ColorNeutral400 = { value: "#141414" };
-export const ColorNeutral500 = { value: "#040404" };
-export const ColorBlueGrey100 = { value: "#eaeff2" };
-export const ColorBlueGrey200 = { value: "#d0d8dd" };
-export const ColorBlueGrey300 = { value: "#b4c1c8" };
-export const ColorBlueGrey400 = { value: "#8c9ca5" };
-export const ColorBlueGrey500 = { value: "#6a7a85" };
-export const ColorBlueGrey600 = { value: "#576671" };
-export const ColorOrange100 = { value: "#ffeccc" };
-export const ColorOrange200 = { value: "#fdd291" };
+/** @type {TokenValue} */
+export const ColorNeutral60 = { value: "#ebebeb" };
+/** @type {TokenValue} */
+export const ColorNeutral70 = { value: "#e8e8e8" };
+/** @type {TokenValue} */
+export const ColorNeutral80 = { value: "#e5e5e5" };
+/** @type {TokenValue} */
+export const ColorNeutral90 = { value: "#e2e2e2" };
+/** @type {TokenValue} */
+export const ColorNeutral100 = { value: "#dfdfdf" };
+/** @type {TokenValue} */
+export const ColorNeutral200 = { value: "#c4c4c4" };
+/** @type {TokenValue} */
+export const ColorNeutral300 = { value: "#a8a8a8" };
+/** @type {TokenValue} */
+export const ColorNeutral400 = { value: "#8b8b8b" };
+/** @type {TokenValue} */
+export const ColorNeutral500 = { value: "#707070" };
+/** @type {TokenValue} */
+export const ColorNeutral600 = { value: "#545454" };
+/** @type {TokenValue} */
+export const ColorNeutral700 = { value: "#404040" };
+/** @type {TokenValue} */
+export const ColorNeutral800 = { value: "#292929" };
+/** @type {TokenValue} */
+export const ColorNeutral900 = { value: "#1a1a1a" };
+/** @type {TokenValue} */
+export const ColorNeutral950 = { value: "#040404" };
+/** @type {TokenValue} */
+export const ColorBlue10 = { value: "#fafcff" };
+/** @type {TokenValue} */
+export const ColorBlue50 = { value: "#e6f1ff" };
+/** @type {TokenValue} */
+export const ColorBlue100 = { value: "#cce3ff" };
+/** @type {TokenValue} */
+export const ColorBlue200 = { value: "#9ecaff" };
+/** @type {TokenValue} */
+export const ColorBlue300 = { value: "#70b1ff" };
+/** @type {TokenValue} */
+export const ColorBlue400 = { value: "#3d95ff" };
+/** @type {TokenValue} */
+export const ColorBlue500 = { value: "#1a82ff" };
+/** @type {TokenValue} */
+export const ColorBlue600 = { value: "#0065de" };
+/** @type {TokenValue} */
+export const ColorBlue700 = { value: "#004da9" };
+/** @type {TokenValue} */
+export const ColorBlue800 = { value: "#003472" };
+/** @type {TokenValue} */
+export const ColorBlue900 = { value: "#002047" };
+/** @type {TokenValue} */
+export const ColorBlue950 = { value: "#000b19" };
+/** @type {TokenValue} */
+export const ColorRed10 = { value: "#fffbfa" };
+/** @type {TokenValue} */
+export const ColorRed50 = { value: "#ffe9e5" };
+/** @type {TokenValue} */
+export const ColorRed100 = { value: "#ffd4cc" };
+/** @type {TokenValue} */
+export const ColorRed200 = { value: "#ffac9e" };
+/** @type {TokenValue} */
+export const ColorRed300 = { value: "#ff8974" };
+/** @type {TokenValue} */
+export const ColorRed400 = { value: "#ff5b3d" };
+/** @type {TokenValue} */
+export const ColorRed500 = { value: "#ff3914" };
+/** @type {TokenValue} */
+export const ColorRed600 = { value: "#d62100" };
+/** @type {TokenValue} */
+export const ColorRed700 = { value: "#a31900" };
+/** @type {TokenValue} */
+export const ColorRed800 = { value: "#731100" };
+/** @type {TokenValue} */
+export const ColorRed900 = { value: "#470b00" };
+/** @type {TokenValue} */
+export const ColorRed950 = { value: "#0a0200" };
+/** @type {TokenValue} */
+export const ColorGreen10 = { value: "#f5fefb" };
+/** @type {TokenValue} */
+export const ColorGreen50 = { value: "#d3fded" };
+/** @type {TokenValue} */
+export const ColorGreen100 = { value: "#b8f5dd" };
+/** @type {TokenValue} */
+export const ColorGreen200 = { value: "#70ebbc" };
+/** @type {TokenValue} */
+export const ColorGreen300 = { value: "#3be3a2" };
+/** @type {TokenValue} */
+export const ColorGreen400 = { value: "#0bd085" };
+/** @type {TokenValue} */
+export const ColorGreen500 = { value: "#09a569" };
+/** @type {TokenValue} */
+export const ColorGreen600 = { value: "#077e50" };
+/** @type {TokenValue} */
+export const ColorGreen700 = { value: "#05613e" };
+/** @type {TokenValue} */
+export const ColorGreen800 = { value: "#04482e" };
+/** @type {TokenValue} */
+export const ColorGreen900 = { value: "#022c1c" };
+/** @type {TokenValue} */
+export const ColorGreen950 = { value: "#010f0a" };
+/** @type {TokenValue} */
+export const ColorBlueGrey10 = { value: "#f7f9fa" };
+/** @type {TokenValue} */
+export const ColorBlueGrey50 = { value: "#e9eef2" };
+/** @type {TokenValue} */
+export const ColorBlueGrey100 = { value: "#dce4ea" };
+/** @type {TokenValue} */
+export const ColorBlueGrey200 = { value: "#b9c9d5" };
+/** @type {TokenValue} */
+export const ColorBlueGrey300 = { value: "#99b1c2" };
+/** @type {TokenValue} */
+export const ColorBlueGrey400 = { value: "#7696ad" };
+/** @type {TokenValue} */
+export const ColorBlueGrey500 = { value: "#55768e" };
+/** @type {TokenValue} */
+export const ColorBlueGrey600 = { value: "#445e71" };
+/** @type {TokenValue} */
+export const ColorBlueGrey700 = { value: "#344856" };
+/** @type {TokenValue} */
+export const ColorBlueGrey800 = { value: "#24333d" };
+/** @type {TokenValue} */
+export const ColorBlueGrey900 = { value: "#192329" };
+/** @type {TokenValue} */
+export const ColorBlueGrey950 = { value: "#090d10" };
+/** @type {TokenValue} */
+export const ColorOrange10 = { value: "#fff8f1" };
+/** @type {TokenValue} */
+export const ColorOrange50 = { value: "#ffecd6" };
+/** @type {TokenValue} */
+export const ColorOrange100 = { value: "#ffddb7" };
+/** @type {TokenValue} */
+export const ColorOrange200 = { value: "#ffc07a" };
+/** @type {TokenValue} */
 export const ColorOrange300 = { value: "#ffa037" };
-export const ColorOrange400 = { value: "#e46f00" };
-export const ColorOrange500 = { value: "#b14c00" };
-export const ColorOrange600 = { value: "#7a2f00" };
-export const ColorYellow100 = { value: "#fff9e2" };
-export const ColorYellow200 = { value: "#fff0b1" };
-export const ColorYellow300 = { value: "#ffe278" };
-export const ColorYellow400 = { value: "#ffc902" };
-export const ColorYellow500 = { value: "#ffbe00" };
-export const ColorYellow600 = { value: "#de9500" };
-export const ColorGreen100 = { value: "#cef8e0" };
-export const ColorGreen200 = { value: "#89ecbc" };
-export const ColorGreen300 = { value: "#49cc93" };
-export const ColorGreen400 = { value: "#15a46e" };
-export const ColorGreen500 = { value: "#007a4d" };
-export const ColorGreen600 = { value: "#005132" };
-export const ColorCyan100 = { value: "#e3fcff" };
-export const ColorCyan200 = { value: "#b1f3fa" };
-export const ColorCyan300 = { value: "#13ceea" };
-export const ColorCyan400 = { value: "#08bfdf" };
-export const ColorCyan500 = { value: "#0ca5c0" };
-export const ColorCyan600 = { value: "#038299" };
-export const ColorPurple100 = { value: "#f1edff" };
-export const ColorPurple200 = { value: "#c1b6f2" };
-export const ColorPurple300 = { value: "#8772e5" };
-export const ColorPurple400 = { value: "#6954c0" };
-export const ColorPurple500 = { value: "#4f3a9e" };
-export const ColorPurple600 = { value: "#422799" };
-export const ColorRed100 = { value: "#ffece9" };
-export const ColorRed200 = { value: "#ffb2a0" };
-export const ColorRed300 = { value: "#ff745f" };
-export const ColorRed400 = { value: "#f94d32" };
-export const ColorRed500 = { value: "#e13212" };
-export const ColorRed600 = { value: "#bf2a00" };
-export const ColorMagenta100 = { value: "#fbeaf5" };
-export const ColorMagenta200 = { value: "#faafe2" };
-export const ColorMagenta300 = { value: "#d949a9" };
-export const ColorMagenta400 = { value: "#b52d88" };
-export const ColorMagenta500 = { value: "#982071" };
-export const ColorMagenta600 = { value: "#7d165b" };
-export const Duration = { value: "200ms" };
+/** @type {TokenValue} */
+export const ColorOrange400 = { value: "#f07e00" };
+/** @type {TokenValue} */
+export const ColorOrange500 = { value: "#c16500" };
+/** @type {TokenValue} */
+export const ColorOrange600 = { value: "#964f00" };
+/** @type {TokenValue} */
+export const ColorOrange700 = { value: "#693700" };
+/** @type {TokenValue} */
+export const ColorOrange800 = { value: "#4d2800" };
+/** @type {TokenValue} */
+export const ColorOrange900 = { value: "#2e1900" };
+/** @type {TokenValue} */
+export const ColorOrange950 = { value: "#140b00" };
+/** @type {TokenValue} */
+export const ColorCyan10 = { value: "#f2fcfe" };
+/** @type {TokenValue} */
+export const ColorCyan50 = { value: "#daf7fc" };
+/** @type {TokenValue} */
+export const ColorCyan100 = { value: "#c2f2fb" };
+/** @type {TokenValue} */
+export const ColorCyan200 = { value: "#7fe5f6" };
+/** @type {TokenValue} */
+export const ColorCyan300 = { value: "#45d8f2" };
+/** @type {TokenValue} */
+export const ColorCyan400 = { value: "#10c2e2" };
+/** @type {TokenValue} */
+export const ColorCyan500 = { value: "#0c9bb5" };
+/** @type {TokenValue} */
+export const ColorCyan600 = { value: "#0a7a8e" };
+/** @type {TokenValue} */
+export const ColorCyan700 = { value: "#075563" };
+/** @type {TokenValue} */
+export const ColorCyan800 = { value: "#05424d" };
+/** @type {TokenValue} */
+export const ColorCyan900 = { value: "#032025" };
+/** @type {TokenValue} */
+export const ColorCyan950 = { value: "#011013" };
+/** @type {TokenValue} */
+export const ColorPurple10 = { value: "#fbfaff" };
+/** @type {TokenValue} */
+export const ColorPurple50 = { value: "#eeecf9" };
+/** @type {TokenValue} */
+export const ColorPurple100 = { value: "#e7e5f6" };
+/** @type {TokenValue} */
+export const ColorPurple200 = { value: "#c8c2eb" };
+/** @type {TokenValue} */
+export const ColorPurple300 = { value: "#aea3e5" };
+/** @type {TokenValue} */
+export const ColorPurple400 = { value: "#9385db" };
+/** @type {TokenValue} */
+export const ColorPurple500 = { value: "#7766cc" };
+/** @type {TokenValue} */
+export const ColorPurple600 = { value: "#5f4cbd" };
+/** @type {TokenValue} */
+export const ColorPurple700 = { value: "#40318c" };
+/** @type {TokenValue} */
+export const ColorPurple800 = { value: "#2e2267" };
+/** @type {TokenValue} */
+export const ColorPurple900 = { value: "#17103a" };
+/** @type {TokenValue} */
+export const ColorPurple950 = { value: "#0e0928" };
+/** @type {TokenValue} */
+export const ColorMagenta10 = { value: "#fffafd" };
+/** @type {TokenValue} */
+export const ColorMagenta50 = { value: "#fae5f3" };
+/** @type {TokenValue} */
+export const ColorMagenta100 = { value: "#f8ddef" };
+/** @type {TokenValue} */
+export const ColorMagenta200 = { value: "#efb4db" };
+/** @type {TokenValue} */
+export const ColorMagenta300 = { value: "#ef8bce" };
+/** @type {TokenValue} */
+export const ColorMagenta400 = { value: "#ea62bd" };
+/** @type {TokenValue} */
+export const ColorMagenta500 = { value: "#d741a6" };
+/** @type {TokenValue} */
+export const ColorMagenta600 = { value: "#be288d" };
+/** @type {TokenValue} */
+export const ColorMagenta700 = { value: "#831b60" };
+/** @type {TokenValue} */
+export const ColorMagenta800 = { value: "#591342" };
+/** @type {TokenValue} */
+export const ColorMagenta900 = { value: "#26081c" };
+/** @type {TokenValue} */
+export const ColorMagenta950 = { value: "#15040f" };
+/** @type {TokenValue} */
+export const ColorYellow10 = { value: "#fffbf0" };
+/** @type {TokenValue} */
+export const ColorYellow50 = { value: "#ffeebd" };
+/** @type {TokenValue} */
+export const ColorYellow100 = { value: "#fff0c2" };
+/** @type {TokenValue} */
+export const ColorYellow200 = { value: "#ffdf80" };
+/** @type {TokenValue} */
+export const ColorYellow300 = { value: "#ffcf42" };
+/** @type {TokenValue} */
+export const ColorYellow400 = { value: "#ffbe00" };
+/** @type {TokenValue} */
+export const ColorYellow500 = { value: "#d6a000" };
+/** @type {TokenValue} */
+export const ColorYellow600 = { value: "#a87d00" };
+/** @type {TokenValue} */
+export const ColorYellow700 = { value: "#805f00" };
+/** @type {TokenValue} */
+export const ColorYellow800 = { value: "#574100" };
+/** @type {TokenValue} */
+export const ColorYellow900 = { value: "#291f00" };
+/** @type {TokenValue} */
+export const ColorYellow950 = { value: "#140f00" };
+/** @type {TokenValue} */
+export const DurationDefault = { value: "200ms" };
+/** @type {TokenValue} */
 export const DurationInstant = { value: "0ms" };
+/** @type {TokenValue} */
 export const DurationFast = { value: "100ms" };
+/** @type {TokenValue} */
 export const DurationSlow = { value: "300ms" };
+/** @type {TokenValue} */
 export const FontFamilyBase = { value: "'Nunito Sans', sans-serif" };
+/** @type {TokenValue} */
 export const FontFamilyDisplay = { value: "'Sofia Pro', SofiaPro, sans-serif" };
-export const FontLineHeightBase = { value: "1.5" };
-export const FontLineHeightDisplay = { value: "1.25" };
-export const FontWeightNormal = { value: "400" };
-export const FontWeightSemibold = { value: "600" };
-export const FontWeightBold = { value: "700" };
+/** @type {TokenValue} */
+export const FontLineHeightBase = { value: 1.5 };
+/** @type {TokenValue} */
+export const FontLineHeightDisplay = { value: 1.25 };
+/** @type {TokenValue} */
+export const FontWeightNormal = { value: 400 };
+/** @type {TokenValue} */
+export const FontWeightSemibold = { value: 600 };
+/** @type {TokenValue} */
+export const FontWeightBold = { value: 700 };
+/** @type {TokenValue} */
 export const FontSize100 = { value: "0.625rem" };
+/** @type {TokenValue} */
 export const FontSize200 = { value: "0.75rem" };
+/** @type {TokenValue} */
 export const FontSize300 = { value: "0.875rem" };
+/** @type {TokenValue} */
 export const FontSize400 = { value: "1rem" };
+/** @type {TokenValue} */
 export const FontSize500 = { value: "1.25rem" };
+/** @type {TokenValue} */
 export const FontSize600 = { value: "1.5rem" };
+/** @type {TokenValue} */
 export const FontSize700 = { value: "1.75rem" };
+/** @type {TokenValue} */
 export const FontSize800 = { value: "2rem" };
+/** @type {TokenValue} */
 export const FontSize900 = { value: "2.25rem" };
-export const Radius0 = { value: "0" };
+/** @type {TokenValue} */
+export const Radius0 = { value: "0rem" };
+/** @type {TokenValue} */
 export const Radius1 = { value: "0.1875rem" };
+/** @type {TokenValue} */
 export const Radius2 = { value: "0.375rem" };
+/** @type {TokenValue} */
 export const Radius3 = { value: "0.5625rem" };
+/** @type {TokenValue} */
 export const Radius4 = { value: "0.75rem" };
+/** @type {TokenValue} */
 export const Radius5 = { value: "0.9375rem" };
+/** @type {TokenValue} */
 export const Radius6 = { value: "1.125rem" };
+/** @type {TokenValue} */
 export const Radius7 = { value: "1.3125rem" };
+/** @type {TokenValue} */
 export const Radius8 = { value: "1.5rem" };
+/** @type {TokenValue} */
 export const Size0 = { value: "0rem" };
+/** @type {TokenValue} */
 export const Size1 = { value: "0.25rem" };
+/** @type {TokenValue} */
 export const Size2 = { value: "0.5rem" };
+/** @type {TokenValue} */
 export const Size3 = { value: "0.75rem" };
+/** @type {TokenValue} */
 export const Size4 = { value: "1rem" };
+/** @type {TokenValue} */
 export const Size5 = { value: "1.25rem" };
+/** @type {TokenValue} */
 export const Size6 = { value: "1.5rem" };
+/** @type {TokenValue} */
 export const Size7 = { value: "1.75rem" };
+/** @type {TokenValue} */
 export const Size8 = { value: "2rem" };
+/** @type {TokenValue} */
 export const Size9 = { value: "2.25rem" };
+/** @type {TokenValue} */
 export const Size10 = { value: "2.5rem" };
+/** @type {TokenValue} */
 export const Size11 = { value: "2.75rem" };
+/** @type {TokenValue} */
 export const Size12 = { value: "3rem" };
+/** @type {TokenValue} */
 export const Size13 = { value: "3.25rem" };
+/** @type {TokenValue} */
 export const Size14 = { value: "3.5rem" };
+/** @type {TokenValue} */
 export const SizeQuarter = { value: "0.0625rem" };
+/** @type {TokenValue} */
 export const SizeHalf = { value: "0.125rem" };
+/** @type {TokenValue} */
 export const TransitionEase = { value: "cubic-bezier(.4, 0, .2, 1)" };
+/** @type {TokenValue} */
 export const TransitionEaseIn = { value: "cubic-bezier(.4, 0, 1, 1)" };
+/** @type {TokenValue} */
 export const TransitionEaseOut = { value: "cubic-bezier(0, 0, .4, 1)" };
+/** @type {TokenValue} */
 export const TransitionEaseInOut = { value: "cubic-bezier(.4, 0, .6, 1)" };