@xlabs-store/core 0.0.1 → 0.0.2

package/dist/collection/utils/code-editor/autocomplete-db.js

@@ -0,0 +1,590 @@
+const JS_ITEMS = [
+    // keywords
+    ...[
+        'const',
+        'let',
+        'var',
+        'function',
+        'class',
+        'return',
+        'if',
+        'else',
+        'for',
+        'while',
+        'do',
+        'switch',
+        'case',
+        'break',
+        'continue',
+        'try',
+        'catch',
+        'finally',
+        'throw',
+        'async',
+        'await',
+        'import',
+        'export',
+        'default',
+        'from',
+        'new',
+        'this',
+        'typeof',
+        'instanceof',
+        'delete',
+        'void',
+        'null',
+        'undefined',
+        'true',
+        'false',
+    ].map(k => ({
+        label: k,
+        type: 'kw',
+        detail: 'keyword',
+    })),
+    // snippets
+    {
+        label: 'caf',
+        type: 'snip',
+        detail: 'const arrow fn',
+        doc: 'Creates a const arrow function',
+        insert: 'const ${1:name} = (${2:args}) => {\n  $0\n};',
+    },
+    {
+        label: 'afn',
+        type: 'snip',
+        detail: 'async arrow fn',
+        insert: 'const ${1:name} = async (${2:args}) => {\n  $0\n};',
+    },
+    {
+        label: 'fn',
+        type: 'snip',
+        detail: 'function declaration',
+        insert: 'function ${1:name}(${2:args}) {\n  $0\n}',
+    },
+    {
+        label: 'class',
+        type: 'snip',
+        detail: 'class declaration',
+        insert: 'class ${1:Name} {\n  constructor(${2:args}) {\n    $0\n  }\n}',
+    },
+    {
+        label: 'for',
+        type: 'snip',
+        detail: 'for loop',
+        insert: 'for (let ${1:i} = 0; ${1:i} < ${2:arr}.length; ${1:i}++) {\n  $0\n}',
+    },
+    {
+        label: 'forin',
+        type: 'snip',
+        detail: 'for...in',
+        insert: 'for (const ${1:key} in ${2:obj}) {\n  $0\n}',
+    },
+    {
+        label: 'forof',
+        type: 'snip',
+        detail: 'for...of',
+        insert: 'for (const ${1:item} of ${2:arr}) {\n  $0\n}',
+    },
+    {
+        label: 'try',
+        type: 'snip',
+        detail: 'try / catch',
+        insert: 'try {\n  $0\n} catch (${1:err}) {\n  console.error(${1:err});\n}',
+    },
+    {
+        label: 'imp',
+        type: 'snip',
+        detail: 'import statement',
+        insert: "import { ${1:name} } from '${2:module}';",
+    },
+    {
+        label: 'prom',
+        type: 'snip',
+        detail: 'new Promise',
+        insert: 'new Promise((${1:resolve}, ${2:reject}) => {\n  $0\n})',
+    },
+    {
+        label: 'ife',
+        type: 'snip',
+        detail: 'immediately invoked fn',
+        insert: '(async () => {\n  $0\n})();',
+    },
+    // builtins
+    ...[
+        'console.log',
+        'console.error',
+        'console.warn',
+        'console.table',
+        'console.dir',
+        'Math.floor',
+        'Math.ceil',
+        'Math.round',
+        'Math.max',
+        'Math.min',
+        'Math.abs',
+        'Math.random',
+        'Math.pow',
+        'Math.sqrt',
+        'Array.from',
+        'Array.isArray',
+        'Array.of',
+        'Object.keys',
+        'Object.values',
+        'Object.entries',
+        'Object.assign',
+        'Object.freeze',
+        'Object.create',
+        'JSON.parse',
+        'JSON.stringify',
+        'parseInt',
+        'parseFloat',
+        'isNaN',
+        'isFinite',
+        'setTimeout',
+        'setInterval',
+        'clearTimeout',
+        'clearInterval',
+        'requestAnimationFrame',
+        'fetch',
+        'Promise.all',
+        'Promise.allSettled',
+        'Promise.race',
+        'Promise.resolve',
+        'Promise.reject',
+        'document.querySelector',
+        'document.querySelectorAll',
+        'document.getElementById',
+        'document.createElement',
+        'document.addEventListener',
+        'window.addEventListener',
+        'window.removeEventListener',
+        'localStorage.getItem',
+        'localStorage.setItem',
+        'localStorage.removeItem',
+        'sessionStorage.getItem',
+        'sessionStorage.setItem',
+    ].map(b => ({ label: b, type: 'fn', detail: 'builtin' })),
+    // array methods
+    ...[
+        'forEach',
+        'map',
+        'filter',
+        'reduce',
+        'reduceRight',
+        'find',
+        'findIndex',
+        'findLast',
+        'some',
+        'every',
+        'includes',
+        'indexOf',
+        'lastIndexOf',
+        'slice',
+        'splice',
+        'push',
+        'pop',
+        'shift',
+        'unshift',
+        'sort',
+        'reverse',
+        'flat',
+        'flatMap',
+        'join',
+        'fill',
+        'copyWithin',
+        'entries',
+        'keys',
+        'values',
+        'at',
+        'toSorted',
+        'toReversed',
+        'toSpliced',
+        'with',
+    ].map(m => ({ label: '.' + m, type: 'prop', detail: 'Array method' })),
+    // string methods
+    ...[
+        'split',
+        'trim',
+        'trimStart',
+        'trimEnd',
+        'replace',
+        'replaceAll',
+        'match',
+        'matchAll',
+        'search',
+        'startsWith',
+        'endsWith',
+        'includes',
+        'indexOf',
+        'lastIndexOf',
+        'slice',
+        'substring',
+        'padStart',
+        'padEnd',
+        'repeat',
+        'toUpperCase',
+        'toLowerCase',
+        'charAt',
+        'charCodeAt',
+        'codePointAt',
+        'normalize',
+        'at',
+    ].map(m => ({ label: '.' + m, type: 'prop', detail: 'String method' })),
+    // promise / async methods
+    ...['then', 'catch', 'finally'].map(m => ({ label: '.' + m, type: 'prop', detail: 'Promise method' })),
+];
+const CSS_ITEMS = [
+    ...[
+        'display',
+        'position',
+        'flex',
+        'grid',
+        'width',
+        'height',
+        'min-width',
+        'max-width',
+        'min-height',
+        'max-height',
+        'margin',
+        'margin-top',
+        'margin-right',
+        'margin-bottom',
+        'margin-left',
+        'padding',
+        'padding-top',
+        'padding-right',
+        'padding-bottom',
+        'padding-left',
+        'color',
+        'background',
+        'background-color',
+        'background-image',
+        'background-size',
+        'background-position',
+        'border',
+        'border-width',
+        'border-style',
+        'border-color',
+        'border-radius',
+        'font-size',
+        'font-weight',
+        'font-family',
+        'font-style',
+        'line-height',
+        'letter-spacing',
+        'text-align',
+        'text-decoration',
+        'text-transform',
+        'white-space',
+        'word-break',
+        'overflow',
+        'overflow-x',
+        'overflow-y',
+        'z-index',
+        'opacity',
+        'visibility',
+        'pointer-events',
+        'cursor',
+        'user-select',
+        'outline',
+        'box-shadow',
+        'text-shadow',
+        'transition',
+        'transform',
+        'animation',
+        'animation-name',
+        'animation-duration',
+        'gap',
+        'row-gap',
+        'column-gap',
+        'align-items',
+        'align-self',
+        'align-content',
+        'justify-content',
+        'justify-items',
+        'justify-self',
+        'flex-direction',
+        'flex-wrap',
+        'flex-grow',
+        'flex-shrink',
+        'flex-basis',
+        'grid-template-columns',
+        'grid-template-rows',
+        'grid-column',
+        'grid-row',
+        'grid-area',
+        'place-items',
+        'place-content',
+        'object-fit',
+        'object-position',
+        'aspect-ratio',
+        'clip-path',
+        'filter',
+        'backdrop-filter',
+        'will-change',
+        'contain',
+        'content',
+        'resize',
+        'top',
+        'right',
+        'bottom',
+        'left',
+        'inset',
+    ].map(p => ({ label: p, type: 'prop', detail: 'property' })),
+    ...[
+        'none',
+        'auto',
+        'inherit',
+        'initial',
+        'unset',
+        'revert',
+        'flex',
+        'grid',
+        'block',
+        'inline',
+        'inline-block',
+        'inline-flex',
+        'inline-grid',
+        'absolute',
+        'relative',
+        'fixed',
+        'sticky',
+        'static',
+        'hidden',
+        'visible',
+        'scroll',
+        'clip',
+        'transparent',
+        'currentColor',
+        'center',
+        'start',
+        'end',
+        'stretch',
+        'left',
+        'right',
+        'normal',
+        'bold',
+        'italic',
+        'nowrap',
+        'pre',
+        'pre-wrap',
+        'break-word',
+        'pointer',
+        'default',
+        'cover',
+        'contain',
+        'fill',
+        'underline',
+        'line-through',
+        'uppercase',
+        'lowercase',
+        'capitalize',
+        'ease',
+        'ease-in',
+        'ease-out',
+        'ease-in-out',
+        'linear',
+        'forwards',
+        'backwards',
+        'both',
+    ].map(v => ({ label: v, type: 'kw', detail: 'value' })),
+    ...[
+        'rgb()',
+        'rgba()',
+        'hsl()',
+        'hsla()',
+        'oklch()',
+        'color()',
+        'linear-gradient()',
+        'radial-gradient()',
+        'conic-gradient()',
+        'var()',
+        'calc()',
+        'clamp()',
+        'min()',
+        'max()',
+        'env()',
+        'url()',
+        'format()',
+        'translate()',
+        'scale()',
+        'rotate()',
+        'matrix()',
+    ].map(f => ({ label: f, type: 'fn', detail: 'function' })),
+];
+const HTML_ITEMS = [
+    ...[
+        'div',
+        'span',
+        'p',
+        'h1',
+        'h2',
+        'h3',
+        'h4',
+        'h5',
+        'h6',
+        'a',
+        'img',
+        'input',
+        'button',
+        'form',
+        'label',
+        'select',
+        'option',
+        'optgroup',
+        'textarea',
+        'fieldset',
+        'legend',
+        'ul',
+        'ol',
+        'li',
+        'dl',
+        'dt',
+        'dd',
+        'table',
+        'tr',
+        'td',
+        'th',
+        'thead',
+        'tbody',
+        'tfoot',
+        'caption',
+        'colgroup',
+        'col',
+        'nav',
+        'header',
+        'footer',
+        'main',
+        'section',
+        'article',
+        'aside',
+        'address',
+        'dialog',
+        'details',
+        'summary',
+        'figure',
+        'figcaption',
+        'video',
+        'audio',
+        'source',
+        'track',
+        'canvas',
+        'svg',
+        'path',
+        'circle',
+        'rect',
+        'line',
+        'script',
+        'link',
+        'meta',
+        'title',
+        'base',
+        'head',
+        'body',
+        'html',
+        'style',
+        'template',
+        'slot',
+        'picture',
+        'iframe',
+        'object',
+        'embed',
+        'code',
+        'pre',
+        'kbd',
+        'samp',
+        'var',
+        'mark',
+        'del',
+        'ins',
+        's',
+        'sub',
+        'sup',
+        'abbr',
+        'blockquote',
+        'cite',
+        'q',
+        'small',
+        'strong',
+        'em',
+        'b',
+        'i',
+        'u',
+        'time',
+        'data',
+    ].map(t => ({ label: '<' + t, type: 'tag', detail: 'element', insert: `<${t}>$0</${t}>` })),
+    ...[
+        'class',
+        'id',
+        'src',
+        'href',
+        'alt',
+        'type',
+        'name',
+        'value',
+        'placeholder',
+        'disabled',
+        'checked',
+        'readonly',
+        'required',
+        'data-',
+        'aria-label',
+        'aria-hidden',
+        'aria-expanded',
+        'aria-controls',
+        'aria-describedby',
+        'role',
+        'tabindex',
+        'style',
+        'title',
+        'target',
+        'rel',
+        'action',
+        'method',
+        'for',
+        'colspan',
+        'rowspan',
+        'width',
+        'height',
+        'loading',
+        'defer',
+        'async',
+        'charset',
+        'content',
+        'property',
+        'lang',
+        'dir',
+        'hidden',
+        'autofocus',
+        'multiple',
+        'accept',
+        'pattern',
+        'min',
+        'max',
+        'step',
+        'autocomplete',
+        'enctype',
+        'novalidate',
+        'crossorigin',
+        'integrity',
+        'referrerpolicy',
+        'fetchpriority',
+    ].map(a => ({ label: a, type: 'attr', detail: 'attribute' })),
+];
+const JSON_ITEMS = [
+    { label: 'true', type: 'kw', detail: 'boolean' },
+    { label: 'false', type: 'kw', detail: 'boolean' },
+    { label: 'null', type: 'kw', detail: 'null' },
+];
+const DB = {
+    js: JS_ITEMS,
+    css: CSS_ITEMS,
+    html: HTML_ITEMS,
+    json: JSON_ITEMS,
+};
+export function getCompletions(prefix, lang) {
+    if (!prefix || prefix.length < 1)
+        return [];
+    const lower = prefix.toLowerCase();
+    return (DB[lang] || []).filter(item => item.label.toLowerCase().startsWith(lower) && item.label !== prefix).slice(0, 14);
+}

