1import { g as spread_props, d as bind_this, i as if_block, r as rest_props, a as set_attribute, t as remove_input_defaults } from './i18n-CGlVUOvE.js'; 2import { M as push, ab as state, ac as proxy, ad as user_effect, Z as get, $ as set, U as event, N as first_child, a4 as text, t as template_effect, a as append, Q as child, S as sibling, O as pop, a2 as user_derived, I as tick, av as $window, R as from_html, X as set_text, a5 as next, T as reset } from './index-Bq2njFOY.js'; 3import { b as bind_value } from './input-CXpCw23l.js'; 4import { G as Gradio } from './utils.svelte-Bi9ASwv9.js'; 5import { B as Block } from './Block-DNK-JdLJ.js'; 6import { B as BlockTitle } from './BlockTitle-Bcj082QO.js'; 7import './ScrollFade.svelte_svelte_type_style_lang-D0JPkGar.js'; 8import './MarkdownCode.svelte_svelte_type_style_lang-B29zDiob.js'; 9import { S as Static } from './index-1GCmrSlD.js'; 10import './StreamingBar.svelte_svelte_type_style_lang-DWGn5tT_.js'; 11import './Info-CfqzbVCN.js'; 12import './MarkdownCode-BYKuypS7.js'; 13import './html-Bwif0JPw.js'; 14import './snippet-BG7qkY_1.js'; 15import './prism-python-NrKIQnfs.js'; 16import './Clear-C8Tfa7QP.js'; 17 18let _id = 0; 19var root_3 = from_html(`<button class="reset-button svelte-8epfm4" aria-label="Reset to default value" data-testid="reset-button">âº</button>`); 20var root_1 = from_html(`<!> <div class="wrap svelte-8epfm4"><div class="head svelte-8epfm4"><label class="svelte-8epfm4"><!></label> <div class="tab-like-container svelte-8epfm4"><input data-testid="number-input" type="number" class="svelte-8epfm4"/> <!></div></div> <div class="slider_input_container svelte-8epfm4"><span class="min_value svelte-8epfm4"> </span> <input type="range" name="cowbell" class="svelte-8epfm4"/> <span class="max_value svelte-8epfm4"> </span></div></div>`, 1); 21 22function Index($$anchor, $$props) { 23 push($$props, true); 24 25 let props = rest_props($$props, ['$$slots', '$$events', '$$legacy']); 26 let gradio = new Gradio(props); 27 const INITIAL_VALUE = gradio.props.value; 28 let old_value = state(proxy(gradio.props.value)); 29 let range_input; 30 let number_input; 31 const id = `range_id_${_id++}`; 32 let minimum_value = user_derived(() => gradio.props.minimum ?? 0); 33 34 let percentage = user_derived(() => { 35 const min = gradio.props.minimum; 36 const max = gradio.props.maximum; 37 const val = gradio.props.value; 38 39 if (val > max) { 40 return 100; 41 } else if (val < min) { 42 return 0; 43 } 44 45 return (val - min) / (max - min) * 100; 46 }); 47 48 user_effect(() => { 49 if (gradio.props.value == null) return; 50 51 range_input.style.setProperty("--range_progress", `${get(percentage)}%`); 52 range_input.value = gradio.props.value.toString(); 53 }); 54 55 async function handle_change() { 56 await tick(); 57 gradio.dispatch("change"); 58 } 59 60 async function handle_release(e) { 61 await tick(); 62 gradio.dispatch("release", gradio.props.value); 63 } 64 65 function clamp() { 66 gradio.dispatch("release", gradio.props.value); 67 gradio.props.value = Math.min(Math.max(gradio.props.value, gradio.props.minimum), gradio.props.maximum); 68 } 69 70 let disabled = user_derived(() => !gradio.shared.interactive); 71 72 // When the value changes, dispatch the change event via handle_change() 73 // See the docs for an explanation: https://svelte.dev/docs/svelte-components#script-3-$-marks-a-statement-as-reactive 74 user_effect(() => { 75 if (gradio.props.value != get(old_value)) { 76 set(old_value, gradio.props.value, true); 77 handle_change(); 78 } 79 }); 80 81 function handle_resize() { 82 } 83 84 function reset_value() { 85 gradio.props.value = INITIAL_VALUE; 86 gradio.dispatch("change"); 87 gradio.dispatch("release", gradio.props.value); 88 } 89 90 async function handle_input() { 91 await tick(); 92 gradio.dispatch("input"); 93 } 94 95 event('resize', $window, handle_resize); 96 97 Block($$anchor, { 98 get visible() { 99 return gradio.shared.visible; 100 }, 101 102 get elem_id() { 103 return gradio.shared.elem_id; 104 }, 105 106 get elem_classes() { 107 return gradio.shared.elem_classes; 108 }, 109 110 get container() { 111 return gradio.shared.container; 112 }, 113 114 get scale() { 115 return gradio.shared.scale; 116 }, 117 118 get min_width() { 119 return gradio.shared.min_width; 120 }, 121 122 children: ($$anchor, $$slotProps) => { 123 var fragment_1 = root_1(); 124 var node = first_child(fragment_1); 125 126 Static(node, spread_props( 127 { 128 get autoscroll() { 129 return gradio.shared.autoscroll; 130 }, 131 132 get i18n() { 133 return gradio.i18n; 134 } 135 }, 136 () => gradio.shared.loading_status, 137 { 138 on_clear_status: () => gradio.dispatch("clear_status", gradio.shared.loading_status) 139 } 140 )); 141 142 var div = sibling(node, 2); 143 var div_1 = child(div); 144 var label = child(div_1);
145 var node_1 = child(label); 146 147 BlockTitle(node_1, { 148 get show_label() { 149 return gradio.shared.show_label; 150 }, 151 152 get info() { 153 return gradio.props.info; 154 }, 155 156 children: ($$anchor, $$slotProps) => { 157 next(); 158 159 var text$1 = text(); 160 161 template_effect(() => set_text(text$1, gradio.shared.label || "Slider")); 162 append($$anchor, text$1); 163 }, 164 $$slots: { default: true } 165 }); 166 167 reset(label); 168 169 var div_2 = sibling(label, 2); 170 var input = child(div_2); 171 172 remove_input_defaults(input); 173 bind_this(input, ($$value) => number_input = $$value, () => number_input); 174 175 var node_2 = sibling(input, 2); 176 177 { 178 var consequent = ($$anchor) => { 179 var button = root_3(); 180 181 template_effect(() => button.disabled = get(disabled)); 182 event('click', button, reset_value); 183 append($$anchor, button); 184 }; 185 186 if_block(node_2, ($$render) => { 187 if (gradio.props.buttons?.includes("reset") ?? true) $$render(consequent); 188 }); 189 } 190 191 reset(div_2); 192 reset(div_1); 193 194 var div_3 = sibling(div_1, 2); 195 var span = child(div_3); 196 var text_1 = child(span, true); 197 198 reset(span); 199 200 var input_1 = sibling(span, 2); 201 202 remove_input_defaults(input_1); 203 bind_this(input_1, ($$value) => range_input = $$value, () => range_input); 204 205 var span_1 = sibling(input_1, 2); 206 var text_2 = child(span_1, true); 207 208 reset(span_1); 209 reset(div_3); 210 reset(div); 211 212 template_effect(() => { 213 set_attribute(label, 'for', id); 214 set_attribute(input, 'aria-label', `number input for ${gradio.shared.label}`); 215 set_attribute(input, 'min', gradio.props.minimum); 216 set_attribute(input, 'max', gradio.props.maximum); 217 set_attribute(input, 'step', gradio.props.step); 218 input.disabled = get(disabled); 219 set_text(text_1, get(minimum_value)); 220 set_attribute(input_1, 'id', id); 221 set_attribute(input_1, 'min', gradio.props.minimum); 222 set_attribute(input_1, 'max', gradio.props.maximum); 223 set_attribute(input_1, 'step', gradio.props.step); 224 input_1.disabled = get(disabled); 225 set_attribute(input_1, 'aria-label', `range slider for ${gradio.shared.label}`); 226 set_text(text_2, gradio.props.maximum); 227 }); 228 229 bind_value(input, () => gradio.props.value, ($$value) => gradio.props.value = $$value); 230 event('input', input, handle_input); 231 event('blur', input, clamp); 232 event('pointerup', input, handle_release); 233 bind_value(input_1, () => gradio.props.value, ($$value) => gradio.props.value = $$value); 234 event('input', input_1, handle_input); 235 event('pointerup', input_1, handle_release); 236 append($$anchor, fragment_1); 237 }, 238 $$slots: { default: true } 239 }); 240 241 pop(); 242} 243 244export { Index as default }; 245//# sourceMappingURL=Index-CClIgVld.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.