nanosplash 3.0.8 → 3.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/.prettierrc +1 -1
  2. package/README.md +52 -4
  3. package/bun.lockb +0 -0
  4. package/dist/cjs/ns.cjs +1 -2
  5. package/dist/es/ns.js +42 -340
  6. package/dist/iife/ns.iife.js +1 -2
  7. package/docs/.vitepress/.temp/@localSearchIndexroot.Ba2B1gNE.js +4 -0
  8. package/docs/.vitepress/.temp/Card.Ce4dbGEn.js +30 -0
  9. package/docs/.vitepress/.temp/VPLocalSearchBox.DV6bivXX.js +382 -0
  10. package/docs/.vitepress/.temp/api_doc_hide.md.js +25 -0
  11. package/docs/.vitepress/.temp/api_doc_show.md.js +25 -0
  12. package/docs/.vitepress/.temp/api_start_customize.md.js +42 -0
  13. package/docs/.vitepress/.temp/api_start_features.md.js +19 -0
  14. package/docs/.vitepress/.temp/api_start_install.md.js +35 -0
  15. package/docs/.vitepress/.temp/api_start_playground.md.js +213 -0
  16. package/docs/.vitepress/.temp/api_start_usage.md.js +36 -0
  17. package/docs/.vitepress/.temp/app.js +5090 -0
  18. package/docs/.vitepress/.temp/assets/style.lcyfX_uc.css +5374 -0
  19. package/docs/.vitepress/.temp/index.md.js +19 -0
  20. package/docs/.vitepress/.temp/macos.jpg +0 -0
  21. package/docs/.vitepress/.temp/package.json +1 -0
  22. package/docs/.vitepress/.temp/plugin-vue_export-helper.1tPrXgE0.js +10 -0
  23. package/docs/.vitepress/{config.ts → config.mts} +46 -44
  24. package/docs/.vitepress/theme/css/style.css +107 -6
  25. package/docs/.vitepress/theme/vue/CardGrid.vue +1 -1
  26. package/docs/.vitepress/theme/vue/Exe.vue +58 -28
  27. package/docs/.vitepress/theme/vue/PlayGround.vue +5 -21
  28. package/docs/api/doc/hide.md +12 -33
  29. package/docs/api/doc/show.md +12 -13
  30. package/docs/api/start/customize.md +30 -0
  31. package/docs/api/start/features.md +3 -3
  32. package/docs/api/start/install.md +12 -8
  33. package/docs/api/start/playground.md +1 -1
  34. package/docs/api/start/usage.md +4 -7
  35. package/docs/index.md +25 -25
  36. package/docs/public/macos.jpg +0 -0
  37. package/eslint.config.js +9 -0
  38. package/package.json +54 -48
  39. package/src/style/ns.sass +98 -73
  40. package/src/ts/Nanosplash.ts +209 -0
  41. package/src/ts/main.ts +2 -8
  42. package/src/ts/types/NanosplashInterface.ts +26 -0
  43. package/src/ts/types/Types.ts +29 -3
  44. package/src/ts/types/global.d.ts +9 -9
  45. package/tests/Nanosplash.spec.ts +33 -0
  46. package/.prettierignore +0 -1
  47. package/src/ts/core/DomUtilities.ts +0 -161
  48. package/src/ts/core/Service.ts +0 -211
  49. package/src/ts/core/ServiceInterface.ts +0 -58
  50. package/src/ts/core/Splash.ts +0 -121
  51. package/src/ts/core/SplashInterface.ts +0 -46
  52. package/src/ts/core/SplashQueue.ts +0 -49
  53. package/tests/DomUtilities.spec.ts +0 -117
  54. package/tests/Guid.spec.ts +0 -21
  55. package/tests/Service.spec.ts +0 -198
  56. package/tests/Splash.spec.ts +0 -64
  57. package/tests/TestUtilities.ts +0 -48
