tosijs-ui 1.0.1 → 1.0.2

package/dist/markdown-viewer.js

@@ -1,173 +0,0 @@
-import { Component, xin } from 'xinjs';
-import { marked } from 'marked';
-/*#
-# markdown
-
-`<xin-md>` renders markdown using [marked](https://www.npmjs.com/package/marked).
-
-`<xin-md>` renders [markdown](https://www.markdownguide.org/) anywhere, either using the
-`src` attribute to load the file asynchronously, or rendering the text inside it.
-
-```html
-<xin-md>
-## hello
-world
-</xin-md>
-```
-```css
-xin-md {
-  display: block;
-  padding: var(--spacing);
-}
-```
-
-Note that, by default, `<xin-md>` will use its `textContent` (not its `innerHTML`) as its source.
-
-## rendering markdown from a url
-
-Again, like an `<img>` tag, you can simply set a `<xin-md>`'s `src` attribute to a URL pointing
-to markdown source and it will load it asynchronously and render it.
-
-```
-<xin-md src="/path/to/file.md">
-```
-
-## setting its `value`
-
-Or, just set the element's `value` and it will render it for you. You can try
-this in the console, e.g.
-
-```
-$('.preview xin-md').value = 'testing\n\n## this is a test'
-```
-
-## elements
-
-`<xin-md>` also (optionally) allows the embedding of inline HTML elements without blocking markdown
-rendering, so that you can embed specific elements while retaining markdown. You need to explicitly set
-the `elements` property, and for markdown rendering not to be blocked, the html elements need to
-start on a new line and not be indented. E.g.
-
-```html
-<xin-md elements>
-<form>
-### this is a form
-<label>
-fill in this field.
-**It's important!**
-<input>
-</label>
-</form>
-</xin-md>
-```
-
-In this case `<xin-md>` uses its `innerHTML` and not its `textContent`.
-
-## context and template variables
-
-`<xin-md>` also supports **template** values. You need to provide data to the element in the form
-of `context` (an arbitrary object, or a JSON string), and then embed the template text using
-handlebars-style doubled curly braces, e.g. `{{path.to.value}}`.
-
-If no value is found, the original text is passed through.
-
-Finally, note that template substitution occurs *before* markdown transformation, which means you can
-pass context data through to HTML elements.
-
-```html
-<xin-md
-  elements
-  context='{"title": "template example", "foo": {"bar": 17}, "nested": "*work*: {{foo.bar}}"}'
->
-## {{title}}
-
-The magic number is <input type="number" value={{foo.bar}}>
-
-Oh, and nested templates {{nested}}.
-</xin-md>
-```
-*/
-function populate(basePath, source) {
-    if (source == null) {
-        source = '';
-    }
-    else if (typeof source !== 'string') {
-        source = String(source);
-    }
-    return source.replace(/\{\{([^}]+)\}\}/g, (original, prop) => {
-        const value = xin[`${basePath}${prop.startsWith('[') ? prop : '.' + prop}`];
-        return value === undefined ? original : populate(basePath, String(value));
-    });
-}
-export class MarkdownViewer extends Component {
-    src = '';
-    value = '';
-    content = null;
-    elements = false;
-    context = {};
-    constructor() {
-        super();
-        this.initAttributes('src', 'elements', 'context');
-    }
-    connectedCallback() {
-        super.connectedCallback();
-        if (this.src !== '') {
-            ;
-            (async () => {
-                const request = await fetch(this.src);
-                this.value = await request.text();
-            })();
-        }
-        else if (this.value === '') {
-            if (this.elements) {
-                this.value = this.innerHTML;
-            }
-            else {
-                this.value = this.textContent != null ? this.textContent : '';
-            }
-        }
-    }
-    didRender = () => {
-        /* do not care */
-    };
-    render() {
-        super.render();
-        xin[this.instanceId] =
-            typeof this.context === 'string' ? JSON.parse(this.context) : this.context;
-        const source = populate(this.instanceId, this.value);
-        if (this.elements) {
-            const chunks = source
-                .split('\n')
-                .reduce((chunks, line) => {
-                if (line.startsWith('<') || chunks.length === 0) {
-                    chunks.push(line);
-                }
-                else {
-                    const lastChunk = chunks[chunks.length - 1];
-                    if (!lastChunk.startsWith('<') || !lastChunk.endsWith('>')) {
-                        chunks[chunks.length - 1] += '\n' + line;
-                    }
-                    else {
-                        chunks.push(line);
-                    }
-                }
-                return chunks;
-            }, []);
-            this.innerHTML = chunks
-                .map((chunk) => chunk.startsWith('<') && chunk.endsWith('>')
-                ? chunk
-                : marked(chunk, { mangle: false, headerIds: false }))
-                .join('');
-        }
-        else {
-            this.innerHTML = marked(source, {
-                mangle: false,
-                headerIds: false,
-            });
-        }
-        this.didRender();
-    }
-}
-export const markdownViewer = MarkdownViewer.elementCreator({
-    tag: 'xin-md',
-});