package/dist/collection/utils/code-editor/history.js

@@ -0,0 +1,56 @@
+// src/utils/history.ts
+export class EditHistory {
+    stack = [];
+    index = -1;
+    maxSize;
+    timer = null;
+    constructor(maxSize = 200) {
+        this.maxSize = maxSize;
+    }
+    push(entry) {
+        // debounce: only push after 400ms of inactivity
+        if (this.timer !== null)
+            clearTimeout(this.timer);
+        this.timer = setTimeout(() => {
+            if (this.stack[this.index]?.value === entry.value)
+                return;
+            this.stack = this.stack.slice(0, this.index + 1);
+            this.stack.push({ ...entry });
+            if (this.stack.length > this.maxSize)
+                this.stack.shift();
+            this.index = this.stack.length - 1;
+        }, 400);
+    }
+    /** Push immediately (e.g., before a bulk operation) */
+    pushNow(entry) {
+        if (this.timer !== null) {
+            clearTimeout(this.timer);
+            this.timer = null;
+        }
+        if (this.stack[this.index]?.value === entry.value)
+            return;
+        this.stack = this.stack.slice(0, this.index + 1);
+        this.stack.push({ ...entry });
+        if (this.stack.length > this.maxSize)
+            this.stack.shift();
+        this.index = this.stack.length - 1;
+    }
+    undo() {
+        if (this.index <= 0)
+            return null;
+        this.index--;
+        return { ...this.stack[this.index] };
+    }
+    redo() {
+        if (this.index >= this.stack.length - 1)
+            return null;
+        this.index++;
+        return { ...this.stack[this.index] };
+    }
+    canUndo() {
+        return this.index > 0;
+    }
+    canRedo() {
+        return this.index < this.stack.length - 1;
+    }
+}

