(() => {
  window.componentRegistry ||= {};
  window.componentRegistry["src-web/slider/index.html"] = {"showcase":"<div class=\"panel\">\n          <div class=\"panel-heading\"><div class=\"panel-title\">SliderStandard / SliderCompact</div><div class=\"panel-note\">Gold range · graphite rail · blue/brass thumb</div></div>\n          <div class=\"panel-body\">\n            <div class=\"grid cols-3\" style=\"gap:12px\">\n              <div><div class=\"sample-label\">0% · Normal / CSS</div><div class=\"slider dnf-ui\" style=\"--value:0%;width:100%\"><div class=\"slider-track\"><span class=\"slider-range\"></span><i class=\"slider-thumb\"></i></div><span class=\"slider-value\">0%</span></div></div>\n              <div><div class=\"sample-label\">29% · Hover / CSS</div><div class=\"slider dnf-ui is-hover\" style=\"--value:29%;width:100%\"><div class=\"slider-track\"><span class=\"slider-range\"></span><i class=\"slider-thumb\"></i></div><span class=\"slider-value\">29%</span></div></div>\n              <div><div class=\"sample-label\">100% · Pressed / CSS</div><div class=\"slider dnf-ui is-pressed\" style=\"--value:100%;width:100%\"><div class=\"slider-track\"><span class=\"slider-range\"></span><i class=\"slider-thumb\"></i></div><span class=\"slider-value\">100%</span></div></div>\n            </div>\n            <div class=\"divider\"></div>\n            <div style=\"display:flex;gap:16px;align-items:center\">\n              <div class=\"slider compact dnf-ui\" data-slider role=\"slider\" tabindex=\"0\" aria-label=\"透明度\" aria-valuemin=\"0\" aria-valuemax=\"100\" aria-valuenow=\"40\" style=\"--value:40%\"><div class=\"slider-track\"><span class=\"slider-range\"></span><i class=\"slider-thumb\"></i></div><span class=\"slider-value\">40%</span></div>\n              <div class=\"slider dnf-ui disabled\" style=\"--value:65%;width:220px\"><div class=\"slider-track\"><span class=\"slider-range\"></span><i class=\"slider-thumb\"></i></div><span class=\"slider-value\">禁用</span></div>\n            </div>\n            <div class=\"spec-row\" style=\"margin-top:15px\"><span class=\"spec-chip captured\">Percent / Seconds / Ticks captured</span><span class=\"spec-chip derived\">Drag / Focus derived</span></div>\n          </div>\n        </div>"};
})();