Max Richter
4db1cc7d4f
All checks were successful
Deploy to GitHub Pages / build_site (push) Successful in 2m21s
2581 lines
76 KiB
JavaScript
2581 lines
76 KiB
JavaScript
const __vite__fileDeps=["assets/HomeView.vue-CcWnFK65.js","assets/story--eZPzd9h.js","assets/vendor-BCKkA27H.js","assets/StoryView.vue-BFx-CBXY.js","assets/MobileOverlay.vue2-BRmV4xb2.js","assets/BaseEmpty.vue-C0i8tRal.js","assets/state-BFrY_pEm.js"],__vite__mapDeps=i=>i.map(i=>__vite__fileDeps[i]);
|
|
import { S as SvelteComponentDev, Q as init, R as safe_not_equal, U as dispatch_dev, V as validate_slots, W as element, X as space, Y as svg_element, Z as claim_element, _ as claim_space, $ as children, a0 as claim_svg_element, a1 as detach_dev, a2 as attr_dev, a3 as add_location, a4 as insert_hydration_dev, a5 as append_hydration_dev, a6 as listen_dev, a7 as noop, a8 as create_component, a9 as claim_component, aa as mount_component, ab as transition_in, ac as transition_out, ad as destroy_component, ae as createEventDispatcher, af as toggle_class, ag as set_input_value, ah as to_number, ai as run_all, aj as binding_callbacks, ak as flush, al as get_svelte_dataset, am as ensure_array_like_dev, an as add_render_callback, ao as select_option, ap as destroy_each, aq as select_value, ar as text, as as claim_text, at as set_data_dev, au as Logo_square, av as Logo_dark, aw as createRouter, ax as createWebHistory, ay as createWebHashHistory, az as useDark, aA as useToggle, k as watch, aB as markRaw, E as reactive, d as defineComponent, r as ref, aC as watchEffect, o as openBlock, q as createBlock, aD as mergeProps, aE as resolveDynamicComponent, h as createCommentVNode } from "./vendor-BCKkA27H.js";
|
|
const scriptRel = "modulepreload";
|
|
const assetsURL = function(dep) {
|
|
return "/" + dep;
|
|
};
|
|
const seen = {};
|
|
const __vitePreload = function preload(baseModule, deps, importerUrl) {
|
|
let promise = Promise.resolve();
|
|
if (deps && deps.length > 0) {
|
|
const links = document.getElementsByTagName("link");
|
|
const cspNonceMeta = document.querySelector("meta[property=csp-nonce]");
|
|
const cspNonce = (cspNonceMeta == null ? void 0 : cspNonceMeta.nonce) || (cspNonceMeta == null ? void 0 : cspNonceMeta.getAttribute("nonce"));
|
|
promise = Promise.all(deps.map((dep) => {
|
|
dep = assetsURL(dep);
|
|
if (dep in seen)
|
|
return;
|
|
seen[dep] = true;
|
|
const isCss = dep.endsWith(".css");
|
|
const cssSelector = isCss ? '[rel="stylesheet"]' : "";
|
|
const isBaseRelative = !!importerUrl;
|
|
if (isBaseRelative) {
|
|
for (let i = links.length - 1; i >= 0; i--) {
|
|
const link2 = links[i];
|
|
if (link2.href === dep && (!isCss || link2.rel === "stylesheet")) {
|
|
return;
|
|
}
|
|
}
|
|
} else if (document.querySelector(`link[href="${dep}"]${cssSelector}`)) {
|
|
return;
|
|
}
|
|
const link = document.createElement("link");
|
|
link.rel = isCss ? "stylesheet" : scriptRel;
|
|
if (!isCss) {
|
|
link.as = "script";
|
|
link.crossOrigin = "";
|
|
}
|
|
link.href = dep;
|
|
if (cspNonce) {
|
|
link.setAttribute("nonce", cspNonce);
|
|
}
|
|
document.head.appendChild(link);
|
|
if (isCss) {
|
|
return new Promise((res, rej) => {
|
|
link.addEventListener("load", res);
|
|
link.addEventListener("error", () => rej(new Error(`Unable to preload CSS for ${dep}`)));
|
|
});
|
|
}
|
|
}));
|
|
}
|
|
return promise.then(() => baseModule()).catch((err) => {
|
|
const e = new Event("vite:preloadError", { cancelable: true });
|
|
e.payload = err;
|
|
window.dispatchEvent(e);
|
|
if (!e.defaultPrevented) {
|
|
throw err;
|
|
}
|
|
});
|
|
};
|
|
const file$8 = "src/lib/elements/Checkbox.svelte";
|
|
function create_fragment$8(ctx) {
|
|
let input;
|
|
let t;
|
|
let label;
|
|
let svg;
|
|
let path;
|
|
let mounted;
|
|
let dispose;
|
|
const block = {
|
|
c: function create() {
|
|
input = element("input");
|
|
t = space();
|
|
label = element("label");
|
|
svg = svg_element("svg");
|
|
path = svg_element("path");
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
input = claim_element(nodes, "INPUT", { id: true, type: true, class: true });
|
|
t = claim_space(nodes);
|
|
label = claim_element(nodes, "LABEL", { for: true, class: true });
|
|
var label_nodes = children(label);
|
|
svg = claim_svg_element(label_nodes, "svg", {
|
|
viewBox: true,
|
|
fill: true,
|
|
xmlns: true,
|
|
class: true
|
|
});
|
|
var svg_nodes = children(svg);
|
|
path = claim_svg_element(svg_nodes, "path", {
|
|
d: true,
|
|
stroke: true,
|
|
"stroke-width": true,
|
|
"stroke-linecap": true,
|
|
"stroke-linejoin": true
|
|
});
|
|
children(path).forEach(detach_dev);
|
|
svg_nodes.forEach(detach_dev);
|
|
label_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
attr_dev(
|
|
input,
|
|
"id",
|
|
/*id*/
|
|
ctx[1]
|
|
);
|
|
attr_dev(input, "type", "checkbox");
|
|
attr_dev(input, "class", "s-TUFw0ou_zJq2");
|
|
add_location(input, file$8, 12, 0, 201);
|
|
attr_dev(path, "d", "M2 7L7 12L17 2");
|
|
attr_dev(path, "stroke", "currentColor");
|
|
attr_dev(path, "stroke-width", "3");
|
|
attr_dev(path, "stroke-linecap", "round");
|
|
attr_dev(path, "stroke-linejoin", "round");
|
|
add_location(path, file$8, 15, 4, 349);
|
|
attr_dev(svg, "viewBox", "0 0 19 14");
|
|
attr_dev(svg, "fill", "none");
|
|
attr_dev(svg, "xmlns", "http://www.w3.org/2000/svg");
|
|
attr_dev(svg, "class", "s-TUFw0ou_zJq2");
|
|
add_location(svg, file$8, 14, 2, 272);
|
|
attr_dev(
|
|
label,
|
|
"for",
|
|
/*id*/
|
|
ctx[1]
|
|
);
|
|
attr_dev(label, "class", "s-TUFw0ou_zJq2");
|
|
add_location(label, file$8, 13, 0, 253);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, input, anchor);
|
|
input.checked = /*value*/
|
|
ctx[0];
|
|
insert_hydration_dev(target, t, anchor);
|
|
insert_hydration_dev(target, label, anchor);
|
|
append_hydration_dev(label, svg);
|
|
append_hydration_dev(svg, path);
|
|
if (!mounted) {
|
|
dispose = listen_dev(
|
|
input,
|
|
"change",
|
|
/*input_change_handler*/
|
|
ctx[2]
|
|
);
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: function update(ctx2, [dirty]) {
|
|
if (dirty & /*id*/
|
|
2) {
|
|
attr_dev(
|
|
input,
|
|
"id",
|
|
/*id*/
|
|
ctx2[1]
|
|
);
|
|
}
|
|
if (dirty & /*value*/
|
|
1) {
|
|
input.checked = /*value*/
|
|
ctx2[0];
|
|
}
|
|
if (dirty & /*id*/
|
|
2) {
|
|
attr_dev(
|
|
label,
|
|
"for",
|
|
/*id*/
|
|
ctx2[1]
|
|
);
|
|
}
|
|
},
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(input);
|
|
detach_dev(t);
|
|
detach_dev(label);
|
|
}
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$8.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function instance$8($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Checkbox", slots, []);
|
|
let { value } = $$props;
|
|
let { id } = $$props;
|
|
$$self.$$.on_mount.push(function() {
|
|
if (value === void 0 && !("value" in $$props || $$self.$$.bound[$$self.$$.props["value"]])) {
|
|
console.warn("<Checkbox> was created without expected prop 'value'");
|
|
}
|
|
if (id === void 0 && !("id" in $$props || $$self.$$.bound[$$self.$$.props["id"]])) {
|
|
console.warn("<Checkbox> was created without expected prop 'id'");
|
|
}
|
|
});
|
|
const writable_props = ["value", "id"];
|
|
Object.keys($$props).forEach((key) => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot")
|
|
console.warn(`<Checkbox> was created with unknown prop '${key}'`);
|
|
});
|
|
function input_change_handler() {
|
|
value = this.checked;
|
|
$$invalidate(0, value);
|
|
}
|
|
$$self.$$set = ($$props2) => {
|
|
if ("value" in $$props2)
|
|
$$invalidate(0, value = $$props2.value);
|
|
if ("id" in $$props2)
|
|
$$invalidate(1, id = $$props2.id);
|
|
};
|
|
$$self.$capture_state = () => ({ value, id });
|
|
$$self.$inject_state = ($$props2) => {
|
|
if ("value" in $$props2)
|
|
$$invalidate(0, value = $$props2.value);
|
|
if ("id" in $$props2)
|
|
$$invalidate(1, id = $$props2.id);
|
|
};
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
$$self.$$.update = () => {
|
|
if ($$self.$$.dirty & /*value*/
|
|
1) {
|
|
if (typeof value === "string") {
|
|
$$invalidate(0, value = value === "true");
|
|
} else if (typeof value === "number") {
|
|
$$invalidate(0, value = value === 1);
|
|
}
|
|
}
|
|
};
|
|
return [value, id, input_change_handler];
|
|
}
|
|
class Checkbox extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$8, create_fragment$8, safe_not_equal, { value: 0, id: 1 });
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Checkbox",
|
|
options,
|
|
id: create_fragment$8.name
|
|
});
|
|
}
|
|
get value() {
|
|
throw new Error("<Checkbox>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set value(value) {
|
|
throw new Error("<Checkbox>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
get id() {
|
|
throw new Error("<Checkbox>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set id(value) {
|
|
throw new Error("<Checkbox>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
const file$7 = "src/lib/elements/Checkbox.story.svelte";
|
|
function create_default_slot$3(ctx) {
|
|
let div;
|
|
let checkbox;
|
|
let current;
|
|
checkbox = new Checkbox({
|
|
props: { checked: false },
|
|
$$inline: true
|
|
});
|
|
const block = {
|
|
c: function create() {
|
|
div = element("div");
|
|
create_component(checkbox.$$.fragment);
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
div = claim_element(nodes, "DIV", { class: true });
|
|
var div_nodes = children(div);
|
|
claim_component(checkbox.$$.fragment, div_nodes);
|
|
div_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
attr_dev(div, "class", "s-QRHVBdNdefmq");
|
|
add_location(div, file$7, 7, 2, 101);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, div, anchor);
|
|
mount_component(checkbox, div, null);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current)
|
|
return;
|
|
transition_in(checkbox.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(checkbox.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(div);
|
|
}
|
|
destroy_component(checkbox);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_default_slot$3.name,
|
|
type: "slot",
|
|
source: "(5:0) <Hst.Story>",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function create_fragment$7(ctx) {
|
|
let hst_story;
|
|
let current;
|
|
hst_story = new /*Hst*/
|
|
ctx[0].Story({
|
|
props: {
|
|
$$slots: { default: [create_default_slot$3] },
|
|
$$scope: { ctx }
|
|
},
|
|
$$inline: true
|
|
});
|
|
const block = {
|
|
c: function create() {
|
|
create_component(hst_story.$$.fragment);
|
|
},
|
|
l: function claim(nodes) {
|
|
claim_component(hst_story.$$.fragment, nodes);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
mount_component(hst_story, target, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx2, [dirty]) {
|
|
const hst_story_changes = {};
|
|
if (dirty & /*$$scope*/
|
|
2) {
|
|
hst_story_changes.$$scope = { dirty, ctx: ctx2 };
|
|
}
|
|
hst_story.$set(hst_story_changes);
|
|
},
|
|
i: function intro(local) {
|
|
if (current)
|
|
return;
|
|
transition_in(hst_story.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(hst_story.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
destroy_component(hst_story, detaching);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$7.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function instance$7($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Checkbox_story", slots, []);
|
|
let { Hst } = $$props;
|
|
$$self.$$.on_mount.push(function() {
|
|
if (Hst === void 0 && !("Hst" in $$props || $$self.$$.bound[$$self.$$.props["Hst"]])) {
|
|
console.warn("<Checkbox_story> was created without expected prop 'Hst'");
|
|
}
|
|
});
|
|
const writable_props = ["Hst"];
|
|
Object.keys($$props).forEach((key) => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot")
|
|
console.warn(`<Checkbox_story> was created with unknown prop '${key}'`);
|
|
});
|
|
$$self.$$set = ($$props2) => {
|
|
if ("Hst" in $$props2)
|
|
$$invalidate(0, Hst = $$props2.Hst);
|
|
};
|
|
$$self.$capture_state = () => ({ Hst, Checkbox });
|
|
$$self.$inject_state = ($$props2) => {
|
|
if ("Hst" in $$props2)
|
|
$$invalidate(0, Hst = $$props2.Hst);
|
|
};
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
return [Hst];
|
|
}
|
|
class Checkbox_story extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$7, create_fragment$7, safe_not_equal, { Hst: 0 });
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Checkbox_story",
|
|
options,
|
|
id: create_fragment$7.name
|
|
});
|
|
}
|
|
get Hst() {
|
|
throw new Error("<Checkbox_story>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set Hst(value) {
|
|
throw new Error("<Checkbox_story>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
function getBoundingValue(_v) {
|
|
const v = Math.abs(_v);
|
|
let level = 1;
|
|
const levels = [1, 2, 4, 10, 20, 50, 100, 200, 300, 400, 500, 1e3];
|
|
for (const l of levels) {
|
|
level = l;
|
|
if (l >= v)
|
|
break;
|
|
}
|
|
return _v >= 0 ? level : -level;
|
|
}
|
|
const file$6 = "src/lib/elements/Float.svelte";
|
|
function create_fragment$6(ctx) {
|
|
let div;
|
|
let span;
|
|
let span_style_value;
|
|
let t;
|
|
let input;
|
|
let input_style_value;
|
|
let mounted;
|
|
let dispose;
|
|
const block = {
|
|
c: function create() {
|
|
div = element("div");
|
|
span = element("span");
|
|
t = space();
|
|
input = element("input");
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
div = claim_element(nodes, "DIV", { class: true });
|
|
var div_nodes = children(div);
|
|
span = claim_element(div_nodes, "SPAN", { class: true, style: true });
|
|
children(span).forEach(detach_dev);
|
|
t = claim_space(div_nodes);
|
|
input = claim_element(div_nodes, "INPUT", {
|
|
id: true,
|
|
step: true,
|
|
max: true,
|
|
min: true,
|
|
type: true,
|
|
style: true,
|
|
class: true
|
|
});
|
|
div_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
attr_dev(span, "class", "overlay s-7bQ_kN4nOsTx");
|
|
attr_dev(span, "style", span_style_value = `width: ${/*value*/
|
|
(ctx[0] - /*min*/
|
|
ctx[1]) / /*max*/
|
|
(ctx[2] - /*min*/
|
|
ctx[1]) * 100}%`);
|
|
add_location(span, file$6, 102, 2, 2040);
|
|
attr_dev(
|
|
input,
|
|
"id",
|
|
/*id*/
|
|
ctx[4]
|
|
);
|
|
attr_dev(
|
|
input,
|
|
"step",
|
|
/*step*/
|
|
ctx[3]
|
|
);
|
|
attr_dev(
|
|
input,
|
|
"max",
|
|
/*max*/
|
|
ctx[2]
|
|
);
|
|
attr_dev(
|
|
input,
|
|
"min",
|
|
/*min*/
|
|
ctx[1]
|
|
);
|
|
attr_dev(input, "type", "number");
|
|
attr_dev(input, "style", input_style_value = `width:${/*width*/
|
|
ctx[7]};`);
|
|
attr_dev(input, "class", "s-7bQ_kN4nOsTx");
|
|
add_location(input, file$6, 106, 2, 2134);
|
|
attr_dev(div, "class", "component-wrapper s-7bQ_kN4nOsTx");
|
|
toggle_class(
|
|
div,
|
|
"is-down",
|
|
/*isMouseDown*/
|
|
ctx[6]
|
|
);
|
|
add_location(div, file$6, 101, 0, 1978);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, div, anchor);
|
|
append_hydration_dev(div, span);
|
|
append_hydration_dev(div, t);
|
|
append_hydration_dev(div, input);
|
|
set_input_value(
|
|
input,
|
|
/*value*/
|
|
ctx[0]
|
|
);
|
|
ctx[12](input);
|
|
if (!mounted) {
|
|
dispose = [
|
|
listen_dev(
|
|
input,
|
|
"input",
|
|
/*input_input_handler*/
|
|
ctx[11]
|
|
),
|
|
listen_dev(
|
|
input,
|
|
"keydown",
|
|
/*handleKeyDown*/
|
|
ctx[10],
|
|
false,
|
|
false,
|
|
false,
|
|
false
|
|
),
|
|
listen_dev(
|
|
input,
|
|
"mousedown",
|
|
/*handleMouseDown*/
|
|
ctx[8],
|
|
false,
|
|
false,
|
|
false,
|
|
false
|
|
),
|
|
listen_dev(
|
|
input,
|
|
"mouseup",
|
|
/*handleMouseUp*/
|
|
ctx[9],
|
|
false,
|
|
false,
|
|
false,
|
|
false
|
|
)
|
|
];
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: function update(ctx2, [dirty]) {
|
|
if (dirty & /*value, min, max*/
|
|
7 && span_style_value !== (span_style_value = `width: ${/*value*/
|
|
(ctx2[0] - /*min*/
|
|
ctx2[1]) / /*max*/
|
|
(ctx2[2] - /*min*/
|
|
ctx2[1]) * 100}%`)) {
|
|
attr_dev(span, "style", span_style_value);
|
|
}
|
|
if (dirty & /*id*/
|
|
16) {
|
|
attr_dev(
|
|
input,
|
|
"id",
|
|
/*id*/
|
|
ctx2[4]
|
|
);
|
|
}
|
|
if (dirty & /*step*/
|
|
8) {
|
|
attr_dev(
|
|
input,
|
|
"step",
|
|
/*step*/
|
|
ctx2[3]
|
|
);
|
|
}
|
|
if (dirty & /*max*/
|
|
4) {
|
|
attr_dev(
|
|
input,
|
|
"max",
|
|
/*max*/
|
|
ctx2[2]
|
|
);
|
|
}
|
|
if (dirty & /*min*/
|
|
2) {
|
|
attr_dev(
|
|
input,
|
|
"min",
|
|
/*min*/
|
|
ctx2[1]
|
|
);
|
|
}
|
|
if (dirty & /*width*/
|
|
128 && input_style_value !== (input_style_value = `width:${/*width*/
|
|
ctx2[7]};`)) {
|
|
attr_dev(input, "style", input_style_value);
|
|
}
|
|
if (dirty & /*value*/
|
|
1 && to_number(input.value) !== /*value*/
|
|
ctx2[0]) {
|
|
set_input_value(
|
|
input,
|
|
/*value*/
|
|
ctx2[0]
|
|
);
|
|
}
|
|
if (dirty & /*isMouseDown*/
|
|
64) {
|
|
toggle_class(
|
|
div,
|
|
"is-down",
|
|
/*isMouseDown*/
|
|
ctx2[6]
|
|
);
|
|
}
|
|
},
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(div);
|
|
}
|
|
ctx[12](null);
|
|
mounted = false;
|
|
run_all(dispose);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$6.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function strip(input) {
|
|
return +parseFloat(input + "").toPrecision(2);
|
|
}
|
|
function instance$6($$self, $$props, $$invalidate) {
|
|
let width;
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Float", slots, []);
|
|
let { value = 0.5 } = $$props;
|
|
let { step = 0.01 } = $$props;
|
|
let { min = 0 } = $$props;
|
|
let { max = 1 } = $$props;
|
|
let { id = "" } = $$props;
|
|
const dispatch = createEventDispatcher();
|
|
let inputEl;
|
|
let oldValue;
|
|
function handleChange() {
|
|
if (value === oldValue)
|
|
return;
|
|
oldValue = value;
|
|
dispatch("change", parseFloat(value + ""));
|
|
}
|
|
let isMouseDown = false;
|
|
let downV = 0;
|
|
let vx = 0;
|
|
let rect;
|
|
function handleMouseDown(ev) {
|
|
ev.preventDefault();
|
|
inputEl.focus();
|
|
$$invalidate(6, isMouseDown = true);
|
|
downV = value;
|
|
rect = inputEl.getBoundingClientRect();
|
|
window.removeEventListener("mousemove", handleMouseMove);
|
|
window.addEventListener("mousemove", handleMouseMove);
|
|
window.addEventListener("mouseup", handleMouseUp);
|
|
document.body.style.cursor = "ew-resize";
|
|
}
|
|
function handleMouseUp() {
|
|
$$invalidate(6, isMouseDown = false);
|
|
if (downV === value) {
|
|
inputEl.focus();
|
|
}
|
|
setTimeout(
|
|
() => {
|
|
if (value >= 0) {
|
|
$$invalidate(2, max = getBoundingValue(value));
|
|
$$invalidate(1, min = 0);
|
|
} else {
|
|
$$invalidate(1, min = getBoundingValue(value));
|
|
$$invalidate(2, max = 0);
|
|
}
|
|
},
|
|
500
|
|
);
|
|
document.body.style.cursor = "unset";
|
|
window.removeEventListener("mouseup", handleMouseUp);
|
|
window.removeEventListener("mousemove", handleMouseMove);
|
|
}
|
|
function handleKeyDown(ev) {
|
|
if (ev.key === "Escape" || ev.key === "Enter") {
|
|
handleMouseUp();
|
|
inputEl.blur();
|
|
}
|
|
}
|
|
function handleMouseMove(ev) {
|
|
vx = (ev.clientX - rect.left) / rect.width;
|
|
if (ev.ctrlKey) {
|
|
let v = min + (max - min) * vx;
|
|
$$invalidate(0, value = v);
|
|
} else {
|
|
$$invalidate(0, value = Math.max(Math.min(min + (max - min) * vx, max), min));
|
|
}
|
|
}
|
|
const writable_props = ["value", "step", "min", "max", "id"];
|
|
Object.keys($$props).forEach((key) => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot")
|
|
console.warn(`<Float> was created with unknown prop '${key}'`);
|
|
});
|
|
function input_input_handler() {
|
|
value = to_number(this.value);
|
|
$$invalidate(0, value);
|
|
}
|
|
function input_binding($$value) {
|
|
binding_callbacks[$$value ? "unshift" : "push"](() => {
|
|
inputEl = $$value;
|
|
$$invalidate(5, inputEl);
|
|
});
|
|
}
|
|
$$self.$$set = ($$props2) => {
|
|
if ("value" in $$props2)
|
|
$$invalidate(0, value = $$props2.value);
|
|
if ("step" in $$props2)
|
|
$$invalidate(3, step = $$props2.step);
|
|
if ("min" in $$props2)
|
|
$$invalidate(1, min = $$props2.min);
|
|
if ("max" in $$props2)
|
|
$$invalidate(2, max = $$props2.max);
|
|
if ("id" in $$props2)
|
|
$$invalidate(4, id = $$props2.id);
|
|
};
|
|
$$self.$capture_state = () => ({
|
|
createEventDispatcher,
|
|
getBoundingValue,
|
|
value,
|
|
step,
|
|
min,
|
|
max,
|
|
id,
|
|
strip,
|
|
dispatch,
|
|
inputEl,
|
|
oldValue,
|
|
handleChange,
|
|
isMouseDown,
|
|
downV,
|
|
vx,
|
|
rect,
|
|
handleMouseDown,
|
|
handleMouseUp,
|
|
handleKeyDown,
|
|
handleMouseMove,
|
|
width
|
|
});
|
|
$$self.$inject_state = ($$props2) => {
|
|
if ("value" in $$props2)
|
|
$$invalidate(0, value = $$props2.value);
|
|
if ("step" in $$props2)
|
|
$$invalidate(3, step = $$props2.step);
|
|
if ("min" in $$props2)
|
|
$$invalidate(1, min = $$props2.min);
|
|
if ("max" in $$props2)
|
|
$$invalidate(2, max = $$props2.max);
|
|
if ("id" in $$props2)
|
|
$$invalidate(4, id = $$props2.id);
|
|
if ("inputEl" in $$props2)
|
|
$$invalidate(5, inputEl = $$props2.inputEl);
|
|
if ("oldValue" in $$props2)
|
|
oldValue = $$props2.oldValue;
|
|
if ("isMouseDown" in $$props2)
|
|
$$invalidate(6, isMouseDown = $$props2.isMouseDown);
|
|
if ("downV" in $$props2)
|
|
downV = $$props2.downV;
|
|
if ("vx" in $$props2)
|
|
vx = $$props2.vx;
|
|
if ("rect" in $$props2)
|
|
rect = $$props2.rect;
|
|
if ("width" in $$props2)
|
|
$$invalidate(7, width = $$props2.width);
|
|
};
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
$$self.$$.update = () => {
|
|
if ($$self.$$.dirty & /*value*/
|
|
1) {
|
|
if ((value || 0).toString().length > 5) {
|
|
$$invalidate(0, value = strip(value || 0));
|
|
}
|
|
}
|
|
if ($$self.$$.dirty & /*value*/
|
|
1) {
|
|
value !== void 0 && handleChange();
|
|
}
|
|
if ($$self.$$.dirty & /*value*/
|
|
1) {
|
|
$$invalidate(7, width = Number.isFinite(value) ? Math.max(((value == null ? void 0 : value.toString().length) ?? 1) * 8, 50) + "px" : "20px");
|
|
}
|
|
};
|
|
return [
|
|
value,
|
|
min,
|
|
max,
|
|
step,
|
|
id,
|
|
inputEl,
|
|
isMouseDown,
|
|
width,
|
|
handleMouseDown,
|
|
handleMouseUp,
|
|
handleKeyDown,
|
|
input_input_handler,
|
|
input_binding
|
|
];
|
|
}
|
|
class Float extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$6, create_fragment$6, safe_not_equal, { value: 0, step: 3, min: 1, max: 2, id: 4 });
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Float",
|
|
options,
|
|
id: create_fragment$6.name
|
|
});
|
|
}
|
|
get value() {
|
|
throw new Error("<Float>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set value(value) {
|
|
throw new Error("<Float>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
get step() {
|
|
throw new Error("<Float>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set step(value) {
|
|
throw new Error("<Float>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
get min() {
|
|
throw new Error("<Float>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set min(value) {
|
|
throw new Error("<Float>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
get max() {
|
|
throw new Error("<Float>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set max(value) {
|
|
throw new Error("<Float>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
get id() {
|
|
throw new Error("<Float>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set id(value) {
|
|
throw new Error("<Float>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
const file$5 = "src/lib/elements/Float.story.svelte";
|
|
function create_default_slot$2(ctx) {
|
|
let div;
|
|
let float;
|
|
let current;
|
|
float = new Float({
|
|
props: { value: 0, min: 0, max: 6.9 },
|
|
$$inline: true
|
|
});
|
|
const block = {
|
|
c: function create() {
|
|
div = element("div");
|
|
create_component(float.$$.fragment);
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
div = claim_element(nodes, "DIV", { class: true });
|
|
var div_nodes = children(div);
|
|
claim_component(float.$$.fragment, div_nodes);
|
|
div_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
attr_dev(div, "class", "s-ixAoiIy-gyh_");
|
|
add_location(div, file$5, 7, 2, 95);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, div, anchor);
|
|
mount_component(float, div, null);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current)
|
|
return;
|
|
transition_in(float.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(float.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(div);
|
|
}
|
|
destroy_component(float);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_default_slot$2.name,
|
|
type: "slot",
|
|
source: "(5:0) <Hst.Story>",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function create_fragment$5(ctx) {
|
|
let hst_story;
|
|
let current;
|
|
hst_story = new /*Hst*/
|
|
ctx[0].Story({
|
|
props: {
|
|
$$slots: { default: [create_default_slot$2] },
|
|
$$scope: { ctx }
|
|
},
|
|
$$inline: true
|
|
});
|
|
const block = {
|
|
c: function create() {
|
|
create_component(hst_story.$$.fragment);
|
|
},
|
|
l: function claim(nodes) {
|
|
claim_component(hst_story.$$.fragment, nodes);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
mount_component(hst_story, target, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx2, [dirty]) {
|
|
const hst_story_changes = {};
|
|
if (dirty & /*$$scope*/
|
|
2) {
|
|
hst_story_changes.$$scope = { dirty, ctx: ctx2 };
|
|
}
|
|
hst_story.$set(hst_story_changes);
|
|
},
|
|
i: function intro(local) {
|
|
if (current)
|
|
return;
|
|
transition_in(hst_story.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(hst_story.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
destroy_component(hst_story, detaching);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$5.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function instance$5($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Float_story", slots, []);
|
|
let { Hst } = $$props;
|
|
$$self.$$.on_mount.push(function() {
|
|
if (Hst === void 0 && !("Hst" in $$props || $$self.$$.bound[$$self.$$.props["Hst"]])) {
|
|
console.warn("<Float_story> was created without expected prop 'Hst'");
|
|
}
|
|
});
|
|
const writable_props = ["Hst"];
|
|
Object.keys($$props).forEach((key) => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot")
|
|
console.warn(`<Float_story> was created with unknown prop '${key}'`);
|
|
});
|
|
$$self.$$set = ($$props2) => {
|
|
if ("Hst" in $$props2)
|
|
$$invalidate(0, Hst = $$props2.Hst);
|
|
};
|
|
$$self.$capture_state = () => ({ Hst, Float });
|
|
$$self.$inject_state = ($$props2) => {
|
|
if ("Hst" in $$props2)
|
|
$$invalidate(0, Hst = $$props2.Hst);
|
|
};
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
return [Hst];
|
|
}
|
|
class Float_story extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$5, create_fragment$5, safe_not_equal, { Hst: 0 });
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Float_story",
|
|
options,
|
|
id: create_fragment$5.name
|
|
});
|
|
}
|
|
get Hst() {
|
|
throw new Error("<Float_story>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set Hst(value) {
|
|
throw new Error("<Float_story>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
const file$4 = "src/lib/elements/Integer.svelte";
|
|
function create_if_block(ctx) {
|
|
let span;
|
|
let span_style_value;
|
|
const block = {
|
|
c: function create() {
|
|
span = element("span");
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
span = claim_element(nodes, "SPAN", { class: true, style: true });
|
|
children(span).forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
attr_dev(span, "class", "overlay s-mdEAMJCfSFSg");
|
|
attr_dev(span, "style", span_style_value = `width: ${Math.min(
|
|
/*value*/
|
|
(ctx[0] - /*min*/
|
|
ctx[1]) / /*max*/
|
|
(ctx[2] - /*min*/
|
|
ctx[1]),
|
|
1
|
|
) * 100}%`);
|
|
add_location(span, file$4, 89, 4, 1949);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, span, anchor);
|
|
},
|
|
p: function update(ctx2, dirty) {
|
|
if (dirty & /*value, min, max*/
|
|
7 && span_style_value !== (span_style_value = `width: ${Math.min(
|
|
/*value*/
|
|
(ctx2[0] - /*min*/
|
|
ctx2[1]) / /*max*/
|
|
(ctx2[2] - /*min*/
|
|
ctx2[1]),
|
|
1
|
|
) * 100}%`)) {
|
|
attr_dev(span, "style", span_style_value);
|
|
}
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(span);
|
|
}
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_if_block.name,
|
|
type: "if",
|
|
source: '(75:2) {#if typeof min !== \\"undefined\\" && typeof max !== \\"undefined\\"}',
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function create_fragment$4(ctx) {
|
|
let div;
|
|
let t0;
|
|
let button0;
|
|
let textContent = "-";
|
|
let t2;
|
|
let input;
|
|
let input_style_value;
|
|
let t3;
|
|
let button1;
|
|
let textContent_1 = "+";
|
|
let mounted;
|
|
let dispose;
|
|
let if_block = typeof /*min*/
|
|
ctx[1] !== "undefined" && typeof /*max*/
|
|
ctx[2] !== "undefined" && create_if_block(ctx);
|
|
const block = {
|
|
c: function create() {
|
|
div = element("div");
|
|
if (if_block)
|
|
if_block.c();
|
|
t0 = space();
|
|
button0 = element("button");
|
|
button0.textContent = textContent;
|
|
t2 = space();
|
|
input = element("input");
|
|
t3 = space();
|
|
button1 = element("button");
|
|
button1.textContent = textContent_1;
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
div = claim_element(nodes, "DIV", {
|
|
class: true,
|
|
role: true,
|
|
tabindex: true,
|
|
"aria-valuenow": true
|
|
});
|
|
var div_nodes = children(div);
|
|
if (if_block)
|
|
if_block.l(div_nodes);
|
|
t0 = claim_space(div_nodes);
|
|
button0 = claim_element(div_nodes, "BUTTON", { class: true, ["data-svelte-h"]: true });
|
|
if (get_svelte_dataset(button0) !== "svelte-1bw2b1l")
|
|
button0.textContent = textContent;
|
|
t2 = claim_space(div_nodes);
|
|
input = claim_element(div_nodes, "INPUT", {
|
|
step: true,
|
|
max: true,
|
|
min: true,
|
|
type: true,
|
|
style: true,
|
|
class: true
|
|
});
|
|
t3 = claim_space(div_nodes);
|
|
button1 = claim_element(div_nodes, "BUTTON", { class: true, ["data-svelte-h"]: true });
|
|
if (get_svelte_dataset(button1) !== "svelte-4ac98d")
|
|
button1.textContent = textContent_1;
|
|
div_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
attr_dev(button0, "class", "s-mdEAMJCfSFSg");
|
|
add_location(button0, file$4, 94, 2, 2068);
|
|
attr_dev(
|
|
input,
|
|
"step",
|
|
/*step*/
|
|
ctx[3]
|
|
);
|
|
attr_dev(
|
|
input,
|
|
"max",
|
|
/*max*/
|
|
ctx[2]
|
|
);
|
|
attr_dev(
|
|
input,
|
|
"min",
|
|
/*min*/
|
|
ctx[1]
|
|
);
|
|
attr_dev(input, "type", "number");
|
|
attr_dev(input, "style", input_style_value = `width:${/*width*/
|
|
ctx[6]};`);
|
|
attr_dev(input, "class", "s-mdEAMJCfSFSg");
|
|
add_location(input, file$4, 95, 2, 2126);
|
|
attr_dev(button1, "class", "s-mdEAMJCfSFSg");
|
|
add_location(button1, file$4, 105, 2, 2259);
|
|
attr_dev(div, "class", "component-wrapper s-mdEAMJCfSFSg");
|
|
attr_dev(div, "role", "slider");
|
|
attr_dev(div, "tabindex", "0");
|
|
attr_dev(
|
|
div,
|
|
"aria-valuenow",
|
|
/*value*/
|
|
ctx[0]
|
|
);
|
|
add_location(div, file$4, 79, 0, 1706);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, div, anchor);
|
|
if (if_block)
|
|
if_block.m(div, null);
|
|
append_hydration_dev(div, t0);
|
|
append_hydration_dev(div, button0);
|
|
append_hydration_dev(div, t2);
|
|
append_hydration_dev(div, input);
|
|
set_input_value(
|
|
input,
|
|
/*value*/
|
|
ctx[0]
|
|
);
|
|
ctx[13](input);
|
|
append_hydration_dev(div, t3);
|
|
append_hydration_dev(div, button1);
|
|
ctx[15](div);
|
|
if (!mounted) {
|
|
dispose = [
|
|
listen_dev(
|
|
button0,
|
|
"click",
|
|
/*click_handler*/
|
|
ctx[11],
|
|
false,
|
|
false,
|
|
false,
|
|
false
|
|
),
|
|
listen_dev(
|
|
input,
|
|
"input",
|
|
/*input_input_handler*/
|
|
ctx[12]
|
|
),
|
|
listen_dev(
|
|
button1,
|
|
"click",
|
|
/*click_handler_1*/
|
|
ctx[14],
|
|
false,
|
|
false,
|
|
false,
|
|
false
|
|
),
|
|
listen_dev(
|
|
div,
|
|
"mousedown",
|
|
/*handleMouseDown*/
|
|
ctx[8],
|
|
false,
|
|
false,
|
|
false,
|
|
false
|
|
),
|
|
listen_dev(
|
|
div,
|
|
"mouseup",
|
|
/*handleMouseUp*/
|
|
ctx[9],
|
|
false,
|
|
false,
|
|
false,
|
|
false
|
|
)
|
|
];
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: function update(ctx2, [dirty]) {
|
|
if (typeof /*min*/
|
|
ctx2[1] !== "undefined" && typeof /*max*/
|
|
ctx2[2] !== "undefined") {
|
|
if (if_block) {
|
|
if_block.p(ctx2, dirty);
|
|
} else {
|
|
if_block = create_if_block(ctx2);
|
|
if_block.c();
|
|
if_block.m(div, t0);
|
|
}
|
|
} else if (if_block) {
|
|
if_block.d(1);
|
|
if_block = null;
|
|
}
|
|
if (dirty & /*step*/
|
|
8) {
|
|
attr_dev(
|
|
input,
|
|
"step",
|
|
/*step*/
|
|
ctx2[3]
|
|
);
|
|
}
|
|
if (dirty & /*max*/
|
|
4) {
|
|
attr_dev(
|
|
input,
|
|
"max",
|
|
/*max*/
|
|
ctx2[2]
|
|
);
|
|
}
|
|
if (dirty & /*min*/
|
|
2) {
|
|
attr_dev(
|
|
input,
|
|
"min",
|
|
/*min*/
|
|
ctx2[1]
|
|
);
|
|
}
|
|
if (dirty & /*width*/
|
|
64 && input_style_value !== (input_style_value = `width:${/*width*/
|
|
ctx2[6]};`)) {
|
|
attr_dev(input, "style", input_style_value);
|
|
}
|
|
if (dirty & /*value*/
|
|
1 && to_number(input.value) !== /*value*/
|
|
ctx2[0]) {
|
|
set_input_value(
|
|
input,
|
|
/*value*/
|
|
ctx2[0]
|
|
);
|
|
}
|
|
if (dirty & /*value*/
|
|
1) {
|
|
attr_dev(
|
|
div,
|
|
"aria-valuenow",
|
|
/*value*/
|
|
ctx2[0]
|
|
);
|
|
}
|
|
},
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(div);
|
|
}
|
|
if (if_block)
|
|
if_block.d();
|
|
ctx[13](null);
|
|
ctx[15](null);
|
|
mounted = false;
|
|
run_all(dispose);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$4.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function instance$4($$self, $$props, $$invalidate) {
|
|
let width;
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Integer", slots, []);
|
|
const dispatch = createEventDispatcher();
|
|
let { min = void 0 } = $$props;
|
|
let { max = void 0 } = $$props;
|
|
let { step = 1 } = $$props;
|
|
let { value = 0 } = $$props;
|
|
let { id = "" } = $$props;
|
|
if (!value) {
|
|
value = 0;
|
|
}
|
|
let inputEl;
|
|
let wrapper;
|
|
let prev = -1;
|
|
function update() {
|
|
if (prev === value)
|
|
return;
|
|
prev = value;
|
|
dispatch("change", parseFloat(value + ""));
|
|
}
|
|
function handleChange(change) {
|
|
$$invalidate(0, value = Math.max(min ?? -Infinity, Math.min(+value + change, max ?? Infinity)));
|
|
}
|
|
let downX = 0;
|
|
let downV = 0;
|
|
let rect;
|
|
function handleMouseDown(ev) {
|
|
ev.preventDefault();
|
|
downV = value;
|
|
downX = ev.clientX;
|
|
rect = wrapper.getBoundingClientRect();
|
|
window.removeEventListener("mousemove", handleMouseMove);
|
|
window.addEventListener("mousemove", handleMouseMove);
|
|
window.addEventListener("mouseup", handleMouseUp);
|
|
document.body.style.cursor = "ew-resize";
|
|
}
|
|
function handleMouseUp() {
|
|
if (downV === value) {
|
|
inputEl.focus();
|
|
} else {
|
|
inputEl.blur();
|
|
}
|
|
document.body.style.cursor = "unset";
|
|
window.removeEventListener("mouseup", handleMouseUp);
|
|
window.removeEventListener("mousemove", handleMouseMove);
|
|
}
|
|
function handleMouseMove(ev) {
|
|
if (!ev.ctrlKey && typeof min === "number" && typeof max === "number") {
|
|
const vx = (ev.clientX - rect.left) / rect.width;
|
|
$$invalidate(0, value = Math.max(Math.min(Math.floor(min + (max - min) * vx), max), min));
|
|
} else {
|
|
const vx = ev.clientX - downX;
|
|
$$invalidate(0, value = downV + Math.floor(vx / 10));
|
|
}
|
|
}
|
|
const writable_props = ["min", "max", "step", "value", "id"];
|
|
Object.keys($$props).forEach((key) => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot")
|
|
console.warn(`<Integer> was created with unknown prop '${key}'`);
|
|
});
|
|
const click_handler = () => handleChange(-step);
|
|
function input_input_handler() {
|
|
value = to_number(this.value);
|
|
$$invalidate(0, value);
|
|
}
|
|
function input_binding($$value) {
|
|
binding_callbacks[$$value ? "unshift" : "push"](() => {
|
|
inputEl = $$value;
|
|
$$invalidate(4, inputEl);
|
|
});
|
|
}
|
|
const click_handler_1 = () => handleChange(+step);
|
|
function div_binding($$value) {
|
|
binding_callbacks[$$value ? "unshift" : "push"](() => {
|
|
wrapper = $$value;
|
|
$$invalidate(5, wrapper);
|
|
});
|
|
}
|
|
$$self.$$set = ($$props2) => {
|
|
if ("min" in $$props2)
|
|
$$invalidate(1, min = $$props2.min);
|
|
if ("max" in $$props2)
|
|
$$invalidate(2, max = $$props2.max);
|
|
if ("step" in $$props2)
|
|
$$invalidate(3, step = $$props2.step);
|
|
if ("value" in $$props2)
|
|
$$invalidate(0, value = $$props2.value);
|
|
if ("id" in $$props2)
|
|
$$invalidate(10, id = $$props2.id);
|
|
};
|
|
$$self.$capture_state = () => ({
|
|
createEventDispatcher,
|
|
dispatch,
|
|
min,
|
|
max,
|
|
step,
|
|
value,
|
|
id,
|
|
inputEl,
|
|
wrapper,
|
|
prev,
|
|
update,
|
|
handleChange,
|
|
downX,
|
|
downV,
|
|
rect,
|
|
handleMouseDown,
|
|
handleMouseUp,
|
|
handleMouseMove,
|
|
width
|
|
});
|
|
$$self.$inject_state = ($$props2) => {
|
|
if ("min" in $$props2)
|
|
$$invalidate(1, min = $$props2.min);
|
|
if ("max" in $$props2)
|
|
$$invalidate(2, max = $$props2.max);
|
|
if ("step" in $$props2)
|
|
$$invalidate(3, step = $$props2.step);
|
|
if ("value" in $$props2)
|
|
$$invalidate(0, value = $$props2.value);
|
|
if ("id" in $$props2)
|
|
$$invalidate(10, id = $$props2.id);
|
|
if ("inputEl" in $$props2)
|
|
$$invalidate(4, inputEl = $$props2.inputEl);
|
|
if ("wrapper" in $$props2)
|
|
$$invalidate(5, wrapper = $$props2.wrapper);
|
|
if ("prev" in $$props2)
|
|
prev = $$props2.prev;
|
|
if ("downX" in $$props2)
|
|
downX = $$props2.downX;
|
|
if ("downV" in $$props2)
|
|
downV = $$props2.downV;
|
|
if ("rect" in $$props2)
|
|
rect = $$props2.rect;
|
|
if ("width" in $$props2)
|
|
$$invalidate(6, width = $$props2.width);
|
|
};
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
$$self.$$.update = () => {
|
|
if ($$self.$$.dirty & /*value*/
|
|
1) {
|
|
value !== void 0 && update();
|
|
}
|
|
if ($$self.$$.dirty & /*value*/
|
|
1) {
|
|
$$invalidate(6, width = Number.isFinite(value) ? Math.max(((value == null ? void 0 : value.toString().length) ?? 1) * 8, 30) + "px" : "20px");
|
|
}
|
|
};
|
|
return [
|
|
value,
|
|
min,
|
|
max,
|
|
step,
|
|
inputEl,
|
|
wrapper,
|
|
width,
|
|
handleChange,
|
|
handleMouseDown,
|
|
handleMouseUp,
|
|
id,
|
|
click_handler,
|
|
input_input_handler,
|
|
input_binding,
|
|
click_handler_1,
|
|
div_binding
|
|
];
|
|
}
|
|
class Integer extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$4, create_fragment$4, safe_not_equal, {
|
|
min: 1,
|
|
max: 2,
|
|
step: 3,
|
|
value: 0,
|
|
id: 10
|
|
});
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Integer",
|
|
options,
|
|
id: create_fragment$4.name
|
|
});
|
|
}
|
|
get min() {
|
|
return this.$$.ctx[1];
|
|
}
|
|
set min(min) {
|
|
this.$$set({ min });
|
|
flush();
|
|
}
|
|
get max() {
|
|
return this.$$.ctx[2];
|
|
}
|
|
set max(max) {
|
|
this.$$set({ max });
|
|
flush();
|
|
}
|
|
get step() {
|
|
return this.$$.ctx[3];
|
|
}
|
|
set step(step) {
|
|
this.$$set({ step });
|
|
flush();
|
|
}
|
|
get value() {
|
|
return this.$$.ctx[0];
|
|
}
|
|
set value(value) {
|
|
this.$$set({ value });
|
|
flush();
|
|
}
|
|
get id() {
|
|
return this.$$.ctx[10];
|
|
}
|
|
set id(id) {
|
|
this.$$set({ id });
|
|
flush();
|
|
}
|
|
}
|
|
const file$3 = "src/lib/helpers/StorySettings.svelte";
|
|
function get_each_context$1(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[0] = list[i];
|
|
return child_ctx;
|
|
}
|
|
function create_each_block$1(ctx) {
|
|
let option;
|
|
const block = {
|
|
c: function create() {
|
|
option = element("option");
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
option = claim_element(nodes, "OPTION", {});
|
|
var option_nodes = children(option);
|
|
option_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
option.__value = /*theme*/
|
|
ctx[0];
|
|
set_input_value(option, option.__value);
|
|
add_location(option, file$3, 27, 4, 542);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, option, anchor);
|
|
},
|
|
p: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(option);
|
|
}
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block$1.name,
|
|
type: "each",
|
|
source: "(25:2) {#each themes as theme}",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function create_fragment$3(ctx) {
|
|
let select;
|
|
let mounted;
|
|
let dispose;
|
|
let each_value = ensure_array_like_dev(
|
|
/*themes*/
|
|
ctx[1]
|
|
);
|
|
let each_blocks = [];
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
each_blocks[i] = create_each_block$1(get_each_context$1(ctx, each_value, i));
|
|
}
|
|
const block = {
|
|
c: function create() {
|
|
select = element("select");
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
select = claim_element(nodes, "SELECT", {});
|
|
var select_nodes = children(select);
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].l(select_nodes);
|
|
}
|
|
select_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
if (
|
|
/*theme*/
|
|
ctx[0] === void 0
|
|
)
|
|
add_render_callback(() => (
|
|
/*select_change_handler*/
|
|
ctx[2].call(select)
|
|
));
|
|
add_location(select, file$3, 25, 0, 484);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, select, anchor);
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
if (each_blocks[i]) {
|
|
each_blocks[i].m(select, null);
|
|
}
|
|
}
|
|
select_option(
|
|
select,
|
|
/*theme*/
|
|
ctx[0],
|
|
true
|
|
);
|
|
if (!mounted) {
|
|
dispose = listen_dev(
|
|
select,
|
|
"change",
|
|
/*select_change_handler*/
|
|
ctx[2]
|
|
);
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: function update(ctx2, [dirty]) {
|
|
if (dirty & /*themes*/
|
|
2) {
|
|
each_value = ensure_array_like_dev(
|
|
/*themes*/
|
|
ctx2[1]
|
|
);
|
|
let i;
|
|
for (i = 0; i < each_value.length; i += 1) {
|
|
const child_ctx = get_each_context$1(ctx2, each_value, i);
|
|
if (each_blocks[i]) {
|
|
each_blocks[i].p(child_ctx, dirty);
|
|
} else {
|
|
each_blocks[i] = create_each_block$1(child_ctx);
|
|
each_blocks[i].c();
|
|
each_blocks[i].m(select, null);
|
|
}
|
|
}
|
|
for (; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].d(1);
|
|
}
|
|
each_blocks.length = each_value.length;
|
|
}
|
|
if (dirty & /*theme, themes*/
|
|
3) {
|
|
select_option(
|
|
select,
|
|
/*theme*/
|
|
ctx2[0]
|
|
);
|
|
}
|
|
},
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(select);
|
|
}
|
|
destroy_each(each_blocks, detaching);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$3.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function instance$3($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("StorySettings", slots, []);
|
|
const themes = ["dark", "light", "catppuccin", "solarized", "high-contrast", "nord", "dracula"];
|
|
let theme = themes[0];
|
|
const writable_props = [];
|
|
Object.keys($$props).forEach((key) => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot")
|
|
console.warn(`<StorySettings> was created with unknown prop '${key}'`);
|
|
});
|
|
function select_change_handler() {
|
|
theme = select_value(this);
|
|
$$invalidate(0, theme);
|
|
$$invalidate(1, themes);
|
|
}
|
|
$$self.$capture_state = () => ({ themes, theme });
|
|
$$self.$inject_state = ($$props2) => {
|
|
if ("theme" in $$props2)
|
|
$$invalidate(0, theme = $$props2.theme);
|
|
};
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
$$self.$$.update = () => {
|
|
if ($$self.$$.dirty & /*theme*/
|
|
1) {
|
|
if (theme) {
|
|
const classes = document.body.classList;
|
|
const newClassName = `theme-${theme}`;
|
|
for (const className of classes) {
|
|
if (className.startsWith("theme-") && className !== newClassName) {
|
|
classes.remove(className);
|
|
}
|
|
}
|
|
document.body.classList.add(newClassName);
|
|
}
|
|
}
|
|
};
|
|
return [theme, themes, select_change_handler];
|
|
}
|
|
class StorySettings extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$3, create_fragment$3, safe_not_equal, {});
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "StorySettings",
|
|
options,
|
|
id: create_fragment$3.name
|
|
});
|
|
}
|
|
}
|
|
const file$2 = "src/lib/elements/Integer.story.svelte";
|
|
function create_default_slot$1(ctx) {
|
|
let div;
|
|
let integer;
|
|
let current;
|
|
integer = new Integer({
|
|
props: { value: 5, min: 0, max: 42 },
|
|
$$inline: true
|
|
});
|
|
const block = {
|
|
c: function create() {
|
|
div = element("div");
|
|
create_component(integer.$$.fragment);
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
div = claim_element(nodes, "DIV", { class: true });
|
|
var div_nodes = children(div);
|
|
claim_component(integer.$$.fragment, div_nodes);
|
|
div_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
attr_dev(div, "class", "s-c5uIg08NK9i-");
|
|
add_location(div, file$2, 8, 2, 160);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, div, anchor);
|
|
mount_component(integer, div, null);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current)
|
|
return;
|
|
transition_in(integer.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(integer.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(div);
|
|
}
|
|
destroy_component(integer);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_default_slot$1.name,
|
|
type: "slot",
|
|
source: "(6:0) <Hst.Story>",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function create_controls_slot(ctx) {
|
|
let storysettings;
|
|
let current;
|
|
storysettings = new StorySettings({ $$inline: true });
|
|
const block = {
|
|
c: function create() {
|
|
create_component(storysettings.$$.fragment);
|
|
},
|
|
l: function claim(nodes) {
|
|
claim_component(storysettings.$$.fragment, nodes);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
mount_component(storysettings, target, anchor);
|
|
current = true;
|
|
},
|
|
i: function intro(local) {
|
|
if (current)
|
|
return;
|
|
transition_in(storysettings.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(storysettings.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
destroy_component(storysettings, detaching);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_controls_slot.name,
|
|
type: "slot",
|
|
source: '(10:3) <svelte:fragment slot=\\"controls\\">',
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function create_fragment$2(ctx) {
|
|
let hst_story;
|
|
let current;
|
|
hst_story = new /*Hst*/
|
|
ctx[0].Story({
|
|
props: {
|
|
$$slots: {
|
|
controls: [create_controls_slot],
|
|
default: [create_default_slot$1]
|
|
},
|
|
$$scope: { ctx }
|
|
},
|
|
$$inline: true
|
|
});
|
|
const block = {
|
|
c: function create() {
|
|
create_component(hst_story.$$.fragment);
|
|
},
|
|
l: function claim(nodes) {
|
|
claim_component(hst_story.$$.fragment, nodes);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
mount_component(hst_story, target, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx2, [dirty]) {
|
|
const hst_story_changes = {};
|
|
if (dirty & /*$$scope*/
|
|
2) {
|
|
hst_story_changes.$$scope = { dirty, ctx: ctx2 };
|
|
}
|
|
hst_story.$set(hst_story_changes);
|
|
},
|
|
i: function intro(local) {
|
|
if (current)
|
|
return;
|
|
transition_in(hst_story.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(hst_story.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
destroy_component(hst_story, detaching);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$2.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function instance$2($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Integer_story", slots, []);
|
|
let { Hst } = $$props;
|
|
$$self.$$.on_mount.push(function() {
|
|
if (Hst === void 0 && !("Hst" in $$props || $$self.$$.bound[$$self.$$.props["Hst"]])) {
|
|
console.warn("<Integer_story> was created without expected prop 'Hst'");
|
|
}
|
|
});
|
|
const writable_props = ["Hst"];
|
|
Object.keys($$props).forEach((key) => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot")
|
|
console.warn(`<Integer_story> was created with unknown prop '${key}'`);
|
|
});
|
|
$$self.$$set = ($$props2) => {
|
|
if ("Hst" in $$props2)
|
|
$$invalidate(0, Hst = $$props2.Hst);
|
|
};
|
|
$$self.$capture_state = () => ({ Hst, Integer, StorySettings });
|
|
$$self.$inject_state = ($$props2) => {
|
|
if ("Hst" in $$props2)
|
|
$$invalidate(0, Hst = $$props2.Hst);
|
|
};
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
return [Hst];
|
|
}
|
|
class Integer_story extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$2, create_fragment$2, safe_not_equal, { Hst: 0 });
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Integer_story",
|
|
options,
|
|
id: create_fragment$2.name
|
|
});
|
|
}
|
|
get Hst() {
|
|
throw new Error("<Integer_story>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set Hst(value) {
|
|
throw new Error("<Integer_story>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
const file$1 = "src/lib/elements/Select.svelte";
|
|
function get_each_context(ctx, list, i) {
|
|
const child_ctx = ctx.slice();
|
|
child_ctx[4] = list[i];
|
|
child_ctx[6] = i;
|
|
return child_ctx;
|
|
}
|
|
function create_each_block(ctx) {
|
|
let option;
|
|
let t_value = (
|
|
/*label*/
|
|
ctx[4] + ""
|
|
);
|
|
let t;
|
|
const block = {
|
|
c: function create() {
|
|
option = element("option");
|
|
t = text(t_value);
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
option = claim_element(nodes, "OPTION", {});
|
|
var option_nodes = children(option);
|
|
t = claim_text(option_nodes, t_value);
|
|
option_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
option.__value = /*i*/
|
|
ctx[6];
|
|
set_input_value(option, option.__value);
|
|
add_location(option, file$1, 8, 4, 150);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, option, anchor);
|
|
append_hydration_dev(option, t);
|
|
},
|
|
p: function update(ctx2, dirty) {
|
|
if (dirty & /*options*/
|
|
2 && t_value !== (t_value = /*label*/
|
|
ctx2[4] + ""))
|
|
set_data_dev(t, t_value);
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(option);
|
|
}
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_each_block.name,
|
|
type: "each",
|
|
source: "(7:2) {#each options as label, i}",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function create_fragment$1(ctx) {
|
|
let select;
|
|
let mounted;
|
|
let dispose;
|
|
let each_value = ensure_array_like_dev(
|
|
/*options*/
|
|
ctx[1]
|
|
);
|
|
let each_blocks = [];
|
|
for (let i = 0; i < each_value.length; i += 1) {
|
|
each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i));
|
|
}
|
|
const block = {
|
|
c: function create() {
|
|
select = element("select");
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].c();
|
|
}
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
select = claim_element(nodes, "SELECT", { id: true, class: true });
|
|
var select_nodes = children(select);
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].l(select_nodes);
|
|
}
|
|
select_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
attr_dev(
|
|
select,
|
|
"id",
|
|
/*id*/
|
|
ctx[2]
|
|
);
|
|
attr_dev(select, "class", "s-NKPjzx4oHzNZ");
|
|
if (
|
|
/*value*/
|
|
ctx[0] === void 0
|
|
)
|
|
add_render_callback(() => (
|
|
/*select_change_handler*/
|
|
ctx[3].call(select)
|
|
));
|
|
add_location(select, file$1, 6, 0, 91);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, select, anchor);
|
|
for (let i = 0; i < each_blocks.length; i += 1) {
|
|
if (each_blocks[i]) {
|
|
each_blocks[i].m(select, null);
|
|
}
|
|
}
|
|
select_option(
|
|
select,
|
|
/*value*/
|
|
ctx[0],
|
|
true
|
|
);
|
|
if (!mounted) {
|
|
dispose = listen_dev(
|
|
select,
|
|
"change",
|
|
/*select_change_handler*/
|
|
ctx[3]
|
|
);
|
|
mounted = true;
|
|
}
|
|
},
|
|
p: function update(ctx2, [dirty]) {
|
|
if (dirty & /*options*/
|
|
2) {
|
|
each_value = ensure_array_like_dev(
|
|
/*options*/
|
|
ctx2[1]
|
|
);
|
|
let i;
|
|
for (i = 0; i < each_value.length; i += 1) {
|
|
const child_ctx = get_each_context(ctx2, each_value, i);
|
|
if (each_blocks[i]) {
|
|
each_blocks[i].p(child_ctx, dirty);
|
|
} else {
|
|
each_blocks[i] = create_each_block(child_ctx);
|
|
each_blocks[i].c();
|
|
each_blocks[i].m(select, null);
|
|
}
|
|
}
|
|
for (; i < each_blocks.length; i += 1) {
|
|
each_blocks[i].d(1);
|
|
}
|
|
each_blocks.length = each_value.length;
|
|
}
|
|
if (dirty & /*id*/
|
|
4) {
|
|
attr_dev(
|
|
select,
|
|
"id",
|
|
/*id*/
|
|
ctx2[2]
|
|
);
|
|
}
|
|
if (dirty & /*value*/
|
|
1) {
|
|
select_option(
|
|
select,
|
|
/*value*/
|
|
ctx2[0]
|
|
);
|
|
}
|
|
},
|
|
i: noop,
|
|
o: noop,
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(select);
|
|
}
|
|
destroy_each(each_blocks, detaching);
|
|
mounted = false;
|
|
dispose();
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment$1.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function instance$1($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Select", slots, []);
|
|
let { options = [] } = $$props;
|
|
let { value = 0 } = $$props;
|
|
let { id } = $$props;
|
|
$$self.$$.on_mount.push(function() {
|
|
if (id === void 0 && !("id" in $$props || $$self.$$.bound[$$self.$$.props["id"]])) {
|
|
console.warn("<Select> was created without expected prop 'id'");
|
|
}
|
|
});
|
|
const writable_props = ["options", "value", "id"];
|
|
Object.keys($$props).forEach((key) => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot")
|
|
console.warn(`<Select> was created with unknown prop '${key}'`);
|
|
});
|
|
function select_change_handler() {
|
|
value = select_value(this);
|
|
$$invalidate(0, value);
|
|
}
|
|
$$self.$$set = ($$props2) => {
|
|
if ("options" in $$props2)
|
|
$$invalidate(1, options = $$props2.options);
|
|
if ("value" in $$props2)
|
|
$$invalidate(0, value = $$props2.value);
|
|
if ("id" in $$props2)
|
|
$$invalidate(2, id = $$props2.id);
|
|
};
|
|
$$self.$capture_state = () => ({ options, value, id });
|
|
$$self.$inject_state = ($$props2) => {
|
|
if ("options" in $$props2)
|
|
$$invalidate(1, options = $$props2.options);
|
|
if ("value" in $$props2)
|
|
$$invalidate(0, value = $$props2.value);
|
|
if ("id" in $$props2)
|
|
$$invalidate(2, id = $$props2.id);
|
|
};
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
return [value, options, id, select_change_handler];
|
|
}
|
|
class Select extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance$1, create_fragment$1, safe_not_equal, { options: 1, value: 0, id: 2 });
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Select",
|
|
options,
|
|
id: create_fragment$1.name
|
|
});
|
|
}
|
|
get options() {
|
|
throw new Error("<Select>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set options(value) {
|
|
throw new Error("<Select>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
get value() {
|
|
throw new Error("<Select>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set value(value) {
|
|
throw new Error("<Select>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
get id() {
|
|
throw new Error("<Select>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set id(value) {
|
|
throw new Error("<Select>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
const file = "src/lib/elements/Select.story.svelte";
|
|
function create_default_slot(ctx) {
|
|
let div;
|
|
let select;
|
|
let current;
|
|
select = new Select({
|
|
props: {
|
|
value: "banana",
|
|
options: ["strawberry", "apple", "banana"]
|
|
},
|
|
$$inline: true
|
|
});
|
|
const block = {
|
|
c: function create() {
|
|
div = element("div");
|
|
create_component(select.$$.fragment);
|
|
this.h();
|
|
},
|
|
l: function claim(nodes) {
|
|
div = claim_element(nodes, "DIV", { class: true });
|
|
var div_nodes = children(div);
|
|
claim_component(select.$$.fragment, div_nodes);
|
|
div_nodes.forEach(detach_dev);
|
|
this.h();
|
|
},
|
|
h: function hydrate() {
|
|
attr_dev(div, "class", "s-fW0cLvH8hir4");
|
|
add_location(div, file, 7, 2, 97);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
insert_hydration_dev(target, div, anchor);
|
|
mount_component(select, div, null);
|
|
current = true;
|
|
},
|
|
p: noop,
|
|
i: function intro(local) {
|
|
if (current)
|
|
return;
|
|
transition_in(select.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(select.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
if (detaching) {
|
|
detach_dev(div);
|
|
}
|
|
destroy_component(select);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_default_slot.name,
|
|
type: "slot",
|
|
source: "(5:0) <Hst.Story>",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function create_fragment(ctx) {
|
|
let hst_story;
|
|
let current;
|
|
hst_story = new /*Hst*/
|
|
ctx[0].Story({
|
|
props: {
|
|
$$slots: { default: [create_default_slot] },
|
|
$$scope: { ctx }
|
|
},
|
|
$$inline: true
|
|
});
|
|
const block = {
|
|
c: function create() {
|
|
create_component(hst_story.$$.fragment);
|
|
},
|
|
l: function claim(nodes) {
|
|
claim_component(hst_story.$$.fragment, nodes);
|
|
},
|
|
m: function mount(target, anchor) {
|
|
mount_component(hst_story, target, anchor);
|
|
current = true;
|
|
},
|
|
p: function update(ctx2, [dirty]) {
|
|
const hst_story_changes = {};
|
|
if (dirty & /*$$scope*/
|
|
2) {
|
|
hst_story_changes.$$scope = { dirty, ctx: ctx2 };
|
|
}
|
|
hst_story.$set(hst_story_changes);
|
|
},
|
|
i: function intro(local) {
|
|
if (current)
|
|
return;
|
|
transition_in(hst_story.$$.fragment, local);
|
|
current = true;
|
|
},
|
|
o: function outro(local) {
|
|
transition_out(hst_story.$$.fragment, local);
|
|
current = false;
|
|
},
|
|
d: function destroy(detaching) {
|
|
destroy_component(hst_story, detaching);
|
|
}
|
|
};
|
|
dispatch_dev("SvelteRegisterBlock", {
|
|
block,
|
|
id: create_fragment.name,
|
|
type: "component",
|
|
source: "",
|
|
ctx
|
|
});
|
|
return block;
|
|
}
|
|
function instance($$self, $$props, $$invalidate) {
|
|
let { $$slots: slots = {}, $$scope } = $$props;
|
|
validate_slots("Select_story", slots, []);
|
|
let { Hst } = $$props;
|
|
$$self.$$.on_mount.push(function() {
|
|
if (Hst === void 0 && !("Hst" in $$props || $$self.$$.bound[$$self.$$.props["Hst"]])) {
|
|
console.warn("<Select_story> was created without expected prop 'Hst'");
|
|
}
|
|
});
|
|
const writable_props = ["Hst"];
|
|
Object.keys($$props).forEach((key) => {
|
|
if (!~writable_props.indexOf(key) && key.slice(0, 2) !== "$$" && key !== "slot")
|
|
console.warn(`<Select_story> was created with unknown prop '${key}'`);
|
|
});
|
|
$$self.$$set = ($$props2) => {
|
|
if ("Hst" in $$props2)
|
|
$$invalidate(0, Hst = $$props2.Hst);
|
|
};
|
|
$$self.$capture_state = () => ({ Hst, Select });
|
|
$$self.$inject_state = ($$props2) => {
|
|
if ("Hst" in $$props2)
|
|
$$invalidate(0, Hst = $$props2.Hst);
|
|
};
|
|
if ($$props && "$$inject" in $$props) {
|
|
$$self.$inject_state($$props.$$inject);
|
|
}
|
|
return [Hst];
|
|
}
|
|
class Select_story extends SvelteComponentDev {
|
|
constructor(options) {
|
|
super(options);
|
|
init(this, options, instance, create_fragment, safe_not_equal, { Hst: 0 });
|
|
dispatch_dev("SvelteRegisterComponent", {
|
|
component: this,
|
|
tagName: "Select_story",
|
|
options,
|
|
id: create_fragment.name
|
|
});
|
|
}
|
|
get Hst() {
|
|
throw new Error("<Select_story>: Props cannot be read directly from the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
set Hst(value) {
|
|
throw new Error("<Select_story>: Props cannot be set directly on the component instance unless compiling with 'accessors: true' or '<svelte:options accessors/>'");
|
|
}
|
|
}
|
|
let files = [
|
|
{ "id": "src-lib-elements-checkbox-story-svelte", "path": ["Checkbox"], "filePath": "src/lib/elements/Checkbox.story.svelte", "story": { "id": "src-lib-elements-checkbox-story-svelte", "title": "Checkbox", "group": null, "layout": { "type": "single", "iframe": true }, "icon": null, "iconColor": null, "docsOnly": false, "variants": [{ "id": "_default", "title": "default" }] }, "supportPluginId": "svelte4", "index": 0, component: Checkbox_story, source: () => __vitePreload(() => import("./__resolved__virtual_story-source_src-lib-elements-checkbox-story-svelte-BdydEysz.js"), true ? [] : void 0) },
|
|
{ "id": "src-lib-elements-float-story-svelte", "path": ["Float"], "filePath": "src/lib/elements/Float.story.svelte", "story": { "id": "src-lib-elements-float-story-svelte", "title": "Float", "group": null, "layout": { "type": "single", "iframe": true }, "icon": null, "iconColor": null, "docsOnly": false, "variants": [{ "id": "_default", "title": "default" }] }, "supportPluginId": "svelte4", "index": 1, component: Float_story, source: () => __vitePreload(() => import("./__resolved__virtual_story-source_src-lib-elements-float-story-svelte-DXuET9ZY.js"), true ? [] : void 0) },
|
|
{ "id": "src-lib-elements-integer-story-svelte", "path": ["Integer"], "filePath": "src/lib/elements/Integer.story.svelte", "story": { "id": "src-lib-elements-integer-story-svelte", "title": "Integer", "group": null, "layout": { "type": "single", "iframe": true }, "icon": null, "iconColor": null, "docsOnly": false, "variants": [{ "id": "_default", "title": "default" }] }, "supportPluginId": "svelte4", "index": 2, component: Integer_story, source: () => __vitePreload(() => import("./__resolved__virtual_story-source_src-lib-elements-integer-story-svelte-IirIfVMy.js"), true ? [] : void 0) },
|
|
{ "id": "src-lib-elements-select-story-svelte", "path": ["Select"], "filePath": "src/lib/elements/Select.story.svelte", "story": { "id": "src-lib-elements-select-story-svelte", "title": "Select", "group": null, "layout": { "type": "single", "iframe": true }, "icon": null, "iconColor": null, "docsOnly": false, "variants": [{ "id": "_default", "title": "default" }] }, "supportPluginId": "svelte4", "index": 3, component: Select_story, source: () => __vitePreload(() => import("./__resolved__virtual_story-source_src-lib-elements-select-story-svelte-BRO43j7_.js"), true ? [] : void 0) }
|
|
];
|
|
let tree = [{ "title": "Checkbox", "index": 0 }, { "title": "Float", "index": 1 }, { "title": "Integer", "index": 2 }, { "title": "Select", "index": 3 }];
|
|
const config = { "plugins": [{ "name": "builtin:tailwind-tokens" }, { "name": "builtin:vanilla-support", "supportPlugin": { "id": "vanilla", "moduleName": "/home/max/Projects/nodes/node_modules/.pnpm/histoire@0.17.17_@types+node@20.12.7_sass@1.75.0_vite@5.2.9_@types+node@20.12.7_sass@1.75.0_/node_modules/histoire/dist/node/builtin-plugins/vanilla-support", "setupFn": "setupVanilla" } }, { "name": "@histoire/plugin-svelte", "supportPlugin": { "id": "svelte4", "moduleName": "@histoire/plugin-svelte", "setupFn": ["setupSvelte3", "setupSvelte4"] }, "commands": [{ "id": "histoire:plugin-svelte:generate-story", "label": "Generate Svelte 3 story from component", "icon": "https://svelte.dev/favicon.png", "searchText": "generate create", "clientSetupFile": "@histoire/plugin-svelte/dist/commands/generate-story.client.js" }] }], "outDir": "/home/max/Projects/nodes/packages/ui/.histoire/dist", "storyMatch": ["**/*.story.vue", "**/*.story.svelte"], "storyIgnored": ["**/node_modules/**", "**/dist/**"], "supportMatch": [{ "id": "vanilla", "patterns": ["**/*.js"], "pluginIds": ["vanilla"] }, { "id": "svelte", "patterns": ["**/*.svelte"], "pluginIds": ["svelte4"] }], "tree": { "file": "title", "order": "asc" }, "theme": { "title": "Histoire", "colors": { "primary": { "50": "#fff7ed", "100": "#ffedd5", "200": "#fed7aa", "300": "#fdba74", "400": "#fb923c", "500": "#f97316", "600": "#ea580c", "700": "#c2410c", "800": "#9a3412", "900": "#7c2d12" }, "gray": { "50": "#fafafa", "100": "#f4f4f5", "200": "#e4e4e7", "300": "#d4d4d8", "400": "#a1a1aa", "500": "#71717a", "600": "#52525b", "700": "#3f3f46", "750": "#323238", "800": "#27272a", "850": "#1f1f21", "900": "#18181b", "950": "#101012" } }, "defaultColorScheme": "auto", "storeColorScheme": true, "darkClass": "dark", "logo": { "square": "@histoire/plugin-svelte/assets/histoire-svelte.svg", "light": "@histoire/plugin-svelte/assets/histoire-svelte-text.svg", "dark": "@histoire/plugin-svelte/assets/histoire-svelte-text.svg" } }, "responsivePresets": [{ "label": "Mobile (Small)", "width": 320, "height": 560 }, { "label": "Mobile (Medium)", "width": 360, "height": 640 }, { "label": "Mobile (Large)", "width": 414, "height": 896 }, { "label": "Tablet", "width": 768, "height": 1024 }, { "label": "Laptop (Small)", "width": 1024, "height": null }, { "label": "Laptop (Large)", "width": 1366, "height": null }, { "label": "Desktop", "width": 1920, "height": null }, { "label": "4K", "width": 3840, "height": null }], "backgroundPresets": [{ "label": "Transparent", "color": "transparent", "contrastColor": "#333" }, { "label": "White", "color": "#fff", "contrastColor": "#333" }, { "label": "Light gray", "color": "#aaa", "contrastColor": "#000" }, { "label": "Dark gray", "color": "#333", "contrastColor": "#fff" }, { "label": "Black", "color": "#000", "contrastColor": "#eee" }], "sandboxDarkClass": "dark", "routerMode": "history", "build": { "excludeFromVendorsChunk": [] }, "viteIgnorePlugins": ["vite-plugin-sveltekit-compile"], "setupFile": "/src/histoire.setup.ts" };
|
|
const logos = { square: Logo_square, light: Logo_dark, dark: Logo_dark };
|
|
const histoireConfig = config;
|
|
const customLogos = logos;
|
|
const base = "/";
|
|
function createRouterHistory() {
|
|
switch (histoireConfig.routerMode) {
|
|
case "hash":
|
|
return createWebHashHistory(base);
|
|
case "history":
|
|
default:
|
|
return createWebHistory(base);
|
|
}
|
|
}
|
|
const router = createRouter({
|
|
history: createRouterHistory(),
|
|
routes: [
|
|
{
|
|
path: "/",
|
|
name: "home",
|
|
component: () => __vitePreload(() => import("./HomeView.vue-CcWnFK65.js"), true ? __vite__mapDeps([0,1,2]) : void 0)
|
|
},
|
|
{
|
|
path: "/story/:storyId",
|
|
name: "story",
|
|
component: () => __vitePreload(() => import("./StoryView.vue-BFx-CBXY.js"), true ? __vite__mapDeps([3,2,1,4,5,6]) : void 0)
|
|
}
|
|
]
|
|
});
|
|
const isDark = useDark({
|
|
valueDark: "htw-dark",
|
|
initialValue: histoireConfig.theme.defaultColorScheme,
|
|
storageKey: "histoire-color-scheme",
|
|
storage: histoireConfig.theme.storeColorScheme ? localStorage : sessionStorage
|
|
});
|
|
const toggleDark = useToggle(isDark);
|
|
function applyDarkToControls() {
|
|
var _a;
|
|
(_a = window.__hst_controls_dark) == null ? void 0 : _a.forEach((ref2) => {
|
|
ref2.value = isDark.value;
|
|
});
|
|
}
|
|
watch(isDark, () => {
|
|
applyDarkToControls();
|
|
}, {
|
|
immediate: true
|
|
});
|
|
window.__hst_controls_dark_ready = () => {
|
|
applyDarkToControls();
|
|
};
|
|
const copiedFromExistingVariant = [
|
|
"state",
|
|
"slots",
|
|
"source",
|
|
"responsiveDisabled",
|
|
"autoPropsDisabled",
|
|
"setupApp",
|
|
"configReady",
|
|
"previewReady"
|
|
];
|
|
function mapFile(file2, existingFile) {
|
|
let result;
|
|
if (existingFile) {
|
|
result = existingFile;
|
|
for (const key in file2) {
|
|
if (key === "story") {
|
|
result.story = {
|
|
...result.story,
|
|
...file2.story,
|
|
file: markRaw(result),
|
|
variants: file2.story.variants.map((v) => mapVariant(v, existingFile.story.variants.find((item) => item.id === v.id)))
|
|
};
|
|
} else if (key !== "component") {
|
|
result[key] = file2[key];
|
|
}
|
|
}
|
|
} else {
|
|
result = {
|
|
...file2,
|
|
component: markRaw(file2.component),
|
|
story: {
|
|
...file2.story,
|
|
title: file2.story.title,
|
|
file: markRaw(file2),
|
|
variants: file2.story.variants.map((v) => mapVariant(v)),
|
|
slots: () => ({})
|
|
}
|
|
};
|
|
}
|
|
return result;
|
|
}
|
|
function mapVariant(variant, existingVariant) {
|
|
let result;
|
|
if (existingVariant) {
|
|
result = existingVariant;
|
|
for (const key in variant) {
|
|
if (!copiedFromExistingVariant.includes(key)) {
|
|
result[key] = variant[key];
|
|
}
|
|
}
|
|
} else {
|
|
result = {
|
|
...variant,
|
|
state: reactive({
|
|
_hPropState: {},
|
|
_hPropDefs: {}
|
|
}),
|
|
setupApp: null,
|
|
slots: () => ({}),
|
|
previewReady: false
|
|
};
|
|
}
|
|
return result;
|
|
}
|
|
const clientSupportPlugins = {
|
|
"vanilla": () => __vitePreload(() => import("./vendor-BCKkA27H.js").then((n) => n.b7), true ? [] : void 0),
|
|
"svelte4": () => __vitePreload(() => import("./vendor-BCKkA27H.js").then((n) => n.b8), true ? [] : void 0)
|
|
};
|
|
const __default__ = {
|
|
inheritAttrs: false
|
|
};
|
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
...__default__,
|
|
__name: "GenericMountStory",
|
|
props: {
|
|
story: {}
|
|
},
|
|
setup(__props) {
|
|
const props = __props;
|
|
const mountComponent = ref(null);
|
|
watchEffect(async () => {
|
|
var _a;
|
|
const clientPlugin = clientSupportPlugins[(_a = props.story.file) == null ? void 0 : _a.supportPluginId];
|
|
if (clientPlugin) {
|
|
const pluginModule = await clientPlugin();
|
|
mountComponent.value = markRaw(pluginModule.MountStory);
|
|
}
|
|
});
|
|
return (_ctx, _cache) => {
|
|
return mountComponent.value ? (openBlock(), createBlock(resolveDynamicComponent(mountComponent.value), mergeProps({
|
|
key: 0,
|
|
class: "histoire-generic-mount-story",
|
|
story: _ctx.story
|
|
}, _ctx.$attrs), null, 16, ["story"])) : createCommentVNode("", true);
|
|
};
|
|
}
|
|
});
|
|
export {
|
|
__vitePreload as _,
|
|
tree as a,
|
|
_sfc_main as b,
|
|
customLogos as c,
|
|
clientSupportPlugins as d,
|
|
base as e,
|
|
files as f,
|
|
histoireConfig as h,
|
|
isDark as i,
|
|
mapFile as m,
|
|
router as r,
|
|
toggleDark as t
|
|
};
|