package/dist/collection/utils/code-editor/index.js

@@ -0,0 +1,4 @@
+export * from './history';
+export * from './tokenizer';
+export * from './autocomplete-db';
+export * from './ast-parser';

package/dist/collection/utils/code-editor/plugin-system.js

@@ -0,0 +1,54 @@
+// src/utils/plugin-system.ts
+export class PluginSystem {
+    plugins = new Map();
+    hooks = {};
+    handlers = {};
+    register(def) {
+        const enabled = def.enabled !== false;
+        this.plugins.set(def.id, { ...def, enabled });
+        if (enabled)
+            def.activate?.();
+        return this;
+    }
+    /** Transforming hook — each fn receives and returns a value */
+    hook(name, fn) {
+        (this.hooks[name] ??= []).push(fn);
+        return () => {
+            this.hooks[name] = (this.hooks[name] ?? []).filter(f => f !== fn);
+        };
+    }
+    /** Run all hooks, threading value through each */
+    applyHooks(name, initial, ...args) {
+        return (this.hooks[name] ?? []).reduce((v, fn) => fn(v, ...args), initial);
+    }
+    /** Fire-and-forget event */
+    on(event, fn) {
+        (this.handlers[event] ??= []).push(fn);
+        return () => {
+            this.handlers[event] = (this.handlers[event] ?? []).filter(f => f !== fn);
+        };
+    }
+    emit(event, data) {
+        (this.handlers[event] ?? []).forEach(fn => fn(data));
+    }
+    toggle(id) {
+        const p = this.plugins.get(id);
+        if (!p)
+            return false;
+        p.enabled = !p.enabled;
+        if (p.enabled)
+            p.activate?.();
+        else
+            p.deactivate?.();
+        return p.enabled;
+    }
+    isEnabled(id) {
+        return this.plugins.get(id)?.enabled ?? false;
+    }
+    list() {
+        return [...this.plugins.values()];
+    }
+    get(id) {
+        return this.plugins.get(id);
+    }
+}