@@ -0,0 +1,382 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
3
+ var __publicField = (obj, key, value) => {
4
+ __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
5
+ return value;
6
+ };
7
+ import { defineComponent, shallowRef, markRaw, computed, ref, watchEffect, watch, createApp, nextTick, onMounted, onBeforeUnmount, unref, useSSRContext } from "vue";
8
+ import { ssrRenderTeleport, ssrRenderAttr, ssrRenderClass, ssrIncludeBooleanAttr, ssrRenderList, ssrInterpolate } from "vue/server-renderer";
9
+ import { computedAsync, useSessionStorage, useLocalStorage, debouncedWatch, onKeyStroke, useEventListener, useScrollLock } from "@vueuse/core";
10
+ import { useFocusTrap } from "@vueuse/integrations/useFocusTrap";
11
+ import Mark from "mark.js/src/vanilla.js";
12
+ import MiniSearch from "minisearch";
13
+ import { u as useData, d as dataSymbol, p as pathToFile, a as useRouter, c as createSearchTranslate, i as inBrowser, e as escapeRegExp } from "./app.js";
14
+ import { _ as _export_sfc } from "./plugin-vue_export-helper.1tPrXgE0.js";
15
+ const localSearchIndex = { "root": () => import("./@localSearchIndexroot.Ba2B1gNE.js") };
16
+ class LRUCache {
17
+ constructor(max = 10) {
18
+ __publicField(this, "max");
19
+ __publicField(this, "cache");
20
+ this.max = max;
21
+ this.cache = /* @__PURE__ */ new Map();
22
+ }
23
+ get(key) {
24
+ let item = this.cache.get(key);
25
+ if (item !== void 0) {
26
+ this.cache.delete(key);
27
+ this.cache.set(key, item);
28
+ }
29
+ return item;
30
+ }
31
+ set(key, val) {
32
+ if (this.cache.has(key))
33
+ this.cache.delete(key);
34
+ else if (this.cache.size === this.max)
35
+ this.cache.delete(this.first());
36
+ this.cache.set(key, val);
37
+ }
38
+ first() {
39
+ return this.cache.keys().next().value;
40
+ }
41
+ clear() {
42
+ this.cache.clear();
43
+ }
44
+ }
45
+ const _sfc_main = /* @__PURE__ */ defineComponent({
46
+ __name: "VPLocalSearchBox",
47
+ __ssrInlineRender: true,
48
+ emits: ["close"],
49
+ setup(__props, { emit: __emit }) {
50
+ var _a, _b;
51
+ const emit = __emit;
52
+ const el = shallowRef();
53
+ const resultsEl = shallowRef();
54
+ const searchIndexData = shallowRef(localSearchIndex);
55
+ const vitePressData = useData();
56
+ const { activate } = useFocusTrap(el, {
57
+ immediate: true,
58
+ allowOutsideClick: true,
59
+ clickOutsideDeactivates: true,
60
+ escapeDeactivates: true
61
+ });
62
+ const { localeIndex, theme } = vitePressData;
63
+ const searchIndex = computedAsync(
64
+ async () => {
65
+ var _a2, _b2, _c, _d, _e, _f, _g, _h, _i;
66
+ return markRaw(
67
+ MiniSearch.loadJSON(
68
+ (_c = await ((_b2 = (_a2 = searchIndexData.value)[localeIndex.value]) == null ? void 0 : _b2.call(_a2))) == null ? void 0 : _c.default,
69
+ {
70
+ fields: ["title", "titles", "text"],
71
+ storeFields: ["title", "titles"],
72
+ searchOptions: {
73
+ fuzzy: 0.2,
74
+ prefix: true,
75
+ boost: { title: 4, text: 2, titles: 1 },
76
+ ...((_d = theme.value.search) == null ? void 0 : _d.provider) === "local" && ((_f = (_e = theme.value.search.options) == null ? void 0 : _e.miniSearch) == null ? void 0 : _f.searchOptions)
77
+ },
78
+ ...((_g = theme.value.search) == null ? void 0 : _g.provider) === "local" && ((_i = (_h = theme.value.search.options) == null ? void 0 : _h.miniSearch) == null ? void 0 : _i.options)
79
+ }
80
+ )
81
+ );
82
+ }
83
+ );
84
+ const disableQueryPersistence = computed(() => {
85
+ var _a2, _b2;
86
+ return ((_a2 = theme.value.search) == null ? void 0 : _a2.provider) === "local" && ((_b2 = theme.value.search.options) == null ? void 0 : _b2.disableQueryPersistence) === true;
87
+ });
88
+ const filterText = disableQueryPersistence.value ? ref("") : useSessionStorage("vitepress:local-search-filter", "");
89
+ const showDetailedList = useLocalStorage(
90
+ "vitepress:local-search-detailed-list",
91
+ ((_a = theme.value.search) == null ? void 0 : _a.provider) === "local" && ((_b = theme.value.search.options) == null ? void 0 : _b.detailedView) === true
92
+ );
93
+ const disableDetailedView = computed(() => {
94
+ var _a2, _b2, _c;
95
+ return ((_a2 = theme.value.search) == null ? void 0 : _a2.provider) === "local" && (((_b2 = theme.value.search.options) == null ? void 0 : _b2.disableDetailedView) === true || ((_c = theme.value.search.options) == null ? void 0 : _c.detailedView) === false);
96
+ });
97
+ const buttonText = computed(() => {
98
+ var _a2, _b2, _c, _d, _e, _f, _g;
99
+ const options = ((_a2 = theme.value.search) == null ? void 0 : _a2.options) ?? theme.value.algolia;
100
+ return ((_e = (_d = (_c = (_b2 = options == null ? void 0 : options.locales) == null ? void 0 : _b2[localeIndex.value]) == null ? void 0 : _c.translations) == null ? void 0 : _d.button) == null ? void 0 : _e.buttonText) || ((_g = (_f = options == null ? void 0 : options.translations) == null ? void 0 : _f.button) == null ? void 0 : _g.buttonText) || "Search";
101
+ });
102
+ watchEffect(() => {
103
+ if (disableDetailedView.value) {
104
+ showDetailedList.value = false;
105
+ }
106
+ });
107
+ const results = shallowRef([]);
108
+ const enableNoResults = ref(false);
109
+ watch(filterText, () => {
110
+ enableNoResults.value = false;
111
+ });
112
+ const mark = computedAsync(async () => {
113
+ if (!resultsEl.value)
114
+ return;
115
+ return markRaw(new Mark(resultsEl.value));
116
+ }, null);
117
+ const cache = new LRUCache(16);
118
+ debouncedWatch(
119
+ () => [searchIndex.value, filterText.value, showDetailedList.value],
120
+ async ([index, filterTextValue, showDetailedListValue], old, onCleanup) => {
121
+ var _a2, _b2, _c, _d;
122
+ if ((old == null ? void 0 : old[0]) !== index) {
123
+ cache.clear();
124
+ }
125
+ let canceled = false;
126
+ onCleanup(() => {
127
+ canceled = true;
128
+ });
129
+ if (!index)
130
+ return;
131
+ results.value = index.search(filterTextValue).slice(0, 16);
132
+ enableNoResults.value = true;
133
+ const mods = showDetailedListValue ? await Promise.all(results.value.map((r) => fetchExcerpt(r.id))) : [];
134
+ if (canceled)
135
+ return;
136
+ for (const { id, mod } of mods) {
137
+ const mapId = id.slice(0, id.indexOf("#"));
138
+ let map = cache.get(mapId);
139
+ if (map)
140
+ continue;
141
+ map = /* @__PURE__ */ new Map();
142
+ cache.set(mapId, map);
143
+ const comp = mod.default ?? mod;
144
+ if ((comp == null ? void 0 : comp.render) || (comp == null ? void 0 : comp.setup)) {
145
+ const app = createApp(comp);
146
+ app.config.warnHandler = () => {
147
+ };
148
+ app.provide(dataSymbol, vitePressData);
149
+ Object.defineProperties(app.config.globalProperties, {
150
+ $frontmatter: {
151
+ get() {
152
+ return vitePressData.frontmatter.value;
153
+ }
154
+ },
155
+ $params: {
156
+ get() {
157
+ return vitePressData.page.value.params;
158
+ }
159
+ }
160
+ });
161
+ const div = document.createElement("div");
162
+ app.mount(div);
163
+ const headings = div.querySelectorAll("h1, h2, h3, h4, h5, h6");
164
+ headings.forEach((el2) => {
165
+ var _a3;
166
+ const href = (_a3 = el2.querySelector("a")) == null ? void 0 : _a3.getAttribute("href");
167
+ const anchor = (href == null ? void 0 : href.startsWith("#")) && href.slice(1);
168
+ if (!anchor)
169
+ return;
170
+ let html = "";
171
+ while ((el2 = el2.nextElementSibling) && !/^h[1-6]$/i.test(el2.tagName))
172
+ html += el2.outerHTML;
173
+ map.set(anchor, html);
174
+ });
175
+ app.unmount();
176
+ }
177
+ if (canceled)
178
+ return;
179
+ }
180
+ const terms = /* @__PURE__ */ new Set();
181
+ results.value = results.value.map((r) => {
182
+ const [id, anchor] = r.id.split("#");
183
+ const map = cache.get(id);
184
+ const text = (map == null ? void 0 : map.get(anchor)) ?? "";
185
+ for (const term in r.match) {
186
+ terms.add(term);
187
+ }
188
+ return { ...r, text };
189
+ });
190
+ await nextTick();
191
+ if (canceled)
192
+ return;
193
+ await new Promise((r) => {
194
+ var _a3;
195
+ (_a3 = mark.value) == null ? void 0 : _a3.unmark({
196
+ done: () => {
197
+ var _a4;
198
+ (_a4 = mark.value) == null ? void 0 : _a4.markRegExp(formMarkRegex(terms), { done: r });
199
+ }
200
+ });
201
+ });
202
+ const excerpts = ((_a2 = el.value) == null ? void 0 : _a2.querySelectorAll(".result .excerpt")) ?? [];
203
+ for (const excerpt of excerpts) {
204
+ (_b2 = excerpt.querySelector('mark[data-markjs="true"]')) == null ? void 0 : _b2.scrollIntoView({ block: "center" });
205
+ }
206
+ (_d = (_c = resultsEl.value) == null ? void 0 : _c.firstElementChild) == null ? void 0 : _d.scrollIntoView({ block: "start" });
207
+ },
208
+ { debounce: 200, immediate: true }
209
+ );
210
+ async function fetchExcerpt(id) {
211
+ const file = pathToFile(id.slice(0, id.indexOf("#")));
212
+ try {
213
+ if (!file)
214
+ throw new Error(`Cannot find file for id: ${id}`);
215
+ return { id, mod: await import(
216
+ /*@vite-ignore*/
217
+ file
218
+ ) };
219
+ } catch (e) {
220
+ console.error(e);
221
+ return { id, mod: {} };
222
+ }
223
+ }
224
+ const searchInput = ref();
225
+ const disableReset = computed(() => {
226
+ var _a2;
227
+ return ((_a2 = filterText.value) == null ? void 0 : _a2.length) <= 0;
228
+ });
229
+ function focusSearchInput(select = true) {
230
+ var _a2, _b2;
231
+ (_a2 = searchInput.value) == null ? void 0 : _a2.focus();
232
+ select && ((_b2 = searchInput.value) == null ? void 0 : _b2.select());
233
+ }
234
+ onMounted(() => {
235
+ focusSearchInput();
236
+ });
237
+ const selectedIndex = ref(-1);
238
+ const disableMouseOver = ref(false);
239
+ watch(results, (r) => {
240
+ selectedIndex.value = r.length ? 0 : -1;
241
+ scrollToSelectedResult();
242
+ });
243
+ function scrollToSelectedResult() {
244
+ nextTick(() => {
245
+ const selectedEl = document.querySelector(".result.selected");
246
+ if (selectedEl) {
247
+ selectedEl.scrollIntoView({
248
+ block: "nearest"
249
+ });
250
+ }
251
+ });
252
+ }
253
+ onKeyStroke("ArrowUp", (event) => {
254
+ event.preventDefault();
255
+ selectedIndex.value--;
256
+ if (selectedIndex.value < 0) {
257
+ selectedIndex.value = results.value.length - 1;
258
+ }
259
+ disableMouseOver.value = true;
260
+ scrollToSelectedResult();
261
+ });
262
+ onKeyStroke("ArrowDown", (event) => {
263
+ event.preventDefault();
264
+ selectedIndex.value++;
265
+ if (selectedIndex.value >= results.value.length) {
266
+ selectedIndex.value = 0;
267
+ }
268
+ disableMouseOver.value = true;
269
+ scrollToSelectedResult();
270
+ });
271
+ const router = useRouter();
272
+ onKeyStroke("Enter", (e) => {
273
+ if (e.isComposing)
274
+ return;
275
+ if (e.target instanceof HTMLButtonElement && e.target.type !== "submit")
276
+ return;
277
+ const selectedPackage = results.value[selectedIndex.value];
278
+ if (e.target instanceof HTMLInputElement && !selectedPackage) {
279
+ e.preventDefault();
280
+ return;
281
+ }
282
+ if (selectedPackage) {
283
+ router.go(selectedPackage.id);
284
+ emit("close");
285
+ }
286
+ });
287
+ onKeyStroke("Escape", () => {
288
+ emit("close");
289
+ });
290
+ const defaultTranslations = {
291
+ modal: {
292
+ displayDetails: "Display detailed list",
293
+ resetButtonTitle: "Reset search",
294
+ backButtonTitle: "Close search",
295
+ noResultsText: "No results for",
296
+ footer: {
297
+ selectText: "to select",
298
+ selectKeyAriaLabel: "enter",
299
+ navigateText: "to navigate",
300
+ navigateUpKeyAriaLabel: "up arrow",
301
+ navigateDownKeyAriaLabel: "down arrow",
302
+ closeText: "to close",
303
+ closeKeyAriaLabel: "escape"
304
+ }
305
+ }
306
+ };
307
+ const translate = createSearchTranslate(defaultTranslations);
308
+ onMounted(() => {
309
+ window.history.pushState(null, "", null);
310
+ });
311
+ useEventListener("popstate", (event) => {
312
+ event.preventDefault();
313
+ emit("close");
314
+ });
315
+ const isLocked = useScrollLock(inBrowser ? document.body : null);
316
+ onMounted(() => {
317
+ nextTick(() => {
318
+ isLocked.value = true;
319
+ nextTick().then(() => activate());
320
+ });
321
+ });
322
+ onBeforeUnmount(() => {
323
+ isLocked.value = false;
324
+ });
325
+ function formMarkRegex(terms) {
326
+ return new RegExp(
327
+ [...terms].sort((a, b) => b.length - a.length).map((term) => `(${escapeRegExp(term)})`).join("|"),
328
+ "gi"
329
+ );
330
+ }
331
+ return (_ctx, _push, _parent, _attrs) => {
332
+ ssrRenderTeleport(_push, (_push2) => {
333
+ var _a2, _b2, _c, _d;
334
+ _push2(`<div role="button"${ssrRenderAttr("aria-owns", ((_a2 = results.value) == null ? void 0 : _a2.length) ? "localsearch-list" : void 0)} aria-expanded="true" aria-haspopup="listbox" aria-labelledby="localsearch-label" class="VPLocalSearchBox" data-v-43c4f204><div class="backdrop" data-v-43c4f204></div><div class="shell" data-v-43c4f204><form class="search-bar" data-v-43c4f204><label${ssrRenderAttr("title", buttonText.value)} id="localsearch-label" for="localsearch-input" data-v-43c4f204><span aria-hidden="true" class="vpi-search search-icon local-search-icon" data-v-43c4f204></span></label><div class="search-actions before" data-v-43c4f204><button class="back-button"${ssrRenderAttr("title", unref(translate)("modal.backButtonTitle"))} data-v-43c4f204><span class="vpi-arrow-left local-search-icon" data-v-43c4f204></span></button></div><input${ssrRenderAttr("value", unref(filterText))}${ssrRenderAttr("placeholder", buttonText.value)} id="localsearch-input" aria-labelledby="localsearch-label" class="search-input" data-v-43c4f204><div class="search-actions" data-v-43c4f204>`);
335
+ if (!disableDetailedView.value) {
336
+ _push2(`<button type="button" class="${ssrRenderClass([{ "detailed-list": unref(showDetailedList) }, "toggle-layout-button"])}"${ssrRenderAttr("title", unref(translate)("modal.displayDetails"))} data-v-43c4f204><span class="vpi-layout-list local-search-icon" data-v-43c4f204></span></button>`);
337
+ } else {
338
+ _push2(`<!---->`);
339
+ }
340
+ _push2(`<button class="clear-button" type="reset"${ssrIncludeBooleanAttr(disableReset.value) ? " disabled" : ""}${ssrRenderAttr("title", unref(translate)("modal.resetButtonTitle"))} data-v-43c4f204><span class="vpi-delete local-search-icon" data-v-43c4f204></span></button></div></form><ul${ssrRenderAttr("id", ((_b2 = results.value) == null ? void 0 : _b2.length) ? "localsearch-list" : void 0)}${ssrRenderAttr("role", ((_c = results.value) == null ? void 0 : _c.length) ? "listbox" : void 0)}${ssrRenderAttr("aria-labelledby", ((_d = results.value) == null ? void 0 : _d.length) ? "localsearch-label" : void 0)} class="results" data-v-43c4f204><!--[-->`);
341
+ ssrRenderList(results.value, (p, index) => {
342
+ _push2(`<li role="option"${ssrRenderAttr("aria-selected", selectedIndex.value === index ? "true" : "false")} data-v-43c4f204><a${ssrRenderAttr("href", p.id)} class="${ssrRenderClass([{
343
+ selected: selectedIndex.value === index
344
+ }, "result"])}"${ssrRenderAttr("aria-label", [...p.titles, p.title].join(" > "))} data-v-43c4f204><div data-v-43c4f204><div class="titles" data-v-43c4f204><span class="title-icon" data-v-43c4f204>#</span><!--[-->`);
345
+ ssrRenderList(p.titles, (t, index2) => {
346
+ _push2(`<span class="title" data-v-43c4f204><span class="text" data-v-43c4f204>${t}</span><span class="vpi-chevron-right local-search-icon" data-v-43c4f204></span></span>`);
347
+ });
348
+ _push2(`<!--]--><span class="title main" data-v-43c4f204><span class="text" data-v-43c4f204>${p.title}</span></span></div>`);
349
+ if (unref(showDetailedList)) {
350
+ _push2(`<div class="excerpt-wrapper" data-v-43c4f204>`);
351
+ if (p.text) {
352
+ _push2(`<div class="excerpt" inert data-v-43c4f204><div class="vp-doc" data-v-43c4f204>${p.text}</div></div>`);
353
+ } else {
354
+ _push2(`<!---->`);
355
+ }
356
+ _push2(`<div class="excerpt-gradient-bottom" data-v-43c4f204></div><div class="excerpt-gradient-top" data-v-43c4f204></div></div>`);
357
+ } else {
358
+ _push2(`<!---->`);
359
+ }
360
+ _push2(`</div></a></li>`);
361
+ });
362
+ _push2(`<!--]-->`);
363
+ if (unref(filterText) && !results.value.length && enableNoResults.value) {
364
+ _push2(`<li class="no-results" data-v-43c4f204>${ssrInterpolate(unref(translate)("modal.noResultsText"))} &quot;<strong data-v-43c4f204>${ssrInterpolate(unref(filterText))}</strong>&quot; </li>`);
365
+ } else {
366
+ _push2(`<!---->`);
367
+ }
368
+ _push2(`</ul><div class="search-keyboard-shortcuts" data-v-43c4f204><span data-v-43c4f204><kbd${ssrRenderAttr("aria-label", unref(translate)("modal.footer.navigateUpKeyAriaLabel"))} data-v-43c4f204><span class="vpi-arrow-up navigate-icon" data-v-43c4f204></span></kbd><kbd${ssrRenderAttr("aria-label", unref(translate)("modal.footer.navigateDownKeyAriaLabel"))} data-v-43c4f204><span class="vpi-arrow-down navigate-icon" data-v-43c4f204></span></kbd> ${ssrInterpolate(unref(translate)("modal.footer.navigateText"))}</span><span data-v-43c4f204><kbd${ssrRenderAttr("aria-label", unref(translate)("modal.footer.selectKeyAriaLabel"))} data-v-43c4f204><span class="vpi-corner-down-left navigate-icon" data-v-43c4f204></span></kbd> ${ssrInterpolate(unref(translate)("modal.footer.selectText"))}</span><span data-v-43c4f204><kbd${ssrRenderAttr("aria-label", unref(translate)("modal.footer.closeKeyAriaLabel"))} data-v-43c4f204>esc</kbd> ${ssrInterpolate(unref(translate)("modal.footer.closeText"))}</span></div></div></div>`);
369
+ }, "body", false, _parent);
370
+ };
371
+ }
372
+ });
373
+ const _sfc_setup = _sfc_main.setup;
374
+ _sfc_main.setup = (props, ctx) => {
375
+ const ssrContext = useSSRContext();
376
+ (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("../node_modules/vitepress/dist/client/theme-default/components/VPLocalSearchBox.vue");
377
+ return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
378
+ };
379
+ const VPLocalSearchBox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-43c4f204"]]);
380
+ export {
381
+ VPLocalSearchBox as default
382
+ };
@@ -0,0 +1,25 @@
1
+ import { ssrRenderAttrs, ssrRenderStyle } from "vue/server-renderer";
2
+ import { useSSRContext } from "vue";
3
+ import { _ as _export_sfc } from "./plugin-vue_export-helper.1tPrXgE0.js";
4
+ const __pageData = JSON.parse('{"title":"Hide Nanosplash","description":"","frontmatter":{},"headers":[],"relativePath":"api/doc/hide.md","filePath":"api/doc/hide.md"}');
5
+ const _sfc_main = { name: "api/doc/hide.md" };
6
+ function _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
7
+ _push(`<div${ssrRenderAttrs(_attrs)}><h1 id="hide-nanosplash" tabindex="-1">Hide Nanosplash <a class="header-anchor" href="#hide-nanosplash" aria-label="Permalink to &quot;Hide Nanosplash&quot;">​</a></h1><h2 id="hide" tabindex="-1">Hide <a class="header-anchor" href="#hide" aria-label="Permalink to &quot;Hide&quot;">​</a></h2><p>Hides the oldest Nanosplash (FIFO).</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">hide</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(): </span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">void</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}">&#39;a&#39;</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">)</span></span>
8
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}">&#39;b&#39;</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">)</span></span>
9
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}">&#39;c&#39;</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">)</span></span>
10
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">hide</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">() </span><span style="${ssrRenderStyle({ "--shiki-light": "#6A737D", "--shiki-dark": "#6A737D" })}">// Hides &#39;a&#39;</span></span>
11
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">hide</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">() </span><span style="${ssrRenderStyle({ "--shiki-light": "#6A737D", "--shiki-dark": "#6A737D" })}">// Hides &#39;b&#39;</span></span>
12
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">hide</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">() </span><span style="${ssrRenderStyle({ "--shiki-light": "#6A737D", "--shiki-dark": "#6A737D" })}">// Hides &#39;c&#39;</span></span></code></pre></div><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>If you have multiple Nanosplashes open at the same time, I would recommend that you hide specific elements based on their ID. See <a href="#hide-by-id">Hide by ID</a> for more information.</p></div><h2 id="hide-by-id" tabindex="-1">Hide by ID <a class="header-anchor" href="#hide-by-id" aria-label="Permalink to &quot;Hide by ID&quot;">​</a></h2><p>Hides a Nanosplash by its ID.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">hide</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(id: number): number </span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">|</span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> null</span></span></code></pre></div><p>The show method returns the Nanosplash ID. This identifier can be used to hide a specific Nanosplash at a later time.</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">const</span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> id</span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}"> =</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}">&#39;Loading&#39;</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">)</span></span>
13
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">hide</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(id)</span></span></code></pre></div><h2 id="hide-all" tabindex="-1">Hide all <a class="header-anchor" href="#hide-all" aria-label="Permalink to &quot;Hide all&quot;">​</a></h2><p>Hides all Nanosplashes in the <code>window</code>.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">hide</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}">&#39;*&#39;</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">): </span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">void</span></span></code></pre></div></div>`);
14
+ }
15
+ const _sfc_setup = _sfc_main.setup;
16
+ _sfc_main.setup = (props, ctx) => {
17
+ const ssrContext = useSSRContext();
18
+ (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("api/doc/hide.md");
19
+ return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
20
+ };
21
+ const hide = /* @__PURE__ */ _export_sfc(_sfc_main, [["ssrRender", _sfc_ssrRender]]);
22
+ export {
23
+ __pageData,
24
+ hide as default
25
+ };
@@ -0,0 +1,25 @@
1
+ import { ssrRenderAttrs, ssrRenderStyle } from "vue/server-renderer";
2
+ import { useSSRContext } from "vue";
3
+ import { _ as _export_sfc } from "./plugin-vue_export-helper.1tPrXgE0.js";
4
+ const __pageData = JSON.parse('{"title":"Show Nanosplash","description":"","frontmatter":{},"headers":[],"relativePath":"api/doc/show.md","filePath":"api/doc/show.md"}');
5
+ const _sfc_main = { name: "api/doc/show.md" };
6
+ function _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
7
+ _push(`<div${ssrRenderAttrs(_attrs)}><h1 id="show-nanosplash" tabindex="-1">Show Nanosplash <a class="header-anchor" href="#show-nanosplash" aria-label="Permalink to &quot;Show Nanosplash&quot;">​</a></h1><h2 id="show" tabindex="-1">Show <a class="header-anchor" href="#show" aria-label="Permalink to &quot;Show&quot;">​</a></h2><p>This function display NS in fullscreen and returns the internal ID.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(text</span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">?:</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> string): number</span></span></code></pre></div><p>If you enter no text, it will display the spinning wheel only.</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(): number</span></span></code></pre></div><p>If you enter text, it will display the spinning wheel adjacent to the text.</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}">&#39;Loading&#39;</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">): number</span></span></code></pre></div><h2 id="show-inside" tabindex="-1">Show inside <a class="header-anchor" href="#show-inside" aria-label="Permalink to &quot;Show inside&quot;">​</a></h2><p>This function display NS inside another element and returns the internal ID, or <code>null</code> if the reference argument does not match any node inside the DOM.</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(text</span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">?:</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> string, ref</span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">?:</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> Element </span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">|</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> string): number </span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">|</span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> null</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6A737D", "--shiki-dark": "#6A737D" })}">// DOM selector</span></span>
8
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">const</span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> selector</span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">:</span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> string</span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}"> =</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}"> &#39;#my-table&#39;</span></span>
9
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}">&#39;Loading&#39;</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">, selector)</span></span>
10
+ <span class="line"></span>
11
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6A737D", "--shiki-dark": "#6A737D" })}">// Element</span></span>
12
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">const</span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> element</span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}">:</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}"> HTMLElement</span><span style="${ssrRenderStyle({ "--shiki-light": "#D73A49", "--shiki-dark": "#F97583" })}"> =</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> document.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">getElementById</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}">&#39;my-table&#39;</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">)</span></span>
13
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">ns.</span><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">show</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#032F62", "--shiki-dark": "#9ECBFF" })}">&#39;Loading&#39;</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">, element)</span></span></code></pre></div><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>A host element can only contain one Nanosplash element at a time. If you try to show a splash inside an element that already contains a splash, the existing splash will be overwritten.</p></div></div>`);
14
+ }
15
+ const _sfc_setup = _sfc_main.setup;
16
+ _sfc_main.setup = (props, ctx) => {
17
+ const ssrContext = useSSRContext();
18
+ (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("api/doc/show.md");
19
+ return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
20
+ };
21
+ const show = /* @__PURE__ */ _export_sfc(_sfc_main, [["ssrRender", _sfc_ssrRender]]);
22
+ export {
23
+ __pageData,
24
+ show as default
25
+ };
@@ -0,0 +1,42 @@
1
+ import { ssrRenderAttrs, ssrRenderStyle } from "vue/server-renderer";
2
+ import { useSSRContext } from "vue";
3
+ import { _ as _export_sfc } from "./plugin-vue_export-helper.1tPrXgE0.js";
4
+ const __pageData = JSON.parse('{"title":"Customize","description":"","frontmatter":{},"headers":[],"relativePath":"api/start/customize.md","filePath":"api/start/customize.md"}');
5
+ const _sfc_main = { name: "api/start/customize.md" };
6
+ function _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
7
+ _push(`<div${ssrRenderAttrs(_attrs)}><h1 id="customize" tabindex="-1">Customize <a class="header-anchor" href="#customize" aria-label="Permalink to &quot;Customize&quot;">​</a></h1><p>Stying Nanosplash to your needs is easy!</p><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki shiki-themes github-light github-dark vp-code"><code><span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6A737D", "--shiki-dark": "#6A737D" })}">/* Backdrop */</span></span>
8
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">.nsh::before</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> {</span></span>
9
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> background-color</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">: </span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}">var</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#E36209", "--shiki-dark": "#FFAB70" })}">--your-bg</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">);</span></span>
10
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> backdrop-filter</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">: </span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}">var</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#E36209", "--shiki-dark": "#FFAB70" })}">--your-filter</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">);</span></span>
11
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">}</span></span>
12
+ <span class="line"></span>
13
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6A737D", "--shiki-dark": "#6A737D" })}">/* Main */</span></span>
14
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">.ns</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> {</span></span>
15
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> gap</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">: </span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}">var</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#E36209", "--shiki-dark": "#FFAB70" })}">--text-spinner-gap</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">);</span></span>
16
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">}</span></span>
17
+ <span class="line"></span>
18
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6A737D", "--shiki-dark": "#6A737D" })}">/* Text */</span></span>
19
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">.nst</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> {</span></span>
20
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> color</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">: </span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}">var</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#E36209", "--shiki-dark": "#FFAB70" })}">--color</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">);</span></span>
21
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> font-size</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">: </span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}">var</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#E36209", "--shiki-dark": "#FFAB70" })}">--size</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">);</span></span>
22
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> font-family</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">: </span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}">var</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#E36209", "--shiki-dark": "#FFAB70" })}">--font</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">);</span></span>
23
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> font-weight</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">: </span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}">var</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#E36209", "--shiki-dark": "#FFAB70" })}">--weight</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">);</span></span>
24
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">}</span></span>
25
+ <span class="line"></span>
26
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6A737D", "--shiki-dark": "#6A737D" })}">/* Spinner */</span></span>
27
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#6F42C1", "--shiki-dark": "#B392F0" })}">.nss</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}"> {</span></span>
28
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> width</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">: </span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}">var</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#E36209", "--shiki-dark": "#FFAB70" })}">--spinner-width</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">);</span></span>
29
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}"> height</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">: </span><span style="${ssrRenderStyle({ "--shiki-light": "#005CC5", "--shiki-dark": "#79B8FF" })}">var</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">(</span><span style="${ssrRenderStyle({ "--shiki-light": "#E36209", "--shiki-dark": "#FFAB70" })}">--spinner-height</span><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">);</span></span>
30
+ <span class="line"><span style="${ssrRenderStyle({ "--shiki-light": "#24292E", "--shiki-dark": "#E1E4E8" })}">}</span></span></code></pre></div></div>`);
31
+ }
32
+ const _sfc_setup = _sfc_main.setup;
33
+ _sfc_main.setup = (props, ctx) => {
34
+ const ssrContext = useSSRContext();
35
+ (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("api/start/customize.md");
36
+ return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
37
+ };
38
+ const customize = /* @__PURE__ */ _export_sfc(_sfc_main, [["ssrRender", _sfc_ssrRender]]);
39
+ export {
40
+ __pageData,
41
+ customize as default
42
+ };
@@ -0,0 +1,19 @@
1
+ import { ssrRenderAttrs } from "vue/server-renderer";
2
+ import { useSSRContext } from "vue";
3
+ import { _ as _export_sfc } from "./plugin-vue_export-helper.1tPrXgE0.js";
4
+ const __pageData = JSON.parse('{"title":"Features","description":"","frontmatter":{},"headers":[],"relativePath":"api/start/features.md","filePath":"api/start/features.md"}');
5
+ const _sfc_main = { name: "api/start/features.md" };
6
+ function _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
7
+ _push(`<div${ssrRenderAttrs(_attrs)}><h1 id="features" tabindex="-1">Features <a class="header-anchor" href="#features" aria-label="Permalink to &quot;Features&quot;">​</a></h1><h2 id="small-bundle-size" tabindex="-1">Small bundle size <a class="header-anchor" href="#small-bundle-size" aria-label="Permalink to &quot;Small bundle size&quot;">​</a></h2><p>The Nanosplash bundle is less than 2KB minified and gzipped and will not add any significant weight to your application what so ever. Go to <a href="https://bundlephobia.com/package/nanosplash" target="_blank" rel="noreferrer">Bundlephobia</a> to see for yourself.</p><h2 id="simple-2-function-api" tabindex="-1">Simple, 2 Function API <a class="header-anchor" href="#simple-2-function-api" aria-label="Permalink to &quot;Simple, 2 Function API&quot;">​</a></h2><p>Nanosplash was written from the ground up with simplicity in mind. The API is very simple and easy to use, and you can easily get started in seconds. Just install the package and start using <code>ns.show</code> and <code>ns.hide</code>. Go to <a href="/nanosplash/api/start/install.html">Getting started</a> to see how.</p><h2 id="spawning" tabindex="-1">Spawning <a class="header-anchor" href="#spawning" aria-label="Permalink to &quot;Spawning&quot;">​</a></h2><p>With Nanosplash you can spawn a splash element anywhere in your DOM. You can even spawn multiple splash elements if you want to. Go to the <a href="/nanosplash/api/doc/show.html#show-inside">API Documentation</a> to see how.</p><h2 id="node-recycling" tabindex="-1">Node recycling <a class="header-anchor" href="#node-recycling" aria-label="Permalink to &quot;Node recycling&quot;">​</a></h2><p>Instead of creating new elements all the time and exhausting DOM manipulations, we recycle and repurpose obsolete splash elements instead. For each time a splash element is created, we check for existing splash elements inside the parent element and use them instead of creating new ones.</p></div>`);
8
+ }
9
+ const _sfc_setup = _sfc_main.setup;
10
+ _sfc_main.setup = (props, ctx) => {
11
+ const ssrContext = useSSRContext();
12
+ (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("api/start/features.md");
13
+ return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
14
+ };
15
+ const features = /* @__PURE__ */ _export_sfc(_sfc_main, [["ssrRender", _sfc_ssrRender]]);
16
+ export {
17
+ __pageData,
18
+ features as default
19
+ };