import './async-D55cHugf.js';
import { c as spread_props, a as attr } from './index-K3l_dLem.js';
import './2-BYQShRaz.js';
import { G as Gradio } from './utils.svelte-DcXWObof.js';
import { B as Block } from './Block-qDbnR9DW.js';
import { B as BlockTitle } from './BlockTitle-CIA4Cwld.js';
import './MarkdownCode.svelte_svelte_type_style_lang-MeOh5TfF.js';
import { S as Static } from './index3-DWk8IezT.js';
import { e as escape_html } from './escaping-CBnpiEl5.js';
import './context-DF4-UEpk.js';
import './index5-BZVOFaHm.js';
import './dev-fallback-B-RpELjM.js';
import './index-Cg-Pg6j3.js';
import './Info-BG_G1YGk.js';
import './MarkdownCode-DlJpAOAo.js';
import './index35-D4X1IPn5.js';
import 'path';
import 'url';
import 'fs';
import './html-CfyvkLET.js';
import './prism-python-3BtLB3SS.js';
import './IconButton-BOK4HpdV.js';
import './Clear-DH-TDCgr.js';

let _id = 0;
function Index($$renderer, $$props) {
  $$renderer.component(($$renderer2) => {
    let { $$slots, $$events, ...props } = $$props;
    let gradio = new Gradio(props);
    gradio.props.value;
    gradio.props.value;
    const id = `range_id_${_id++}`;
    let minimum_value = gradio.props.minimum ?? 0;
    (() => {
      const min = gradio.props.minimum;
      const max = gradio.props.maximum;
      const val = gradio.props.value;
      if (val > max) {
        return 100;
      } else if (val < min) {
        return 0;
      }
      return (val - min) / (max - min) * 100;
    })();
    let disabled = !gradio.shared.interactive;
    Block($$renderer2, {
      visible: gradio.shared.visible,
      elem_id: gradio.shared.elem_id,
      elem_classes: gradio.shared.elem_classes,
      container: gradio.shared.container,
      scale: gradio.shared.scale,
      min_width: gradio.shared.min_width,
      children: ($$renderer3) => {
        Static($$renderer3, spread_props([
          { autoscroll: gradio.shared.autoscroll, i18n: gradio.i18n },
          gradio.shared.loading_status,
          {
            on_clear_status: () => gradio.dispatch("clear_status", gradio.shared.loading_status)
          }
        ]));
        $$renderer3.push(`<!----> <div class="wrap svelte-8epfm4"><div class="head svelte-8epfm4"><label${attr("for", id)} class="svelte-8epfm4">`);
        BlockTitle($$renderer3, {
          show_label: gradio.shared.show_label,
          info: gradio.props.info,
          children: ($$renderer4) => {
            $$renderer4.push(`<!---->${escape_html(gradio.shared.label || "Slider")}`);
          },
          $$slots: { default: true }
        });
        $$renderer3.push(`<!----></label> <div class="tab-like-container svelte-8epfm4"><input${attr("aria-label", `number input for ${gradio.shared.label}`)} data-testid="number-input" type="number"${attr("value", gradio.props.value)}${attr("min", gradio.props.minimum)}${attr("max", gradio.props.maximum)}${attr("step", gradio.props.step)}${attr("disabled", disabled, true)} class="svelte-8epfm4"/> `);
        if (gradio.props.buttons?.includes("reset") ?? true) {
          $$renderer3.push("<!--[-->");
          $$renderer3.push(`<button class="reset-button svelte-8epfm4"${attr("disabled", disabled, true)} aria-label="Reset to default value" data-testid="reset-button">↺</button>`);
        } else {
          $$renderer3.push("<!--[!-->");
        }
        $$renderer3.push(`<!--]--></div></div> <div class="slider_input_container svelte-8epfm4"><span class="min_value svelte-8epfm4">${escape_html(minimum_value)}</span> <input type="range"${attr("id", id)} name="cowbell"${attr("value", gradio.props.value)}${attr("min", gradio.props.minimum)}${attr("max", gradio.props.maximum)}${attr("step", gradio.props.step)}${attr("disabled", disabled, true)}${attr("aria-label", `range slider for ${gradio.shared.label}`)} class="svelte-8epfm4"/> <span class="max_value svelte-8epfm4">${escape_html(gradio.props.maximum)}</span></div></div>`);
      },
      $$slots: { default: true }
    });
  });
}

export { Index as default };
//# sourceMappingURL=Index33-BaGfhLMD.js.map
