veilkit 0.0.0-stage → 0.2.1
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.
- package/CHANGELOG.md +54 -0
- package/LICENSE +21 -0
- package/README.md +801 -2
- package/dist/angular/index.cjs +660 -0
- package/dist/angular/index.cjs.map +1 -0
- package/dist/angular/index.d.cts +113 -0
- package/dist/angular/index.d.ts +113 -0
- package/dist/angular/index.js +660 -0
- package/dist/angular/index.js.map +1 -0
- package/dist/cli/index.cjs +25 -0
- package/dist/cli/index.cjs.map +1 -0
- package/dist/cli/index.d.cts +1 -0
- package/dist/cli/index.d.ts +1 -0
- package/dist/cli/index.js +25 -0
- package/dist/cli/index.js.map +1 -0
- package/dist/controller-B6kFsWzi.d.cts +195 -0
- package/dist/controller-Ceub9kLC.d.ts +195 -0
- package/dist/element/index.cjs +660 -0
- package/dist/element/index.cjs.map +1 -0
- package/dist/element/index.d.cts +48 -0
- package/dist/element/index.d.ts +48 -0
- package/dist/element/index.js +660 -0
- package/dist/element/index.js.map +1 -0
- package/dist/index.cjs +660 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +211 -0
- package/dist/index.d.ts +211 -0
- package/dist/index.js +660 -0
- package/dist/index.js.map +1 -0
- package/dist/native/index.cjs +2 -0
- package/dist/native/index.cjs.map +1 -0
- package/dist/native/index.d.cts +54 -0
- package/dist/native/index.d.ts +54 -0
- package/dist/native/index.js +2 -0
- package/dist/native/index.js.map +1 -0
- package/dist/react/index.cjs +660 -0
- package/dist/react/index.cjs.map +1 -0
- package/dist/react/index.d.cts +121 -0
- package/dist/react/index.d.ts +121 -0
- package/dist/react/index.js +660 -0
- package/dist/react/index.js.map +1 -0
- package/dist/styles.css +509 -0
- package/dist/svelte/index.cjs +660 -0
- package/dist/svelte/index.cjs.map +1 -0
- package/dist/svelte/index.d.cts +48 -0
- package/dist/svelte/index.d.ts +48 -0
- package/dist/svelte/index.js +660 -0
- package/dist/svelte/index.js.map +1 -0
- package/dist/themes/index.cjs +2 -0
- package/dist/themes/index.cjs.map +1 -0
- package/dist/themes/index.d.cts +18 -0
- package/dist/themes/index.d.ts +18 -0
- package/dist/themes/index.js +2 -0
- package/dist/themes/index.js.map +1 -0
- package/dist/types-CnR-rU97.d.cts +176 -0
- package/dist/types-CnR-rU97.d.ts +176 -0
- package/dist/veilkit.min.js +659 -0
- package/dist/vue/index.cjs +660 -0
- package/dist/vue/index.cjs.map +1 -0
- package/dist/vue/index.d.cts +512 -0
- package/dist/vue/index.d.ts +512 -0
- package/dist/vue/index.js +660 -0
- package/dist/vue/index.js.map +1 -0
- package/package.json +254 -4
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
'use strict';var S=require('fs'),L=require('path');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var S__default=/*#__PURE__*/_interopDefault(S);var L__default=/*#__PURE__*/_interopDefault(L);async function M(){let t=process.argv.slice(2),r=t[0];(!r||r==="--help"||r==="-h")&&(console.log(`
|
|
3
|
+
Veilkit CLI - Zero-Runtime Static Skeleton Capture
|
|
4
|
+
|
|
5
|
+
Usage:
|
|
6
|
+
npx veilkit capture <url> [options]
|
|
7
|
+
|
|
8
|
+
Options:
|
|
9
|
+
--out <file> Output file path (default: .veil.json)
|
|
10
|
+
--selector <sel> Target container CSS selector (default: body)
|
|
11
|
+
--width <px> Browser viewport width (default: 1280)
|
|
12
|
+
--height <px> Browser viewport height (default: 800)
|
|
13
|
+
--help, -h Show this help message
|
|
14
|
+
|
|
15
|
+
Example:
|
|
16
|
+
npx veilkit capture https://example.com/dashboard --out ./dashboard.veil.json
|
|
17
|
+
`),process.exit(0)),r!=="capture"&&(console.error(`Unknown command: "${r}". Try "npx veilkit capture --help"`),process.exit(1));let n=t[1];(!n||n.startsWith("--"))&&(console.error("Error: Please provide a URL to capture. Example: npx veilkit capture https://myapp.com"),process.exit(1));let p=".veil.json",l="body",d=1280,u=800;for(let e=2;e<t.length;e++)t[e]==="--out"&&t[e+1]?p=t[++e]:t[e]==="--selector"&&t[e+1]?l=t[++e]:t[e]==="--width"&&t[e+1]?d=parseInt(t[++e],10):t[e]==="--height"&&t[e+1]&&(u=parseInt(t[++e],10));console.log(`
|
|
18
|
+
\u{1F578}\uFE0F Veilkit Capture: Launching browser for ${n}...`);let g;try{g=await import('playwright');}catch{console.error(`
|
|
19
|
+
[Veilkit CLI] Playwright is required for headless layout capture.
|
|
20
|
+
Please run:
|
|
21
|
+
pnpm add -D playwright
|
|
22
|
+
and try again.
|
|
23
|
+
`),process.exit(1);}try{let e=await g.chromium.launch({headless:!0}),w=await e.newPage({viewport:{width:d,height:u}});console.log(`Navigating to ${n}...`),await w.goto(n,{waitUntil:"networkidle"}),console.log(`Analyzing leaf layouts on "${l}"...`);let f=await w.evaluate(b=>{let c=document.querySelector(b)||document.body,a=c.getBoundingClientRect(),y=[];function v(i){if(i.hasAttribute("data-veil-ignore"))return;let s=window.getComputedStyle(i);if(s.display==="none"||s.visibility==="hidden"||s.opacity==="0")return;let x=i.tagName.toLowerCase(),k=["img","svg","button","input"].includes(x)||Array.from(i.childNodes).some(o=>o.nodeType===Node.TEXT_NODE&&(o.textContent||"").trim().length>0)&&i.children.length===0;if(i!==c&&k){let o=i.getBoundingClientRect();if(o.width>2&&o.height>2){let h=s.borderRadius||"6px",C=h==="50%"||parseFloat(h)>=o.width/2?"circle":["p","span","h1","h2","h3"].includes(x)?"line":"rect";y.push({x:Math.round(o.left-a.left),y:Math.round(o.top-a.top),width:Math.round(o.width),height:Math.round(o.height),radius:h,shape:C});}return}for(let o of Array.from(i.children))v(o);}return v(c),{url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},container:{width:Math.round(a.width),height:Math.round(a.height)},boxes:y}},l);await e.close();let m=L__default.default.resolve(process.cwd(),p);S__default.default.writeFileSync(m,JSON.stringify(f,null,2),"utf8"),console.log(`\u2713 Successfully captured ${f.boxes.length} layout elements!`),console.log(`\u{1F4C1} Saved layout map to: ${m}
|
|
24
|
+
`);}catch(e){console.error("[Veilkit CLI] Capture failed:",e.message),process.exit(1);}}M();//# sourceMappingURL=index.cjs.map
|
|
25
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/cli/index.ts"],"names":["run","args","command","targetUrl","outFile","selector","width","height","i","playwright","browser","page","layout","targetSelector","container","cRect","boxes","walk","el","style","tag","isLeaf","n","r","rad","shape","child","resolvedPath","path","fs","err"],"mappings":"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","file":"index.cjs","sourcesContent":["#!/usr/bin/env node\n\n/**\n * Veilkit CLI\n * `npx veilkit capture <url> [--out .veil.json] [--selector \"#app\"]`\n * Records real DOM layouts with Playwright into static .veil.json files for zero-runtime measurement\n */\n\nimport fs from 'node:fs';\nimport path from 'node:path';\n\nasync function run() {\n const args = process.argv.slice(2);\n const command = args[0];\n\n if (!command || command === '--help' || command === '-h') {\n console.log(`\nVeilkit CLI - Zero-Runtime Static Skeleton Capture\n\nUsage:\n npx veilkit capture <url> [options]\n\nOptions:\n --out <file> Output file path (default: .veil.json)\n --selector <sel> Target container CSS selector (default: body)\n --width <px> Browser viewport width (default: 1280)\n --height <px> Browser viewport height (default: 800)\n --help, -h Show this help message\n\nExample:\n npx veilkit capture https://example.com/dashboard --out ./dashboard.veil.json\n`);\n process.exit(0);\n }\n\n if (command !== 'capture') {\n console.error(`Unknown command: \"${command}\". Try \"npx veilkit capture --help\"`);\n process.exit(1);\n }\n\n const targetUrl = args[1];\n if (!targetUrl || targetUrl.startsWith('--')) {\n console.error('Error: Please provide a URL to capture. Example: npx veilkit capture https://myapp.com');\n process.exit(1);\n }\n\n let outFile = '.veil.json';\n let selector = 'body';\n let width = 1280;\n let height = 800;\n\n for (let i = 2; i < args.length; i++) {\n if (args[i] === '--out' && args[i + 1]) {\n outFile = args[++i]!;\n } else if (args[i] === '--selector' && args[i + 1]) {\n selector = args[++i]!;\n } else if (args[i] === '--width' && args[i + 1]) {\n width = parseInt(args[++i]!, 10);\n } else if (args[i] === '--height' && args[i + 1]) {\n height = parseInt(args[++i]!, 10);\n }\n }\n\n console.log(`\\n🕸️ Veilkit Capture: Launching browser for ${targetUrl}...`);\n\n let playwright: any;\n try {\n const pkgName = 'playwright';\n playwright = await import(/* @vite-ignore */ pkgName);\n } catch {\n console.error(`\n[Veilkit CLI] Playwright is required for headless layout capture.\nPlease run:\n pnpm add -D playwright\nand try again.\n`);\n process.exit(1);\n }\n\n try {\n const browser = await playwright.chromium.launch({ headless: true });\n const page = await browser.newPage({ viewport: { width, height } });\n\n console.log(`Navigating to ${targetUrl}...`);\n await page.goto(targetUrl, { waitUntil: 'networkidle' });\n\n console.log(`Analyzing leaf layouts on \"${selector}\"...`);\n const layout = await page.evaluate((targetSelector: string) => {\n const container = document.querySelector(targetSelector) || document.body;\n const cRect = container.getBoundingClientRect();\n const boxes: any[] = [];\n\n function walk(el: HTMLElement) {\n if (el.hasAttribute('data-veil-ignore')) return;\n const style = window.getComputedStyle(el);\n if (style.display === 'none' || style.visibility === 'hidden' || style.opacity === '0') return;\n\n const tag = el.tagName.toLowerCase();\n const isLeaf = ['img', 'svg', 'button', 'input'].includes(tag) ||\n (Array.from(el.childNodes).some((n) => n.nodeType === Node.TEXT_NODE && (n.textContent || '').trim().length > 0) && el.children.length === 0);\n\n if (el !== container && isLeaf) {\n const r = el.getBoundingClientRect();\n if (r.width > 2 && r.height > 2) {\n const rad = style.borderRadius || '6px';\n const shape = (rad === '50%' || parseFloat(rad) >= r.width / 2) ? 'circle' : (['p', 'span', 'h1', 'h2', 'h3'].includes(tag) ? 'line' : 'rect');\n boxes.push({\n x: Math.round(r.left - cRect.left),\n y: Math.round(r.top - cRect.top),\n width: Math.round(r.width),\n height: Math.round(r.height),\n radius: rad,\n shape,\n });\n }\n return;\n }\n\n for (const child of Array.from(el.children)) {\n walk(child as HTMLElement);\n }\n }\n\n walk(container as HTMLElement);\n\n return {\n url: window.location.href,\n viewport: { width: window.innerWidth, height: window.innerHeight },\n container: { width: Math.round(cRect.width), height: Math.round(cRect.height) },\n boxes,\n };\n }, selector);\n\n await browser.close();\n\n const resolvedPath = path.resolve(process.cwd(), outFile);\n fs.writeFileSync(resolvedPath, JSON.stringify(layout, null, 2), 'utf8');\n\n console.log(`✓ Successfully captured ${layout.boxes.length} layout elements!`);\n console.log(`📁 Saved layout map to: ${resolvedPath}\\n`);\n } catch (err: any) {\n console.error(`[Veilkit CLI] Capture failed:`, err.message);\n process.exit(1);\n }\n}\n\nrun();\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
import S from'fs';import L from'path';async function M(){let t=process.argv.slice(2),r=t[0];(!r||r==="--help"||r==="-h")&&(console.log(`
|
|
3
|
+
Veilkit CLI - Zero-Runtime Static Skeleton Capture
|
|
4
|
+
|
|
5
|
+
Usage:
|
|
6
|
+
npx veilkit capture <url> [options]
|
|
7
|
+
|
|
8
|
+
Options:
|
|
9
|
+
--out <file> Output file path (default: .veil.json)
|
|
10
|
+
--selector <sel> Target container CSS selector (default: body)
|
|
11
|
+
--width <px> Browser viewport width (default: 1280)
|
|
12
|
+
--height <px> Browser viewport height (default: 800)
|
|
13
|
+
--help, -h Show this help message
|
|
14
|
+
|
|
15
|
+
Example:
|
|
16
|
+
npx veilkit capture https://example.com/dashboard --out ./dashboard.veil.json
|
|
17
|
+
`),process.exit(0)),r!=="capture"&&(console.error(`Unknown command: "${r}". Try "npx veilkit capture --help"`),process.exit(1));let n=t[1];(!n||n.startsWith("--"))&&(console.error("Error: Please provide a URL to capture. Example: npx veilkit capture https://myapp.com"),process.exit(1));let p=".veil.json",l="body",d=1280,u=800;for(let e=2;e<t.length;e++)t[e]==="--out"&&t[e+1]?p=t[++e]:t[e]==="--selector"&&t[e+1]?l=t[++e]:t[e]==="--width"&&t[e+1]?d=parseInt(t[++e],10):t[e]==="--height"&&t[e+1]&&(u=parseInt(t[++e],10));console.log(`
|
|
18
|
+
\u{1F578}\uFE0F Veilkit Capture: Launching browser for ${n}...`);let g;try{g=await import('playwright');}catch{console.error(`
|
|
19
|
+
[Veilkit CLI] Playwright is required for headless layout capture.
|
|
20
|
+
Please run:
|
|
21
|
+
pnpm add -D playwright
|
|
22
|
+
and try again.
|
|
23
|
+
`),process.exit(1);}try{let e=await g.chromium.launch({headless:!0}),w=await e.newPage({viewport:{width:d,height:u}});console.log(`Navigating to ${n}...`),await w.goto(n,{waitUntil:"networkidle"}),console.log(`Analyzing leaf layouts on "${l}"...`);let f=await w.evaluate(b=>{let c=document.querySelector(b)||document.body,a=c.getBoundingClientRect(),y=[];function v(i){if(i.hasAttribute("data-veil-ignore"))return;let s=window.getComputedStyle(i);if(s.display==="none"||s.visibility==="hidden"||s.opacity==="0")return;let x=i.tagName.toLowerCase(),k=["img","svg","button","input"].includes(x)||Array.from(i.childNodes).some(o=>o.nodeType===Node.TEXT_NODE&&(o.textContent||"").trim().length>0)&&i.children.length===0;if(i!==c&&k){let o=i.getBoundingClientRect();if(o.width>2&&o.height>2){let h=s.borderRadius||"6px",C=h==="50%"||parseFloat(h)>=o.width/2?"circle":["p","span","h1","h2","h3"].includes(x)?"line":"rect";y.push({x:Math.round(o.left-a.left),y:Math.round(o.top-a.top),width:Math.round(o.width),height:Math.round(o.height),radius:h,shape:C});}return}for(let o of Array.from(i.children))v(o);}return v(c),{url:window.location.href,viewport:{width:window.innerWidth,height:window.innerHeight},container:{width:Math.round(a.width),height:Math.round(a.height)},boxes:y}},l);await e.close();let m=L.resolve(process.cwd(),p);S.writeFileSync(m,JSON.stringify(f,null,2),"utf8"),console.log(`\u2713 Successfully captured ${f.boxes.length} layout elements!`),console.log(`\u{1F4C1} Saved layout map to: ${m}
|
|
24
|
+
`);}catch(e){console.error("[Veilkit CLI] Capture failed:",e.message),process.exit(1);}}M();//# sourceMappingURL=index.js.map
|
|
25
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/cli/index.ts"],"names":["run","args","command","targetUrl","outFile","selector","width","height","i","playwright","browser","page","layout","targetSelector","container","cRect","boxes","walk","el","style","tag","isLeaf","n","r","rad","shape","child","resolvedPath","path","fs","err"],"mappings":"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","file":"index.js","sourcesContent":["#!/usr/bin/env node\n\n/**\n * Veilkit CLI\n * `npx veilkit capture <url> [--out .veil.json] [--selector \"#app\"]`\n * Records real DOM layouts with Playwright into static .veil.json files for zero-runtime measurement\n */\n\nimport fs from 'node:fs';\nimport path from 'node:path';\n\nasync function run() {\n const args = process.argv.slice(2);\n const command = args[0];\n\n if (!command || command === '--help' || command === '-h') {\n console.log(`\nVeilkit CLI - Zero-Runtime Static Skeleton Capture\n\nUsage:\n npx veilkit capture <url> [options]\n\nOptions:\n --out <file> Output file path (default: .veil.json)\n --selector <sel> Target container CSS selector (default: body)\n --width <px> Browser viewport width (default: 1280)\n --height <px> Browser viewport height (default: 800)\n --help, -h Show this help message\n\nExample:\n npx veilkit capture https://example.com/dashboard --out ./dashboard.veil.json\n`);\n process.exit(0);\n }\n\n if (command !== 'capture') {\n console.error(`Unknown command: \"${command}\". Try \"npx veilkit capture --help\"`);\n process.exit(1);\n }\n\n const targetUrl = args[1];\n if (!targetUrl || targetUrl.startsWith('--')) {\n console.error('Error: Please provide a URL to capture. Example: npx veilkit capture https://myapp.com');\n process.exit(1);\n }\n\n let outFile = '.veil.json';\n let selector = 'body';\n let width = 1280;\n let height = 800;\n\n for (let i = 2; i < args.length; i++) {\n if (args[i] === '--out' && args[i + 1]) {\n outFile = args[++i]!;\n } else if (args[i] === '--selector' && args[i + 1]) {\n selector = args[++i]!;\n } else if (args[i] === '--width' && args[i + 1]) {\n width = parseInt(args[++i]!, 10);\n } else if (args[i] === '--height' && args[i + 1]) {\n height = parseInt(args[++i]!, 10);\n }\n }\n\n console.log(`\\n🕸️ Veilkit Capture: Launching browser for ${targetUrl}...`);\n\n let playwright: any;\n try {\n const pkgName = 'playwright';\n playwright = await import(/* @vite-ignore */ pkgName);\n } catch {\n console.error(`\n[Veilkit CLI] Playwright is required for headless layout capture.\nPlease run:\n pnpm add -D playwright\nand try again.\n`);\n process.exit(1);\n }\n\n try {\n const browser = await playwright.chromium.launch({ headless: true });\n const page = await browser.newPage({ viewport: { width, height } });\n\n console.log(`Navigating to ${targetUrl}...`);\n await page.goto(targetUrl, { waitUntil: 'networkidle' });\n\n console.log(`Analyzing leaf layouts on \"${selector}\"...`);\n const layout = await page.evaluate((targetSelector: string) => {\n const container = document.querySelector(targetSelector) || document.body;\n const cRect = container.getBoundingClientRect();\n const boxes: any[] = [];\n\n function walk(el: HTMLElement) {\n if (el.hasAttribute('data-veil-ignore')) return;\n const style = window.getComputedStyle(el);\n if (style.display === 'none' || style.visibility === 'hidden' || style.opacity === '0') return;\n\n const tag = el.tagName.toLowerCase();\n const isLeaf = ['img', 'svg', 'button', 'input'].includes(tag) ||\n (Array.from(el.childNodes).some((n) => n.nodeType === Node.TEXT_NODE && (n.textContent || '').trim().length > 0) && el.children.length === 0);\n\n if (el !== container && isLeaf) {\n const r = el.getBoundingClientRect();\n if (r.width > 2 && r.height > 2) {\n const rad = style.borderRadius || '6px';\n const shape = (rad === '50%' || parseFloat(rad) >= r.width / 2) ? 'circle' : (['p', 'span', 'h1', 'h2', 'h3'].includes(tag) ? 'line' : 'rect');\n boxes.push({\n x: Math.round(r.left - cRect.left),\n y: Math.round(r.top - cRect.top),\n width: Math.round(r.width),\n height: Math.round(r.height),\n radius: rad,\n shape,\n });\n }\n return;\n }\n\n for (const child of Array.from(el.children)) {\n walk(child as HTMLElement);\n }\n }\n\n walk(container as HTMLElement);\n\n return {\n url: window.location.href,\n viewport: { width: window.innerWidth, height: window.innerHeight },\n container: { width: Math.round(cRect.width), height: Math.round(cRect.height) },\n boxes,\n };\n }, selector);\n\n await browser.close();\n\n const resolvedPath = path.resolve(process.cwd(), outFile);\n fs.writeFileSync(resolvedPath, JSON.stringify(layout, null, 2), 'utf8');\n\n console.log(`✓ Successfully captured ${layout.boxes.length} layout elements!`);\n console.log(`📁 Saved layout map to: ${resolvedPath}\\n`);\n } catch (err: any) {\n console.error(`[Veilkit CLI] Capture failed:`, err.message);\n process.exit(1);\n }\n}\n\nrun();\n"]}
|
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
import { b as ProgressProps, O as OverlayProps, S as SkeletonProps, i as VeilPrimitiveType, P as PresetProps, g as VeilPresetName, d as VeilGlobalConfig, A as AutoMeasureOptions, l as SkeletonController, c as SpinnerProps } from './types-CnR-rU97.cjs';
|
|
2
|
+
import { createTheme, getThemeTokens } from './themes/index.cjs';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Veilkit - Global Loading Manager
|
|
6
|
+
* Manages concurrent requests using request IDs and counter.
|
|
7
|
+
* Ensures loader remains active until all pending operations finish.
|
|
8
|
+
*/
|
|
9
|
+
type Listener = (isLoading: boolean, count: number) => void;
|
|
10
|
+
declare class LoadingManager {
|
|
11
|
+
private activeIds;
|
|
12
|
+
private counter;
|
|
13
|
+
private listeners;
|
|
14
|
+
/**
|
|
15
|
+
* Start a loading operation. Optionally associate with a unique ID.
|
|
16
|
+
*/
|
|
17
|
+
start(id?: string): string;
|
|
18
|
+
/**
|
|
19
|
+
* Complete a loading operation by ID or decrement counter.
|
|
20
|
+
*/
|
|
21
|
+
stop(id?: string): void;
|
|
22
|
+
/**
|
|
23
|
+
* True if there is at least one active operation
|
|
24
|
+
*/
|
|
25
|
+
isLoading(): boolean;
|
|
26
|
+
/**
|
|
27
|
+
* Current number of concurrent operations
|
|
28
|
+
*/
|
|
29
|
+
getCount(): number;
|
|
30
|
+
/**
|
|
31
|
+
* Subscribe to state changes
|
|
32
|
+
*/
|
|
33
|
+
subscribe(listener: Listener): () => void;
|
|
34
|
+
/**
|
|
35
|
+
* Reset all active requests
|
|
36
|
+
*/
|
|
37
|
+
reset(): void;
|
|
38
|
+
private notify;
|
|
39
|
+
}
|
|
40
|
+
declare const loadingManager: LoadingManager;
|
|
41
|
+
|
|
42
|
+
/**
|
|
43
|
+
* Veilkit - Progress System
|
|
44
|
+
* Route Progress Bar (NProgress-style with auto-trickle) +
|
|
45
|
+
* Determinate & Indeterminate Linear and Circular Progress components
|
|
46
|
+
*/
|
|
47
|
+
|
|
48
|
+
declare class RouteProgressController {
|
|
49
|
+
private el;
|
|
50
|
+
private innerEl;
|
|
51
|
+
private currentProgress;
|
|
52
|
+
private trickleTimer;
|
|
53
|
+
private status;
|
|
54
|
+
private ensureDOM;
|
|
55
|
+
start(): void;
|
|
56
|
+
set(n: number): void;
|
|
57
|
+
inc(amount?: number): void;
|
|
58
|
+
private trickle;
|
|
59
|
+
private stopTrickle;
|
|
60
|
+
done(): void;
|
|
61
|
+
fail(): void;
|
|
62
|
+
}
|
|
63
|
+
declare const progressController: RouteProgressController;
|
|
64
|
+
/**
|
|
65
|
+
* Creates an inline determinate or indeterminate Linear/Circular Progress element
|
|
66
|
+
*/
|
|
67
|
+
declare function createProgressElement(props?: ProgressProps): HTMLElement;
|
|
68
|
+
|
|
69
|
+
/**
|
|
70
|
+
* Veilkit - Loading Overlay System
|
|
71
|
+
* Container-level and fullscreen blurred frosted overlays with spinner and message.
|
|
72
|
+
*/
|
|
73
|
+
|
|
74
|
+
declare class OverlayController {
|
|
75
|
+
/**
|
|
76
|
+
* Shows a loading overlay over a container element or fullscreen
|
|
77
|
+
*/
|
|
78
|
+
show(target?: HTMLElement | string, props?: OverlayProps): HTMLElement;
|
|
79
|
+
/**
|
|
80
|
+
* Hides and removes the overlay
|
|
81
|
+
*/
|
|
82
|
+
hide(target?: HTMLElement | string): void;
|
|
83
|
+
}
|
|
84
|
+
declare const overlayController: OverlayController;
|
|
85
|
+
|
|
86
|
+
/**
|
|
87
|
+
* Veilkit - Skeleton Primitives
|
|
88
|
+
* Primitives: line, paragraph, heading, circle, rect, image, button, badge, icon, input, table-row, divider
|
|
89
|
+
*/
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* Creates a DOM skeleton element with applied styles, classes, and synced timing
|
|
93
|
+
*/
|
|
94
|
+
declare function createSkeletonElement(props?: SkeletonProps): HTMLElement;
|
|
95
|
+
/**
|
|
96
|
+
* Creates multiple lines of text with natural varied widths
|
|
97
|
+
*/
|
|
98
|
+
declare function createSkeletonParagraph(lines?: number, props?: SkeletonProps): HTMLElement;
|
|
99
|
+
/**
|
|
100
|
+
* Creates any primitive by type
|
|
101
|
+
*/
|
|
102
|
+
declare function createPrimitive(type: VeilPrimitiveType, props?: SkeletonProps): HTMLElement;
|
|
103
|
+
|
|
104
|
+
/**
|
|
105
|
+
* Veilkit - Presets Engine
|
|
106
|
+
* 40 Ready-Made, Customizable, Responsive Skeleton Layout Presets
|
|
107
|
+
* Supports shape styles: rounded | pill | square | sharp | glass
|
|
108
|
+
*/
|
|
109
|
+
|
|
110
|
+
declare const PRESET_NAMES: VeilPresetName[];
|
|
111
|
+
declare function createPreset(props: PresetProps): HTMLElement;
|
|
112
|
+
|
|
113
|
+
/**
|
|
114
|
+
* Veilkit - Request Tracker & Fetch Wrapper
|
|
115
|
+
* Automatic loading state tracking with anti-flicker and error resilience
|
|
116
|
+
*/
|
|
117
|
+
interface TrackOptions {
|
|
118
|
+
id?: string;
|
|
119
|
+
delay?: number;
|
|
120
|
+
minVisible?: number;
|
|
121
|
+
overlay?: boolean;
|
|
122
|
+
target?: HTMLElement | string;
|
|
123
|
+
progress?: boolean;
|
|
124
|
+
onStart?: () => void;
|
|
125
|
+
onFinish?: () => void;
|
|
126
|
+
}
|
|
127
|
+
/**
|
|
128
|
+
* Tracks a Promise or async function, updating loading states automatically
|
|
129
|
+
*/
|
|
130
|
+
declare function track<T>(task: Promise<T> | (() => Promise<T>), options?: TrackOptions): Promise<T>;
|
|
131
|
+
/**
|
|
132
|
+
* Opt-in fetch wrapper that tracks HTTP requests automatically
|
|
133
|
+
* (Never patches global fetch by default)
|
|
134
|
+
*/
|
|
135
|
+
declare function wrapFetch(fetchFn?: typeof fetch, options?: TrackOptions): typeof fetch;
|
|
136
|
+
|
|
137
|
+
/**
|
|
138
|
+
* Veilkit - Accessibility & Localization Engine
|
|
139
|
+
* Screen-reader announcements, polite live regions, and WCAG AA compliance
|
|
140
|
+
*/
|
|
141
|
+
/**
|
|
142
|
+
* Configure active localization language
|
|
143
|
+
*/
|
|
144
|
+
declare function setLocale(locale: string): void;
|
|
145
|
+
/**
|
|
146
|
+
* Get current active locale
|
|
147
|
+
*/
|
|
148
|
+
declare function getLocale(): string;
|
|
149
|
+
/**
|
|
150
|
+
* Register or override accessibility label strings
|
|
151
|
+
*/
|
|
152
|
+
declare function setLabels(labels: Record<string, string>): void;
|
|
153
|
+
/**
|
|
154
|
+
* Resolves a localized label for screen readers
|
|
155
|
+
*/
|
|
156
|
+
declare function getLabel(key: 'loading' | 'loaded' | 'progress' | 'busy' | string): string;
|
|
157
|
+
/**
|
|
158
|
+
* Marks a container element with accessible loading attributes
|
|
159
|
+
*/
|
|
160
|
+
declare function applyA11yLoading(container: HTMLElement, label?: string): HTMLElement;
|
|
161
|
+
/**
|
|
162
|
+
* Clears accessible loading state from container
|
|
163
|
+
*/
|
|
164
|
+
declare function removeA11yLoading(container: HTMLElement): void;
|
|
165
|
+
|
|
166
|
+
declare class VeilkitController {
|
|
167
|
+
private config;
|
|
168
|
+
/**
|
|
169
|
+
* Configure global defaults for themes, animations, anti-flicker, CSP nonce, and a11y
|
|
170
|
+
*/
|
|
171
|
+
configure(config: VeilGlobalConfig): void;
|
|
172
|
+
/**
|
|
173
|
+
* Mounts a skeleton controller onto an element with show/hide/update/destroy methods
|
|
174
|
+
*/
|
|
175
|
+
skeleton(target: HTMLElement | string, options?: SkeletonProps & AutoMeasureOptions): SkeletonController;
|
|
176
|
+
/**
|
|
177
|
+
* Injects a spinner into a target element
|
|
178
|
+
*/
|
|
179
|
+
spinner(target: HTMLElement | string, props?: SpinnerProps): HTMLElement;
|
|
180
|
+
overlay: OverlayController;
|
|
181
|
+
progress: RouteProgressController;
|
|
182
|
+
manager: LoadingManager;
|
|
183
|
+
track: typeof track;
|
|
184
|
+
wrapFetch: typeof wrapFetch;
|
|
185
|
+
setLocale: typeof setLocale;
|
|
186
|
+
setLabels: typeof setLabels;
|
|
187
|
+
createTheme: typeof createTheme;
|
|
188
|
+
getThemeTokens: typeof getThemeTokens;
|
|
189
|
+
createSkeleton: typeof createSkeletonElement;
|
|
190
|
+
createPrimitive: typeof createPrimitive;
|
|
191
|
+
createPreset: typeof createPreset;
|
|
192
|
+
}
|
|
193
|
+
declare const veil: VeilkitController;
|
|
194
|
+
|
|
195
|
+
export { LoadingManager as L, OverlayController as O, PRESET_NAMES as P, RouteProgressController as R, type TrackOptions as T, VeilkitController as V, applyA11yLoading as a, createPrimitive as b, createPreset as c, createProgressElement as d, createSkeletonElement as e, createSkeletonParagraph as f, getLabel as g, getLocale as h, setLocale as i, loadingManager as l, overlayController as o, progressController as p, removeA11yLoading as r, setLabels as s, track as t, veil as v, wrapFetch as w };
|
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
import { b as ProgressProps, O as OverlayProps, S as SkeletonProps, i as VeilPrimitiveType, P as PresetProps, g as VeilPresetName, d as VeilGlobalConfig, A as AutoMeasureOptions, l as SkeletonController, c as SpinnerProps } from './types-CnR-rU97.js';
|
|
2
|
+
import { createTheme, getThemeTokens } from './themes/index.js';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Veilkit - Global Loading Manager
|
|
6
|
+
* Manages concurrent requests using request IDs and counter.
|
|
7
|
+
* Ensures loader remains active until all pending operations finish.
|
|
8
|
+
*/
|
|
9
|
+
type Listener = (isLoading: boolean, count: number) => void;
|
|
10
|
+
declare class LoadingManager {
|
|
11
|
+
private activeIds;
|
|
12
|
+
private counter;
|
|
13
|
+
private listeners;
|
|
14
|
+
/**
|
|
15
|
+
* Start a loading operation. Optionally associate with a unique ID.
|
|
16
|
+
*/
|
|
17
|
+
start(id?: string): string;
|
|
18
|
+
/**
|
|
19
|
+
* Complete a loading operation by ID or decrement counter.
|
|
20
|
+
*/
|
|
21
|
+
stop(id?: string): void;
|
|
22
|
+
/**
|
|
23
|
+
* True if there is at least one active operation
|
|
24
|
+
*/
|
|
25
|
+
isLoading(): boolean;
|
|
26
|
+
/**
|
|
27
|
+
* Current number of concurrent operations
|
|
28
|
+
*/
|
|
29
|
+
getCount(): number;
|
|
30
|
+
/**
|
|
31
|
+
* Subscribe to state changes
|
|
32
|
+
*/
|
|
33
|
+
subscribe(listener: Listener): () => void;
|
|
34
|
+
/**
|
|
35
|
+
* Reset all active requests
|
|
36
|
+
*/
|
|
37
|
+
reset(): void;
|
|
38
|
+
private notify;
|
|
39
|
+
}
|
|
40
|
+
declare const loadingManager: LoadingManager;
|
|
41
|
+
|
|
42
|
+
/**
|
|
43
|
+
* Veilkit - Progress System
|
|
44
|
+
* Route Progress Bar (NProgress-style with auto-trickle) +
|
|
45
|
+
* Determinate & Indeterminate Linear and Circular Progress components
|
|
46
|
+
*/
|
|
47
|
+
|
|
48
|
+
declare class RouteProgressController {
|
|
49
|
+
private el;
|
|
50
|
+
private innerEl;
|
|
51
|
+
private currentProgress;
|
|
52
|
+
private trickleTimer;
|
|
53
|
+
private status;
|
|
54
|
+
private ensureDOM;
|
|
55
|
+
start(): void;
|
|
56
|
+
set(n: number): void;
|
|
57
|
+
inc(amount?: number): void;
|
|
58
|
+
private trickle;
|
|
59
|
+
private stopTrickle;
|
|
60
|
+
done(): void;
|
|
61
|
+
fail(): void;
|
|
62
|
+
}
|
|
63
|
+
declare const progressController: RouteProgressController;
|
|
64
|
+
/**
|
|
65
|
+
* Creates an inline determinate or indeterminate Linear/Circular Progress element
|
|
66
|
+
*/
|
|
67
|
+
declare function createProgressElement(props?: ProgressProps): HTMLElement;
|
|
68
|
+
|
|
69
|
+
/**
|
|
70
|
+
* Veilkit - Loading Overlay System
|
|
71
|
+
* Container-level and fullscreen blurred frosted overlays with spinner and message.
|
|
72
|
+
*/
|
|
73
|
+
|
|
74
|
+
declare class OverlayController {
|
|
75
|
+
/**
|
|
76
|
+
* Shows a loading overlay over a container element or fullscreen
|
|
77
|
+
*/
|
|
78
|
+
show(target?: HTMLElement | string, props?: OverlayProps): HTMLElement;
|
|
79
|
+
/**
|
|
80
|
+
* Hides and removes the overlay
|
|
81
|
+
*/
|
|
82
|
+
hide(target?: HTMLElement | string): void;
|
|
83
|
+
}
|
|
84
|
+
declare const overlayController: OverlayController;
|
|
85
|
+
|
|
86
|
+
/**
|
|
87
|
+
* Veilkit - Skeleton Primitives
|
|
88
|
+
* Primitives: line, paragraph, heading, circle, rect, image, button, badge, icon, input, table-row, divider
|
|
89
|
+
*/
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* Creates a DOM skeleton element with applied styles, classes, and synced timing
|
|
93
|
+
*/
|
|
94
|
+
declare function createSkeletonElement(props?: SkeletonProps): HTMLElement;
|
|
95
|
+
/**
|
|
96
|
+
* Creates multiple lines of text with natural varied widths
|
|
97
|
+
*/
|
|
98
|
+
declare function createSkeletonParagraph(lines?: number, props?: SkeletonProps): HTMLElement;
|
|
99
|
+
/**
|
|
100
|
+
* Creates any primitive by type
|
|
101
|
+
*/
|
|
102
|
+
declare function createPrimitive(type: VeilPrimitiveType, props?: SkeletonProps): HTMLElement;
|
|
103
|
+
|
|
104
|
+
/**
|
|
105
|
+
* Veilkit - Presets Engine
|
|
106
|
+
* 40 Ready-Made, Customizable, Responsive Skeleton Layout Presets
|
|
107
|
+
* Supports shape styles: rounded | pill | square | sharp | glass
|
|
108
|
+
*/
|
|
109
|
+
|
|
110
|
+
declare const PRESET_NAMES: VeilPresetName[];
|
|
111
|
+
declare function createPreset(props: PresetProps): HTMLElement;
|
|
112
|
+
|
|
113
|
+
/**
|
|
114
|
+
* Veilkit - Request Tracker & Fetch Wrapper
|
|
115
|
+
* Automatic loading state tracking with anti-flicker and error resilience
|
|
116
|
+
*/
|
|
117
|
+
interface TrackOptions {
|
|
118
|
+
id?: string;
|
|
119
|
+
delay?: number;
|
|
120
|
+
minVisible?: number;
|
|
121
|
+
overlay?: boolean;
|
|
122
|
+
target?: HTMLElement | string;
|
|
123
|
+
progress?: boolean;
|
|
124
|
+
onStart?: () => void;
|
|
125
|
+
onFinish?: () => void;
|
|
126
|
+
}
|
|
127
|
+
/**
|
|
128
|
+
* Tracks a Promise or async function, updating loading states automatically
|
|
129
|
+
*/
|
|
130
|
+
declare function track<T>(task: Promise<T> | (() => Promise<T>), options?: TrackOptions): Promise<T>;
|
|
131
|
+
/**
|
|
132
|
+
* Opt-in fetch wrapper that tracks HTTP requests automatically
|
|
133
|
+
* (Never patches global fetch by default)
|
|
134
|
+
*/
|
|
135
|
+
declare function wrapFetch(fetchFn?: typeof fetch, options?: TrackOptions): typeof fetch;
|
|
136
|
+
|
|
137
|
+
/**
|
|
138
|
+
* Veilkit - Accessibility & Localization Engine
|
|
139
|
+
* Screen-reader announcements, polite live regions, and WCAG AA compliance
|
|
140
|
+
*/
|
|
141
|
+
/**
|
|
142
|
+
* Configure active localization language
|
|
143
|
+
*/
|
|
144
|
+
declare function setLocale(locale: string): void;
|
|
145
|
+
/**
|
|
146
|
+
* Get current active locale
|
|
147
|
+
*/
|
|
148
|
+
declare function getLocale(): string;
|
|
149
|
+
/**
|
|
150
|
+
* Register or override accessibility label strings
|
|
151
|
+
*/
|
|
152
|
+
declare function setLabels(labels: Record<string, string>): void;
|
|
153
|
+
/**
|
|
154
|
+
* Resolves a localized label for screen readers
|
|
155
|
+
*/
|
|
156
|
+
declare function getLabel(key: 'loading' | 'loaded' | 'progress' | 'busy' | string): string;
|
|
157
|
+
/**
|
|
158
|
+
* Marks a container element with accessible loading attributes
|
|
159
|
+
*/
|
|
160
|
+
declare function applyA11yLoading(container: HTMLElement, label?: string): HTMLElement;
|
|
161
|
+
/**
|
|
162
|
+
* Clears accessible loading state from container
|
|
163
|
+
*/
|
|
164
|
+
declare function removeA11yLoading(container: HTMLElement): void;
|
|
165
|
+
|
|
166
|
+
declare class VeilkitController {
|
|
167
|
+
private config;
|
|
168
|
+
/**
|
|
169
|
+
* Configure global defaults for themes, animations, anti-flicker, CSP nonce, and a11y
|
|
170
|
+
*/
|
|
171
|
+
configure(config: VeilGlobalConfig): void;
|
|
172
|
+
/**
|
|
173
|
+
* Mounts a skeleton controller onto an element with show/hide/update/destroy methods
|
|
174
|
+
*/
|
|
175
|
+
skeleton(target: HTMLElement | string, options?: SkeletonProps & AutoMeasureOptions): SkeletonController;
|
|
176
|
+
/**
|
|
177
|
+
* Injects a spinner into a target element
|
|
178
|
+
*/
|
|
179
|
+
spinner(target: HTMLElement | string, props?: SpinnerProps): HTMLElement;
|
|
180
|
+
overlay: OverlayController;
|
|
181
|
+
progress: RouteProgressController;
|
|
182
|
+
manager: LoadingManager;
|
|
183
|
+
track: typeof track;
|
|
184
|
+
wrapFetch: typeof wrapFetch;
|
|
185
|
+
setLocale: typeof setLocale;
|
|
186
|
+
setLabels: typeof setLabels;
|
|
187
|
+
createTheme: typeof createTheme;
|
|
188
|
+
getThemeTokens: typeof getThemeTokens;
|
|
189
|
+
createSkeleton: typeof createSkeletonElement;
|
|
190
|
+
createPrimitive: typeof createPrimitive;
|
|
191
|
+
createPreset: typeof createPreset;
|
|
192
|
+
}
|
|
193
|
+
declare const veil: VeilkitController;
|
|
194
|
+
|
|
195
|
+
export { LoadingManager as L, OverlayController as O, PRESET_NAMES as P, RouteProgressController as R, type TrackOptions as T, VeilkitController as V, applyA11yLoading as a, createPrimitive as b, createPreset as c, createProgressElement as d, createSkeletonElement as e, createSkeletonParagraph as f, getLabel as g, getLocale as h, setLocale as i, loadingManager as l, overlayController as o, progressController as p, removeA11yLoading as r, setLabels as s, track as t, veil as v, wrapFetch as w };
|