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-CMo5lpzy.js'; 2import { R as push, u as state, v as proxy, y as user_effect, w as get, x as set, Z as event, S as first_child, a7 as text, t as template_effect, a as append, V as child, X as sibling, T as pop, a5 as user_derived, M as tick, aw as $window, W as from_html, a0 as set_text, a8 as next, Y as reset } from './index-BvBk1Iap.js'; 3import { b as bind_value } from './input-C317uaXR.js'; 4import { G as Gradio } from './utils.svelte-CYLB_jIA.js'; 5import { B as Block } from './Block-Bx3BikCN.js'; 6import { B as BlockTitle } from './BlockTitle-7XQ-8ENg.js'; 7import './ScrollFade.svelte_svelte_type_style_lang-Xm-PLg9E.js'; 8import { S as Static } from './index-Lz7fsHFt.js'; 9import './StreamingBar.svelte_svelte_type_style_lang-CdFIGsJa.js'; 10import './clone-DaB-S2nH.js'; 11import './Info-BrkJhX6_.js'; 12import './html-CdUEtR5E.js'; 13import './snippet-Bl5YVoCg.js'; 14import './Clear-Dgs5UhTO.js'; 15import './index-C7e-J7CF.js'; 16 17let _id = 0; 18var root_3 = from_html(`<button class="reset-button svelte-8epfm4" aria-label="Reset to default value" data-testid="reset-button">âº</button>`); 19var 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); 20 21function Index($$anchor, $$props) { 22 push($$props, true); 23 24 let props = rest_props($$props, ['$$slots', '$$events', '$$legacy']); 25 let gradio = new Gradio(props); 26 const INITIAL_VALUE = gradio.props.value; 27 let old_value = state(proxy(gradio.props.value)); 28 let range_input; 29 let number_input; 30 const id = `range_id_${_id++}`; 31 let minimum_value = user_derived(() => gradio.props.minimum ?? 0); 32 33 let percentage = user_derived(() => { 34 const min = gradio.props.minimum; 35 const max = gradio.props.maximum; 36 const val = gradio.props.value; 37 38 if (val > max) { 39 return 100; 40 } else if (val < min) { 41 return 0; 42 } 43 44 return (val - min) / (max - min) * 100; 45 }); 46 47 user_effect(() => { 48 if (gradio.props.value == null) return; 49 50 range_input.style.setProperty("--range_progress", `${get(percentage)}%`); 51 range_input.value = gradio.props.value.toString(); 52 }); 53 54 async function handle_change() { 55 await tick(); 56 gradio.dispatch("change"); 57 } 58 59 async function handle_release(e) { 60 await tick(); 61 gradio.dispatch("release", gradio.props.value); 62 } 63 64 function clamp() { 65 gradio.dispatch("release", gradio.props.value); 66 gradio.props.value = Math.min(Math.max(gradio.props.value, gradio.props.minimum), gradio.props.maximum); 67 } 68 69 let disabled = user_derived(() => !gradio.shared.interactive); 70 71 // When the value changes, dispatch the change event via handle_change() 72 // See the docs for an explanation: https://svelte.dev/docs/svelte-components#script-3-$-marks-a-statement-as-reactive 73 user_effect(() => { 74 if (gradio.props.value != get(old_value)) { 75 set(old_value, gradio.props.value, true); 76 handle_change(); 77 } 78 }); 79 80 function handle_resize() { 81 } 82 83 function reset_value() { 84 gradio.props.value = INITIAL_VALUE; 85 gradio.dispatch("change"); 86 gradio.dispatch("release", gradio.props.value); 87 } 88 89 async function handle_input() { 90 await tick(); 91 gradio.dispatch("input"); 92 } 93 94 event('resize', $window, handle_resize); 95 96 Block($$anchor, { 97 get visible() { 98 return gradio.shared.visible; 99 }, 100 101 get elem_id() { 102 return gradio.shared.elem_id; 103 }, 104 105 get elem_classes() { 106 return gradio.shared.elem_classes; 107 }, 108 109 get container() { 110 return gradio.shared.container; 111 }, 112 113 get scale() { 114 return gradio.shared.scale; 115 }, 116 117 get min_width() { 118 return gradio.shared.min_width; 119 }, 120 121 children: ($$anchor, $$slotProps) => { 122 var fragment_1 = root_1(); 123 var node = first_child(fragment_1); 124 125 Static(node, spread_props( 126 { 127 get autoscroll() { 128 return gradio.shared.autoscroll; 129 }, 130 131 get i18n() { 132 return gradio.i18n; 133 } 134 }, 135 () => gradio.shared.loading_status, 136 { 137 on_clear_status: () => gradio.dispatch("clear_status", gradio.shared.loading_status) 138 } 139 )); 140 141 var div = sibling(node, 2); 142 var div_1 = child(div); 143 var label = child(div_1);
144 var node_1 = child(label); 145 146 BlockTitle(node_1, { 147 get show_label() { 148 return gradio.shared.show_label; 149 }, 150 151 get info() { 152 return gradio.props.info; 153 }, 154 155 children: ($$anchor, $$slotProps) => { 156 next(); 157 158 var text$1 = text(); 159 160 template_effect(() => set_text(text$1, gradio.shared.label || "Slider")); 161 append($$anchor, text$1); 162 }, 163 $$slots: { default: true } 164 }); 165 166 reset(label); 167 168 var div_2 = sibling(label, 2); 169 var input = child(div_2); 170 171 remove_input_defaults(input); 172 bind_this(input, ($$value) => number_input = $$value, () => number_input); 173 174 var node_2 = sibling(input, 2); 175 176 { 177 var consequent = ($$anchor) => { 178 var button = root_3(); 179 180 template_effect(() => button.disabled = get(disabled)); 181 event('click', button, reset_value); 182 append($$anchor, button); 183 }; 184 185 if_block(node_2, ($$render) => { 186 if (gradio.props.buttons?.includes("reset") ?? true) $$render(consequent); 187 }); 188 } 189 190 reset(div_2); 191 reset(div_1); 192 193 var div_3 = sibling(div_1, 2); 194 var span = child(div_3); 195 var text_1 = child(span, true); 196 197 reset(span); 198 199 var input_1 = sibling(span, 2); 200 201 remove_input_defaults(input_1); 202 bind_this(input_1, ($$value) => range_input = $$value, () => range_input); 203 204 var span_1 = sibling(input_1, 2); 205 var text_2 = child(span_1, true); 206 207 reset(span_1); 208 reset(div_3); 209 reset(div); 210 211 template_effect(() => { 212 set_attribute(label, 'for', id); 213 set_attribute(input, 'aria-label', `number input for ${gradio.shared.label}`); 214 set_attribute(input, 'min', gradio.props.minimum); 215 set_attribute(input, 'max', gradio.props.maximum); 216 set_attribute(input, 'step', gradio.props.step); 217 input.disabled = get(disabled); 218 set_text(text_1, get(minimum_value)); 219 set_attribute(input_1, 'id', id); 220 set_attribute(input_1, 'min', gradio.props.minimum); 221 set_attribute(input_1, 'max', gradio.props.maximum); 222 set_attribute(input_1, 'step', gradio.props.step); 223 input_1.disabled = get(disabled); 224 set_attribute(input_1, 'aria-label', `range slider for ${gradio.shared.label}`); 225 set_text(text_2, gradio.props.maximum); 226 }); 227 228 bind_value(input, () => gradio.props.value, ($$value) => gradio.props.value = $$value); 229 event('input', input, handle_input); 230 event('blur', input, clamp); 231 event('pointerup', input, handle_release); 232 bind_value(input_1, () => gradio.props.value, ($$value) => gradio.props.value = $$value); 233 event('input', input_1, handle_input); 234 event('pointerup', input_1, handle_release); 235 append($$anchor, fragment_1); 236 }, 237 $$slots: { default: true } 238 }); 239 240 pop(); 241} 242 243export { Index as default }; 244//# sourceMappingURL=Index-D3Ps12Zs.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.