[{"data":1,"prerenderedAt":5},["ShallowReactive",2],{"tux-codeblock:vue:github-light:q371jy":3,"tux-codeblock:vue:github-light:-gwzpt8":4},"\u003Cpre class=\"shiki github-light\" style=\"background-color:#fff;color:#24292e\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\"><\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">TuxSpectrumRibbon\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">  size\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"md\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  :\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\">show-labels\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\">false\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  :\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\">rounded\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\">false\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">\u002F>\u003C\u002Fspan>\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>","\u003Cpre class=\"shiki github-light\" style=\"background-color:#fff;color:#24292e\" tabindex=\"0\">\u003Ccode>\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\"><\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">script\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\"> setup\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\"> lang\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"ts\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\">\u002F**\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> * TuxSpectrumRibbon — The 5-band institutional brand spectrum ribbon.\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> *\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> * Direct parity with the flagship brand strip featured on my.tti.tamu.edu\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> * and across the new TTI Communications design system rollout.\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> *\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> * Bands:\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> *   1. TTI Maroon\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> *   2. Slate Blue\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> *   3. Slate Teal\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> *   4. Sage Green\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> *   5. Ochre Gold\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\"> *\u002F\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">export\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\"> interface\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\"> SpectrumBand\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  name\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">:\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> string\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  colorClass\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">:\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> string\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  hex\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">:\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> string\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  label\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">?:\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> string\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">}\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">interface\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\"> Props\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\">  \u002F** Height tier of the ribbon for horizontal layout. *\u002F\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  size\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">?:\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"xs\"\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\"> |\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"sm\"\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\"> |\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"md\"\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\"> |\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"lg\"\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\"> |\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"xl\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\">  \u002F** Layout orientation: horizontal strip or vertical column. *\u002F\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  orientation\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">?:\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"horizontal\"\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\"> |\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"vertical\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\">  \u002F** Whether to render division\u002Fcategory text labels within or beside the bands. *\u002F\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  showLabels\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">?:\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> boolean\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\">  \u002F** Whether corners are rounded (sm) or sharp 0px (default). *\u002F\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  rounded\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">?:\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> boolean\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\">  \u002F** Accessible label describing the ribbon for assistive technologies. *\u002F\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  ariaLabel\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">?:\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> string\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6A737D\">  \u002F** Custom list of bands if overriding the canonical five. *\u002F\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#E36209\">  bands\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">?:\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\"> SpectrumBand\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">[];\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">}\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">const\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> props\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\"> withDefaults\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">(\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\">defineProps\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"><\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\">Props\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">>(), {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  size: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"sm\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">,\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  orientation: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"horizontal\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">,\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  showLabels: \u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\">false\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">,\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  rounded: \u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\">false\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">,\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  ariaLabel: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"TTI Institutional Brand Spectrum\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">,\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">  bands\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: () \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">=>\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> [\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">    { name: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"maroon\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, colorClass: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"bg-spectrum-maroon\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, hex: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"var(--color-spectrum-maroon, #701D35)\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, label: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"Maroon\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> },\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">    { name: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"blue\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, colorClass: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"bg-spectrum-blue\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, hex: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"var(--color-spectrum-blue, #566A8A)\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, label: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"Slate Blue\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> },\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">    { name: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"teal\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, colorClass: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"bg-spectrum-teal\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, hex: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"var(--color-spectrum-teal, #66999B)\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, label: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"Slate Teal\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> },\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">    { name: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"green\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, colorClass: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"bg-spectrum-green\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, hex: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"var(--color-spectrum-green, #849974)\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, label: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"Sage Green\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> },\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">    { name: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"gold\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, colorClass: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"bg-spectrum-gold\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, hex: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"var(--color-spectrum-gold, #E5B350)\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">, label: \u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"Ochre Gold\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> },\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  ],\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">});\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">const\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> heightClass\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\"> computed\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">(() \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">=>\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">  if\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> (props.orientation \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">===\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"vertical\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">) \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"w-full\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">  switch\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> (props.size) {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"xs\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"h-1\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"sm\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"h-1.5\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"md\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"h-3\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"lg\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"h-6\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"xl\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"h-10\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    default\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"h-1.5\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  }\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">});\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">const\u003C\u002Fspan>\u003Cspan style=\"color:#005CC5\"> widthClass\u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\"> =\u003C\u002Fspan>\u003Cspan style=\"color:#6F42C1\"> computed\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">(() \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">=>\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">  if\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> (props.orientation \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">===\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"horizontal\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">) \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"w-full\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">  switch\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\"> (props.size) {\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"xs\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"w-1\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"sm\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"w-1.5\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"md\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"w-3\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"lg\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"w-6\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    case\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"xl\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"w-10\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#D73A49\">    default\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">: \u003C\u002Fspan>\u003Cspan style=\"color:#D73A49\">return\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\"> \"w-1.5\"\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">;\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  }\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">});\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\"><\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">script\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\"><\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">template\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  <\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">div\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">    class\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"tux-spectrum-ribbon overflow-hidden select-none\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">    :class\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"[\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#032F62\">      orientation === 'horizontal' ? 'flex flex-row w-full' : 'flex flex-col h-full',\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#032F62\">      heightClass,\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#032F62\">      widthClass,\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#032F62\">      rounded ? 'rounded-md' : 'rounded-none'\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#032F62\">    ]\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">    role\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"img\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">    :aria-label\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"ariaLabel\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  >\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">    <\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">div\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">      v-for\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"band in bands\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">      :key\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"band.name\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">      class\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"flex-1 flex items-center justify-center transition-all min-w-0\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">      :class\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"band.colorClass\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">      :title\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"band.label || band.name\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">    >\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">      <\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">span\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">        v-if\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"showLabels && band.label && (size === 'lg' || size === 'xl')\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#6F42C1\">        class\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">=\u003C\u002Fspan>\u003Cspan style=\"color:#032F62\">\"text-[11px] font-bold text-white uppercase tracking-wider px-2 truncate\"\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">      >\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">        {{ band.label }}\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">      <\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">span\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">    <\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">div\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\">  <\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">div\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003Cspan style=\"color:#24292E\"><\u002F\u003C\u002Fspan>\u003Cspan style=\"color:#22863A\">template\u003C\u002Fspan>\u003Cspan style=\"color:#24292E\">>\u003C\u002Fspan>\u003C\u002Fspan>\n\u003Cspan class=\"line\">\u003C\u002Fspan>\u003C\u002Fcode>\u003C\u002Fpre>",1792952333655]