package/dist/match-shortcut.js

@@ -1,13 +0,0 @@
-export const matchShortcut = (keystroke, shortcut) => {
-    shortcut = shortcut.toLocaleLowerCase();
-    const ctrlKey = !!shortcut.match(/\^|ctrl/);
-    const metaKey = !!shortcut.match(/⌘|meta/);
-    const altKey = !!shortcut.match(/⌥|⎇|alt|option/);
-    const shiftKey = !!shortcut.match(/⇧|shift/);
-    const baseKey = shortcut.slice(-1);
-    return (keystroke.key === baseKey &&
-        keystroke.metaKey === metaKey &&
-        keystroke.ctrlKey === ctrlKey &&
-        keystroke.altKey === altKey &&
-        keystroke.shiftKey === shiftKey);
-};

package/dist/match-shortcut.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/match-shortcut.test.js

@@ -1,194 +0,0 @@
-import { test, expect } from 'bun:test';
-import { matchShortcut } from './match-shortcut';
-test('simple shortcuts', () => {
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, 'X')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, 'x')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, 'y')).toBe(false);
-});
-test('ctrl keys', () => {
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: true,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, 'ctrl-x')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: true,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, '^X')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: true,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, 'x')).toBe(false);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, '^X')).toBe(false);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: true,
-        key: 'x',
-    }, 'ctrl-x')).toBe(false);
-});
-test('meta keys', () => {
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: true,
-        key: 'x',
-    }, 'meta-x')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: true,
-        key: 'x',
-    }, '⌘-X')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: true,
-        key: 'x',
-    }, 'x')).toBe(false);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, '⌘-X')).toBe(false);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: true,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, 'meta-x')).toBe(false);
-});
-test('alt keys', () => {
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: true,
-        metaKey: false,
-        key: 'x',
-    }, '⌥x')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: true,
-        metaKey: false,
-        key: 'x',
-    }, 'alt-X')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: true,
-        metaKey: false,
-        key: 'x',
-    }, '⎇-x')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: true,
-        metaKey: false,
-        key: 'x',
-    }, 'option-X')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: true,
-        metaKey: false,
-        key: 'x',
-    }, 'x')).toBe(false);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, 'option-X')).toBe(false);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: true,
-        altKey: false,
-        metaKey: false,
-        key: 'x',
-    }, '⎇x')).toBe(false);
-});
-test('chorded modifiers', () => {
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: true,
-        metaKey: true,
-        key: 'x',
-    }, '⌘⌥x')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: true,
-        metaKey: true,
-        key: 'x',
-    }, '⌘⌥x')).toBe(true);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: true,
-        key: 'x',
-    }, '⌘⌥x')).toBe(false);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: false,
-        metaKey: true,
-        key: 'x',
-    }, 'alt-meta-x')).toBe(false);
-    expect(matchShortcut({
-        shiftKey: false,
-        ctrlKey: false,
-        altKey: true,
-        metaKey: false,
-        key: 'x',
-    }, '⌘⌥x')).toBe(false);
-    expect(matchShortcut({
-        shiftKey: true,
-        ctrlKey: false,
-        altKey: true,
-        metaKey: false,
-        key: 'x',
-    }, '⌘⌥x')).toBe(false);
-});