[{"name":"Spor.Token.Color.Alias","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Alias, toCss, lightGrey, platinum, silver, steel, osloGrey, dimGrey, darkGrey, seaFoam, opal, river, celadon, pine, darkTeal, night, mint, seaMist, coralGreen, blueGreen, azure, greenHaze, primaryGreen, icyBlue, lightBlue, cloudy, sky, glacier, ocean, darkBlue, cornsilk, blonde, primrose, sunshine, banana, burntYellow, golden, bisque, champagne, rajah, saffron, pumpkin, chocolate, wood, lightRed, brightRed, white, black\n","unions":[{"name":"Alias","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"azure","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"banana","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"bisque","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"black","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"blonde","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"blueGreen","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"brightRed","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"burntYellow","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"celadon","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"champagne","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"chocolate","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"cloudy","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"coralGreen","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"cornsilk","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"darkBlue","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"darkGrey","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"darkTeal","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"dimGrey","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"glacier","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"golden","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"greenHaze","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"icyBlue","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"lightBlue","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"lightGrey","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"lightRed","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"mint","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"night","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"ocean","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"opal","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"osloGrey","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"pine","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"platinum","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"primaryGreen","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"primrose","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"pumpkin","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"rajah","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"river","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"saffron","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"seaFoam","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"seaMist","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"silver","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"sky","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"steel","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"sunshine","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"toCss","comment":" Convert Alias into Css.Color.\n","type":"Spor.Token.Color.Alias.Alias -> Css.Color"},{"name":"white","comment":" \n","type":"Spor.Token.Color.Alias.Alias"},{"name":"wood","comment":" \n","type":"Spor.Token.Color.Alias.Alias"}],"binops":[]},{"name":"Spor.Token.Color.Background","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Background, toCss, white, lightGrey\n","unions":[{"name":"Background","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"lightGrey","comment":" \n","type":"Spor.Token.Color.Background.Background"},{"name":"toCss","comment":" Convert Background into Css.Color.\n","type":"Spor.Token.Color.Background.Background -> Css.Color"},{"name":"white","comment":" \n","type":"Spor.Token.Color.Background.Background"}],"binops":[]},{"name":"Spor.Token.Color.Detail","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Detail, toCss, darkBlue, ocean, golden, burntYellow, wood, chocolate, pumpkin\n","unions":[{"name":"Detail","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"burntYellow","comment":" \n","type":"Spor.Token.Color.Detail.Detail"},{"name":"chocolate","comment":" \n","type":"Spor.Token.Color.Detail.Detail"},{"name":"darkBlue","comment":" \n","type":"Spor.Token.Color.Detail.Detail"},{"name":"golden","comment":" \n","type":"Spor.Token.Color.Detail.Detail"},{"name":"ocean","comment":" \n","type":"Spor.Token.Color.Detail.Detail"},{"name":"pumpkin","comment":" \n","type":"Spor.Token.Color.Detail.Detail"},{"name":"toCss","comment":" Convert Detail into Css.Color.\n","type":"Spor.Token.Color.Detail.Detail -> Css.Color"},{"name":"wood","comment":" \n","type":"Spor.Token.Color.Detail.Detail"}],"binops":[]},{"name":"Spor.Token.Color.Error","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Error, toCss, brightRed, lightRed\n","unions":[{"name":"Error","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"brightRed","comment":" Should only be used for errors and settings\n","type":"Spor.Token.Color.Error.Error"},{"name":"lightRed","comment":" Should only be used for error backgrounds\n","type":"Spor.Token.Color.Error.Error"},{"name":"toCss","comment":" Convert Error into Css.Color.\n","type":"Spor.Token.Color.Error.Error -> Css.Color"}],"binops":[]},{"name":"Spor.Token.Color.Linjetag","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Linjetag, toCss, lokaltog, lokaltogLight, regiontog, regiontogLight, regionEkspress, regionEkspressLight, fjerntog, fjerntogLight, flytog, flytogLight, vyBuss, vyBussLight, lokalbuss, lokalbussLight, ferge, fergeLight, trikk, trikkLight, tbane, tbaneLight, altTransport, altTransportLight\n","unions":[{"name":"Linjetag","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"altTransport","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"altTransportLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"ferge","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"fergeLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"fjerntog","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"fjerntogLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"flytog","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"flytogLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"lokalbuss","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"lokalbussLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"lokaltog","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"lokaltogLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"regionEkspress","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"regionEkspressLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"regiontog","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"regiontogLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"tbane","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"tbaneLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"toCss","comment":" Convert Linjetag into Css.Color.\n","type":"Spor.Token.Color.Linjetag.Linjetag -> Css.Color"},{"name":"trikk","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"trikkLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"vyBuss","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"},{"name":"vyBussLight","comment":" \n","type":"Spor.Token.Color.Linjetag.Linjetag"}],"binops":[]},{"name":"Spor.Token.Color.Main","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Main, toCss, darkTeal, primaryGreen, greenHaze, coralGreen, mint, white, darkGrey, osloGrey, platinum, lightGrey\n","unions":[{"name":"Main","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"coralGreen","comment":" \n","type":"Spor.Token.Color.Main.Main"},{"name":"darkGrey","comment":" \n","type":"Spor.Token.Color.Main.Main"},{"name":"darkTeal","comment":" \n","type":"Spor.Token.Color.Main.Main"},{"name":"greenHaze","comment":" \n","type":"Spor.Token.Color.Main.Main"},{"name":"lightGrey","comment":" \n","type":"Spor.Token.Color.Main.Main"},{"name":"mint","comment":" \n","type":"Spor.Token.Color.Main.Main"},{"name":"osloGrey","comment":" \n","type":"Spor.Token.Color.Main.Main"},{"name":"platinum","comment":" \n","type":"Spor.Token.Color.Main.Main"},{"name":"primaryGreen","comment":" \n","type":"Spor.Token.Color.Main.Main"},{"name":"toCss","comment":" Convert Main into Css.Color.\n","type":"Spor.Token.Color.Main.Main -> Css.Color"},{"name":"white","comment":" \n","type":"Spor.Token.Color.Main.Main"}],"binops":[]},{"name":"Spor.Token.Color.Outline","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Outline, toCss, osloGrey, greenHaze, darkGrey, black\n","unions":[{"name":"Outline","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"black","comment":" \n","type":"Spor.Token.Color.Outline.Outline"},{"name":"darkGrey","comment":" \n","type":"Spor.Token.Color.Outline.Outline"},{"name":"greenHaze","comment":" Used for focus state outlines\n","type":"Spor.Token.Color.Outline.Outline"},{"name":"osloGrey","comment":" Used on tertiary buttons, cards and separators, among others\n","type":"Spor.Token.Color.Outline.Outline"},{"name":"toCss","comment":" Convert Outline into Css.Color.\n","type":"Spor.Token.Color.Outline.Outline -> Css.Color"}],"binops":[]},{"name":"Spor.Token.Color.Palette","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Palette, toCss, grey50, grey100, grey200, grey300, grey400, grey500, grey600, teal50, teal100, teal200, teal300, teal400, teal500, teal600, green50, green100, green200, green300, green400, green500, green600, blue50, blue100, blue200, blue300, blue400, blue500, blue600, yellow50, yellow100, yellow200, yellow300, yellow400, yellow500, yellow600, orange50, orange100, orange200, orange300, orange400, orange500, orange600, red50, red600, white, black, whiteAlpha100, whiteAlpha200, whiteAlpha300, whiteAlpha400, whiteAlpha500, whiteAlpha600, whiteAlpha700, whiteAlpha800, whiteAlpha900, blackAlpha100, blackAlpha200, blackAlpha300, blackAlpha400, blackAlpha500, blackAlpha600, blackAlpha700, blackAlpha800, blackAlpha900\n","unions":[{"name":"Palette","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"black","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blackAlpha100","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blackAlpha200","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blackAlpha300","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blackAlpha400","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blackAlpha500","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blackAlpha600","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blackAlpha700","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blackAlpha800","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blackAlpha900","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blue100","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blue200","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blue300","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blue400","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blue50","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blue500","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"blue600","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"green100","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"green200","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"green300","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"green400","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"green50","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"green500","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"green600","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"grey100","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"grey200","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"grey300","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"grey400","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"grey50","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"grey500","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"grey600","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"orange100","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"orange200","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"orange300","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"orange400","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"orange50","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"orange500","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"orange600","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"red50","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"red600","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"teal100","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"teal200","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"teal300","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"teal400","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"teal50","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"teal500","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"teal600","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"toCss","comment":" Convert Palette into Css.Color.\n","type":"Spor.Token.Color.Palette.Palette -> Css.Color"},{"name":"white","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"whiteAlpha100","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"whiteAlpha200","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"whiteAlpha300","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"whiteAlpha400","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"whiteAlpha500","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"whiteAlpha600","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"whiteAlpha700","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"whiteAlpha800","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"whiteAlpha900","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"yellow100","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"yellow200","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"yellow300","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"yellow400","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"yellow50","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"yellow500","comment":" \n","type":"Spor.Token.Color.Palette.Palette"},{"name":"yellow600","comment":" \n","type":"Spor.Token.Color.Palette.Palette"}],"binops":[]},{"name":"Spor.Token.Color.Product","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Product, toCss, ocean, wood\n","unions":[{"name":"Product","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"ocean","comment":" Used for the Smartpris product\n","type":"Spor.Token.Color.Product.Product"},{"name":"toCss","comment":" Convert Product into Css.Color.\n","type":"Spor.Token.Color.Product.Product -> Css.Color"},{"name":"wood","comment":" Used for the Flexbillett product\n","type":"Spor.Token.Color.Product.Product"}],"binops":[]},{"name":"Spor.Token.Color.Text","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Text, toCss, darkGrey, white, darkTeal\n","unions":[{"name":"Text","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"darkGrey","comment":" Used for typography and icons on light backgrounds\n","type":"Spor.Token.Color.Text.Text"},{"name":"darkTeal","comment":" Used primarily for links\n","type":"Spor.Token.Color.Text.Text"},{"name":"toCss","comment":" Convert Text into Css.Color.\n","type":"Spor.Token.Color.Text.Text -> Css.Color"},{"name":"white","comment":" Used for typography and icons on dark backgrounds\n","type":"Spor.Token.Color.Text.Text"}],"binops":[]},{"name":"Spor.Token.Depth.Shadow","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Shadow, toCss, sm, md, lg\n","unions":[{"name":"Shadow","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"lg","comment":" \n","type":"Spor.Token.Depth.Shadow.Shadow"},{"name":"md","comment":" \n","type":"Spor.Token.Depth.Shadow.Shadow"},{"name":"sm","comment":" \n","type":"Spor.Token.Depth.Shadow.Shadow"},{"name":"toCss","comment":" Convert Shadow into Css.Style.\n","type":"Spor.Token.Depth.Shadow.Shadow -> Css.Style"}],"binops":[]},{"name":"Spor.Token.Depth.ZIndex","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs ZIndex, toInt, hide, base, docked, dropdown, sticky, banner, overlay, modal, popover, skipLink, toast, tooltip\n","unions":[{"name":"ZIndex","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"banner","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"base","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"docked","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"dropdown","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"hide","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"modal","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"overlay","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"popover","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"skipLink","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"sticky","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"toInt","comment":" Convert ZIndex into Int.\n","type":"Spor.Token.Depth.ZIndex.ZIndex -> Basics.Int"},{"name":"toast","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"},{"name":"tooltip","comment":" \n","type":"Spor.Token.Depth.ZIndex.ZIndex"}],"binops":[]},{"name":"Spor.Token.Size.BorderRadius","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs BorderRadius, toCss, none, xs, sm, md, lg, xl, i2xl\n","unions":[{"name":"BorderRadius","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"i2xl","comment":" Should only be used for the app header\n","type":"Spor.Token.Size.BorderRadius.BorderRadius"},{"name":"lg","comment":" Should be used on larger components, like drawers\n","type":"Spor.Token.Size.BorderRadius.BorderRadius"},{"name":"md","comment":" Should be used for components with several components stacked vertically\n","type":"Spor.Token.Size.BorderRadius.BorderRadius"},{"name":"none","comment":" Should only be used for images, site headers, footers and article cards\n","type":"Spor.Token.Size.BorderRadius.BorderRadius"},{"name":"sm","comment":" The default. A single line of text is the most typical usecase\n","type":"Spor.Token.Size.BorderRadius.BorderRadius"},{"name":"toCss","comment":" Convert BorderRadius into Css.Px.\n","type":"Spor.Token.Size.BorderRadius.BorderRadius -> Css.Px"},{"name":"xl","comment":" Should be used for buttons, tags and labels. Provides a complete rounding effect for single lines of text\n","type":"Spor.Token.Size.BorderRadius.BorderRadius"},{"name":"xs","comment":" Should only be used for the smallest components, like tooltips and info boxes\n","type":"Spor.Token.Size.BorderRadius.BorderRadius"}],"binops":[]},{"name":"Spor.Token.Size.Breakpoint","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Breakpoint, toCss, sm, md, lg\n","unions":[{"name":"Breakpoint","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"lg","comment":" Large laptop screens\n","type":"Spor.Token.Size.Breakpoint.Breakpoint"},{"name":"md","comment":" Medium sized laptop screens\n","type":"Spor.Token.Size.Breakpoint.Breakpoint"},{"name":"sm","comment":" Phones in landscape mode, tablets in portrait mode\n","type":"Spor.Token.Size.Breakpoint.Breakpoint"},{"name":"toCss","comment":" Convert Breakpoint into Css.Px.\n","type":"Spor.Token.Size.Breakpoint.Breakpoint -> Css.Px"}],"binops":[]},{"name":"Spor.Token.Size.LineHeight","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs LineHeight, toFloat, heading, body\n","unions":[{"name":"LineHeight","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"body","comment":" \n","type":"Spor.Token.Size.LineHeight.LineHeight"},{"name":"heading","comment":" \n","type":"Spor.Token.Size.LineHeight.LineHeight"},{"name":"toFloat","comment":" Convert LineHeight into Float.\n","type":"Spor.Token.Size.LineHeight.LineHeight -> Basics.Float"}],"binops":[]},{"name":"Spor.Token.Size.Spacing","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Spacing, toCss, px3, px6, px9, px12, px18, px24, px30, px36, px42, px54, px72, px90, px120, px180, i3xs, i2xs, xs, sm, md, lg, xl, i2xl, i3xl, i4xl, i5xl, i6xl, i7xl, i8xl\n","unions":[{"name":"Spacing","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"i2xl","comment":" 36px. This is 6x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"i2xs","comment":" 6px. This is the base value - all others are multiples of this\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"i3xl","comment":" 42px. This is 7x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"i3xs","comment":" 3px. This is 0.5x the base size. Should only be used as  baseline grid\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"i4xl","comment":" 54px. This is 9x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"i5xl","comment":" 72px. This is 12x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"i6xl","comment":" 90px. This is 15x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"i7xl","comment":" 120px. This is 20x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"i8xl","comment":" 180px. This is 30x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"lg","comment":" 24px. This is 4x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"md","comment":" 18px. This is 3x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px12","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px120","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px18","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px180","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px24","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px3","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px30","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px36","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px42","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px54","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px6","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px72","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px9","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"px90","comment":" \n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"sm","comment":" 12px. This is 2x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"toCss","comment":" Convert Spacing into Css.Px.\n","type":"Spor.Token.Size.Spacing.Spacing -> Css.Px"},{"name":"xl","comment":" 30px. This is 5x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"},{"name":"xs","comment":" 9px. This 1.5x the base size\n","type":"Spor.Token.Size.Spacing.Spacing"}],"binops":[]},{"name":"Spor.Token.Size.Stroke","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Stroke, toCss, sm, md, lg\n","unions":[{"name":"Stroke","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"lg","comment":" \n","type":"Spor.Token.Size.Stroke.Stroke"},{"name":"md","comment":" \n","type":"Spor.Token.Size.Stroke.Stroke"},{"name":"sm","comment":" \n","type":"Spor.Token.Size.Stroke.Stroke"},{"name":"toCss","comment":" Convert Stroke into Css.Px.\n","type":"Spor.Token.Size.Stroke.Stroke -> Css.Px"}],"binops":[]},{"name":"Spor.Token.Time.Transition","comment":" This module was automaticly generated by the [spor-design-tokens](https://github.com/nsbno/spor) project.\n\n@docs Transition, toString, slow, medium, fast\n","unions":[{"name":"Transition","comment":" An opaque type representing a ${this.name} value.\n","args":[],"cases":[]}],"aliases":[],"values":[{"name":"fast","comment":" Should be used for quick transitions between similar states.\n","type":"Spor.Token.Time.Transition.Transition"},{"name":"medium","comment":" Should be used for medium transitions. Works great for when elements are moving, or when animating width or height\n","type":"Spor.Token.Time.Transition.Transition"},{"name":"slow","comment":" Should be used when you need a slower animation. Works great for large objects, or when the animated element is moving a larger distance\n","type":"Spor.Token.Time.Transition.Transition"},{"name":"toString","comment":" Convert Transition into String.\n","type":"Spor.Token.Time.Transition.Transition -> String.String"}],"binops":[]}]