@icure/form 1.0.1 → 1.0.2

package/lib/components/iqr-text-field/plugin/mask-plugin.js

@@ -0,0 +1,143 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.maskPlugin = void 0;
+const prosemirror_state_1 = require("prosemirror-state");
+const prosemirror_view_1 = require("prosemirror-view");
+exports.maskPlugin = () => {
+    const maskText = ($pos, text, mask, tr, setSelection = true) => {
+        const textFromBeginning = $pos.parent.textBetween(0, $pos.parentOffset) + text;
+        const trailingText = $pos.parent.textBetween($pos.parentOffset, $pos.parent.content.size);
+        let t = textFromBeginning;
+        let skip = 0;
+        let completed = false;
+        if (t.length === 0) {
+            t += trailingText.substring(text.length + skip);
+            completed = true;
+        }
+        for (let i = 0; i < mask.length && i < t.length; i++) {
+            if (mask[i] === '.' && t[i].normalize("NFD").replace(/[\u0300-\u036f]/g, "").match(/\w|-/) ||
+                mask[i] === '-' && t[i].match(/\d/)) {
+                //skip
+            }
+            else {
+                if (mask[i] === t[i]) {
+                    //skip
+                }
+                else {
+                    t = t.substring(0, i) + mask[i] + t.substring(i);
+                    if (!completed)
+                        skip++;
+                }
+            }
+            if (t.length === i + 1 && !completed) {
+                t += trailingText.substring(text.length + skip);
+                completed = true;
+            }
+        }
+        const tail = t.length > mask.length ? t.substring(mask.length) : '';
+        t = t.substring(0, mask.length);
+        let trail = t.length < mask.length ? mask.substring(t.length) : '';
+        if (t === textFromBeginning && trail === trailingText) {
+            return undefined;
+        }
+        const currentSel = tr.selection;
+        tr = tr.insertText(t + trail, $pos.pos - $pos.parentOffset, $pos.pos - $pos.parentOffset + $pos.parent.content.size);
+        if (setSelection) {
+            tr = tr.setSelection(prosemirror_state_1.TextSelection.create(tr.doc, Math.min($pos.pos + text.length + skip, tr.doc.content.size - 1)));
+        }
+        else {
+            tr = tr.setSelection(prosemirror_state_1.TextSelection.create(tr.doc, Math.min(currentSel.$anchor.pos, tr.doc.content.size - 1), Math.min(currentSel.$head.pos, tr.doc.content.size - 1)));
+        }
+        tr.setMeta("tailText", tail);
+        return tr;
+    };
+    function applyDocMasks(state) {
+        let tr = undefined;
+        let posMark = 0;
+        //Scan nodes and add mask when needed
+        while ((tr || state).doc && posMark < (tr || state).doc.content.size) {
+            const $pos = (tr || state).doc.resolve(posMark);
+            const node = $pos.node($pos.depth) || undefined;
+            const mask = node === null || node === void 0 ? void 0 : node.type.spec.mask;
+            if (mask) {
+                tr = tr || state.tr;
+                tr = maskText(tr.doc.resolve(posMark), '', mask, tr, false) || tr;
+                const $newPos = tr.doc.resolve(posMark);
+                const newNode = $newPos.node($newPos.depth);
+                if (newNode) {
+                    posMark += newNode.content.size + 1;
+                }
+                else
+                    posMark++;
+            }
+            else {
+                posMark++;
+            }
+        }
+        return tr;
+    }
+    return new prosemirror_state_1.Plugin({
+        view: (v) => {
+            let tr = applyDocMasks(v.state);
+            if (tr)
+                v.updateState(v.state.apply(tr));
+            return {};
+        },
+        props: {
+            decorations(state) {
+                let $pos = state.doc.resolve(Math.min(state.selection.$from.pos, state.doc.content.size));
+                let node = $pos.parent;
+                let start = $pos.pos - $pos.parentOffset;
+                if (node.type.spec.mask) {
+                    if (node.type.spec.mask.length === $pos.parentOffset && node.type.spec.mask.length === node.content.size) {
+                        //Move to the next one
+                        while ($pos.pos < state.doc.content.size - 1) {
+                            $pos = state.doc.resolve($pos.pos + 1);
+                            node = $pos.parent;
+                            if (node && node.type.spec.mask) {
+                                start = $pos.pos - $pos.parentOffset;
+                                break;
+                            }
+                        }
+                    }
+                    return prosemirror_view_1.DecorationSet.create(state.doc, [
+                        prosemirror_view_1.Decoration.node(start - 1, start - 1 + node.nodeSize, { class: "focused" })
+                    ]);
+                }
+                return undefined;
+            },
+            handleTextInput: (view, from, to, text) => {
+                if (view.composing)
+                    return false;
+                const state = view.state;
+                const $from = state.doc.resolve(from);
+                const mask = $from.parent.type.spec.mask;
+                const regexp = $from.parent.type.spec.regexp;
+                if (!mask)
+                    return false;
+                const tr = maskText($from, regexp && regexp.length ? text.split('').filter(x => x.match(new RegExp(regexp))).join('') : text, mask, state.tr);
+                if (tr) {
+                    const tail = tr.getMeta('tailText');
+                    if (tail === null || tail === void 0 ? void 0 : tail.length) {
+                        const nextPos = tr.selection.$to.pos < tr.doc.content.size ? tr.doc.resolve(tr.selection.$to.pos + 1) : undefined;
+                        if (nextPos) {
+                            const nextNode = nextPos.node(nextPos.depth);
+                            if (nextNode && nextNode.type.spec.mask && nextNode.type.spec.mask.length) {
+                                maskText(nextPos, tail, nextNode.type.spec.mask, tr);
+                            }
+                            else if (nextNode && (nextNode.type.isText || nextNode.type.isTextblock)) {
+                                tr.insertText(tail, nextPos.pos, nextPos.pos);
+                            }
+                        }
+                    }
+                    view.dispatch(tr);
+                    return true;
+                }
+                return false;
+            }
+        },
+        appendTransaction: (transactions, oldState, newState) => {
+            return applyDocMasks(newState);
+        }
+    });
+};

package/lib/components/iqr-text-field/plugin/regexp-plugin.d.ts

@@ -0,0 +1,2 @@
+import { Plugin } from 'prosemirror-state';
+export declare const regexpPlugin: () => Plugin<any, any>;

package/lib/components/iqr-text-field/plugin/regexp-plugin.js

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.regexpPlugin = void 0;
+const prosemirror_state_1 = require("prosemirror-state");
+exports.regexpPlugin = () => {
+    return new prosemirror_state_1.Plugin({
+        props: {
+            handleTextInput: (view, from, to, text) => {
+                if (view.composing)
+                    return false;
+                const state = view.state;
+                const $from = state.doc.resolve(from);
+                const mask = $from.parent.type.spec.mask;
+                const regexp = $from.parent.type.spec.regexp;
+                if (mask || !regexp)
+                    return false; // Will be handled by mask plugin
+                const allowedCharacters = text.split('').filter(x => x.match(new RegExp(regexp))).join('');
+                if (allowedCharacters === text)
+                    return false;
+                let tr = state.tr;
+                if (allowedCharacters.length) {
+                    tr = tr.insertText(allowedCharacters, from, to);
+                    tr = tr.setSelection(prosemirror_state_1.TextSelection.create(tr.doc, Math.min(to + allowedCharacters.length, tr.doc.content.size - 1)));
+                }
+                if (text.startsWith(allowedCharacters)) {
+                    const tail = text.substring(allowedCharacters.length);
+                    if (tail === null || tail === void 0 ? void 0 : tail.length) {
+                        let posMark = tr.selection.$to.pos + 1;
+                        while (posMark < tr.doc.content.size) {
+                            const nextPos = tr.doc.resolve(posMark);
+                            const nextNode = nextPos.node(nextPos.depth);
+                            if (nextNode && (nextNode.type.isText || nextNode.type.isTextblock)) {
+                                tr = tr.insertText(tail, nextPos.pos, nextPos.pos);
+                                tr = tr.setSelection(prosemirror_state_1.TextSelection.create(tr.doc, Math.min(nextPos.pos + tail.length, tr.doc.content.size - 1)));
+                                break;
+                            }
+                            posMark++;
+                        }
+                    }
+                }
+                view.dispatch(tr);
+                return true;
+            }
+        }
+    });
+};

package/lib/components/iqr-text-field/prosemirror-commands.d.ts

@@ -0,0 +1,4 @@
+import { NodeType } from "prosemirror-model";
+import { EditorState, Transaction } from "prosemirror-state";
+export declare function wrapInIfNeeded(nodeType: NodeType, attrs?: any): (state: EditorState, dispatch?: ((tr: Transaction) => void) | undefined) => boolean;
+export declare function unwrapFrom(nodeType: NodeType): (state: EditorState, dispatch?: ((tr: Transaction) => void) | undefined) => boolean;

package/lib/components/iqr-text-field/prosemirror-commands.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.unwrapFrom = exports.wrapInIfNeeded = void 0;
+const prosemirror_transform_1 = require("prosemirror-transform");
+const prosemirror_model_1 = require("prosemirror-model");
+const prosemirror_state_1 = require("prosemirror-state");
+// :: (NodeType, ?Object) → (state: EditorState, dispatch: ?(tr: Transaction)) → bool
+// Wrap the selection in a node of the given type with the given
+// attributes.
+function wrapInIfNeeded(nodeType, attrs) {
+    return function (state, dispatch) {
+        var _a, _b;
+        const { $from, $to, to } = state.selection;
+        const range = $from.blockRange($to);
+        if (!range) {
+            return false;
+        }
+        let same = range.$from.sharedDepth(to);
+        if (same) {
+            const pos = $from.before(same);
+            if (((_b = (_a = prosemirror_state_1.NodeSelection.create(state.doc, pos).$from) === null || _a === void 0 ? void 0 : _a.node()) === null || _b === void 0 ? void 0 : _b.type) === nodeType) {
+                return false;
+            }
+        }
+        const wrapping = range && prosemirror_transform_1.findWrapping(range, nodeType, attrs);
+        if (!wrapping)
+            return false;
+        if (dispatch)
+            dispatch(state.tr.wrap(range, wrapping).scrollIntoView());
+        return true;
+    };
+}
+exports.wrapInIfNeeded = wrapInIfNeeded;
+// :: (NodeType, ?Object) → (state: EditorState, dispatch: ?(tr: Transaction)) → bool
+// Wrap the selection in a node of the given type with the given
+// attributes.
+function unwrapFrom(nodeType) {
+    return function (state, dispatch) {
+        const { $from, $to } = state.selection;
+        const range = $from.blockRange($to);
+        const depth = range && prosemirror_transform_1.liftTarget(range);
+        if (depth === null || depth === undefined) {
+            return false;
+        }
+        let gapStart = $from.before(depth + 1), gapEnd = $to.after(depth + 1);
+        const frag = prosemirror_model_1.Fragment.from($from.node());
+        if (dispatch)
+            dispatch(state.tr.replaceRange(gapStart, gapEnd, new prosemirror_model_1.Slice(frag, 0, 0)).scrollIntoView());
+        return true;
+    };
+}
+exports.unwrapFrom = unwrapFrom;

package/lib/components/iqr-text-field/prosemirror-utils.d.ts

@@ -0,0 +1,5 @@
+import { MarkSpec } from "prosemirror-model";
+import OrderedMap = require('orderedmap');
+export declare function hasMark(ms: {
+    [key: string]: MarkSpec;
+} | OrderedMap<MarkSpec> | null | undefined, mark: string): boolean;

package/lib/components/iqr-text-field/prosemirror-utils.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.hasMark = void 0;
+function hasMark(ms, mark) {
+    if (!ms) {
+        return false;
+    }
+    if (!!ms.get) {
+        return !!(ms.get(mark));
+    }
+    else {
+        return !!ms[mark];
+    }
+}
+exports.hasMark = hasMark;

package/lib/components/iqr-text-field/schema/common-marks.d.ts

@@ -0,0 +1,10 @@
+import { MarkSpec } from "prosemirror-model";
+export declare const colors: {
+    [key: string]: [string, string];
+};
+export declare function getMarks(contentProvider: (codes: {
+    type: string;
+    code: string;
+}[]) => string, colorProvider: (type: string, code: string, isCode: boolean) => string): {
+    [key: string]: MarkSpec;
+};

package/lib/components/iqr-text-field/schema/common-marks.js

@@ -0,0 +1,90 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getMarks = exports.colors = void 0;
+exports.colors = {
+    'I': ['#F44336', 'white'],
+    'II': ['#E91E63', 'white'],
+    'III': ['#9C27B0', 'white'],
+    'IV': ['#673AB7', 'white'],
+    'V': ['#009688', 'white'],
+    'VI': ['#4CAF50', 'white'],
+    'VII': ['#8BC34A', 'white'],
+    'VIII': ['#03A9F4', 'white'],
+    'IX': ['#00BCD4', 'white'],
+    'X': ['#FFC107', 'black'],
+    'XI': ['#FF9800', 'black'],
+    'XII': ['#FF5722', 'white'],
+    'XIII': ['#795548', 'white'],
+    'XIV': ['#3949AB', 'white'],
+    'XV': ['#C0CA33', 'black'],
+    'XVI': ['#07F87F', 'black'],
+    'XVII': ['#FF6262', 'white'],
+    'XVIII': ['#718792', 'white'],
+    'XIX': ['#00ECB9', 'black'],
+    'XX': ['#FF20A3', 'black'],
+    'XXI': ['#FFCE38', 'black'],
+    'XXII': ['#721F01', 'white']
+};
+const getColor = (c) => exports.colors[c] || [c, 'white'];
+function getMarks(contentProvider, colorProvider) {
+    return {
+        em: {
+            parseDOM: [{ tag: 'i' }, { tag: 'em' },
+                { style: 'font-style', getAttrs: value => value === 'italic' && null }],
+            toDOM() {
+                return ['em'];
+            }
+        },
+        strong: {
+            parseDOM: [{ tag: 'b' }, { tag: 'strong' }, { style: 'font-weight', getAttrs: value => /^(bold(er)?|[5-9]\d{2,})$/.test(value) && null }],
+            toDOM() {
+                return ['strong'];
+            }
+        },
+        link: {
+            attrs: {
+                href: {},
+                title: { default: null }
+            },
+            inclusive: false,
+            parseDOM: [{
+                    tag: 'span[data-href]',
+                    getAttrs(dom) {
+                        const el = dom;
+                        return { href: el.dataset.href, title: el.dataset.title };
+                    }
+                }],
+            toDOM(node) {
+                const urls = node.attrs.href;
+                if (urls) {
+                    const refs = urls.split(',').map(url => {
+                        let pos = url.indexOf('://');
+                        const protocol = url.substring(0, pos);
+                        const code = url.substring(pos + 3);
+                        let parts = protocol.split('-');
+                        const category = parts[0];
+                        const type = parts[1];
+                        return { category, type, code };
+                    });
+                    const codes = refs.filter(x => x.category === 'c');
+                    const ilinks = refs.filter(x => x.category === 'i');
+                    const classes = (refs.some(x => x.category === 'x') ? ['ext-link'] : []).concat(codes.length ? [`code-count-${codes.length}`] : []);
+                    const dataAttributes = (codes.length ? [{ 'data-content': contentProvider(codes) }] : [])
+                        .concat(ilinks.map((c, idx) => ({ [`data-link-color-${idx}`]: colorProvider(c.type, c.code, false) })));
+                    const styles = codes.map((c, idx) => {
+                        const color = getColor(colorProvider(c.type, c.code, true));
+                        return (`--bg-code-color-${idx + 1}: ${color[0]}; --text-code-color-${idx + 1}: ${color[1]};`);
+                    });
+                    return ['span', dataAttributes.reduce((acc, da) => Object.assign(da, acc), {
+                            ['data-href']: node.attrs.href,
+                            ['data-title']: node.attrs.title,
+                            'class': classes.join(' '),
+                            'style': styles.join('')
+                        })];
+                }
+                return ['span', { ['data-href']: node.attrs.href, ['data-title']: node.attrs.title }];
+            }
+        }
+    };
+}
+exports.getMarks = getMarks;

package/lib/components/iqr-text-field/schema/date-time-schema.d.ts

@@ -0,0 +1,7 @@
+import { SchemaSpec } from 'prosemirror-model';
+export declare type DateSchema = 'date';
+export declare type TimeSchema = 'time';
+export declare type DateTimeSchema = 'date-time';
+export declare function getDateSpec(): SchemaSpec;
+export declare function getTimeSpec(): SchemaSpec;
+export declare function getDateTimeSpec(): SchemaSpec;

package/lib/components/iqr-text-field/schema/date-time-schema.js

@@ -0,0 +1,88 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDateTimeSpec = exports.getTimeSpec = exports.getDateSpec = void 0;
+function getDateSpec() {
+    return {
+        topNode: 'paragraph',
+        nodes: {
+            paragraph: {
+                content: 'date',
+            },
+            date: {
+                content: 'inline*',
+                group: 'block',
+                parseDOM: [{ tag: 'span' }],
+                toDOM() {
+                    return ['span', 0];
+                },
+                regexp: '[0-9]',
+                mask: '--/--/----'
+            },
+            text: {
+                group: 'inline'
+            }
+        },
+        marks: {}
+    };
+}
+exports.getDateSpec = getDateSpec;
+function getTimeSpec() {
+    return {
+        topNode: 'paragraph',
+        nodes: {
+            paragraph: {
+                content: 'time',
+            },
+            time: {
+                content: 'inline*',
+                group: 'block',
+                parseDOM: [{ tag: 'span' }],
+                toDOM() {
+                    return ['span', 0];
+                },
+                regexp: '[0-9]',
+                mask: '--:--:--'
+            },
+            text: {
+                group: 'inline'
+            }
+        },
+        marks: {}
+    };
+}
+exports.getTimeSpec = getTimeSpec;
+function getDateTimeSpec() {
+    return {
+        topNode: 'paragraph',
+        nodes: {
+            paragraph: {
+                content: 'date time',
+            },
+            date: {
+                content: 'inline*',
+                group: 'block',
+                parseDOM: [{ tag: 'span' }],
+                toDOM() {
+                    return ['span', { class: 'date' }, 0];
+                },
+                regexp: '[0-9]',
+                mask: '--/--/----'
+            },
+            time: {
+                content: 'inline*',
+                group: 'block',
+                parseDOM: [{ tag: 'span' }],
+                toDOM() {
+                    return ['span', { class: 'time' }, 0];
+                },
+                regexp: '[0-9]',
+                mask: '--:--:--'
+            },
+            text: {
+                group: 'inline'
+            }
+        },
+        marks: {}
+    };
+}
+exports.getDateTimeSpec = getDateTimeSpec;

package/lib/components/iqr-text-field/schema/decimal-schema.d.ts

@@ -0,0 +1,3 @@
+import { SchemaSpec } from 'prosemirror-model';
+export declare type DecimalSchema = 'decimal';
+export declare function getDecimalSpec(): SchemaSpec;

package/lib/components/iqr-text-field/schema/decimal-schema.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDecimalSpec = void 0;
+function getDecimalSpec() {
+    return {
+        topNode: 'paragraph',
+        nodes: {
+            paragraph: {
+                content: 'decimal',
+            },
+            decimal: {
+                content: 'inline*',
+                group: 'block',
+                parseDOM: [{ tag: 'span' }],
+                toDOM() {
+                    return ['span', 0];
+                },
+                regexp: '[,. 0-9-]'
+            },
+            text: {
+                group: 'inline'
+            }
+        },
+        marks: {}
+    };
+}
+exports.getDecimalSpec = getDecimalSpec;

package/lib/components/iqr-text-field/schema/index.d.ts

@@ -0,0 +1,11 @@
+import { Schema } from 'prosemirror-model';
+import { DocumentSchema, InlineSchema, StyledSchema } from "./markdown-schema";
+import { DateSchema, DateTimeSchema, TimeSchema } from "./date-time-schema";
+import { TokensSchema } from "./token-schema";
+import { MeasureSchema } from "./measure-schema";
+import { DecimalSchema } from "./decimal-schema";
+export declare type IqrTextFieldSchema = DocumentSchema | TokensSchema | StyledSchema | InlineSchema | DateSchema | TimeSchema | DateTimeSchema | DecimalSchema | MeasureSchema;
+export declare function createSchema(type: IqrTextFieldSchema, colorProvider: (type: string, code: string, isCode: boolean) => string, contentProvider: (codes: {
+    type: string;
+    code: string;
+}[]) => string): Schema<any, any>;

package/lib/components/iqr-text-field/schema/index.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createSchema = void 0;
+const prosemirror_model_1 = require("prosemirror-model");
+const markdown_schema_1 = require("./markdown-schema");
+const date_time_schema_1 = require("./date-time-schema");
+const token_schema_1 = require("./token-schema");
+const measure_schema_1 = require("./measure-schema");
+const decimal_schema_1 = require("./decimal-schema");
+function createSchema(type, colorProvider, contentProvider) {
+    return new prosemirror_model_1.Schema(type === 'decimal' ? decimal_schema_1.getDecimalSpec() :
+        type === 'measure' ? measure_schema_1.getMeasureSpec() :
+            type === 'date' ? date_time_schema_1.getDateSpec() :
+                type === 'time' ? date_time_schema_1.getTimeSpec() :
+                    type === 'date-time' ? date_time_schema_1.getDateTimeSpec() :
+                        type === 'tokens-list' || type === 'styled-tokens-list' || type === 'tokens-list-with-codes' || type === 'styled-tokens-list-with-codes' ? token_schema_1.getTokensSpec(type, contentProvider, colorProvider) : markdown_schema_1.getMarkdownSpec(type, contentProvider, colorProvider));
+}
+exports.createSchema = createSchema;

package/lib/components/iqr-text-field/schema/markdown-schema.d.ts

@@ -0,0 +1,8 @@
+import { SchemaSpec } from 'prosemirror-model';
+export declare type DocumentSchema = 'text-document';
+export declare type InlineSchema = 'styled-text' | 'text' | 'text-with-codes' | 'styled-text-with-codes';
+export declare type StyledSchema = 'text-document' | 'styled-text' | 'styled-text-with-codes';
+export declare function getMarkdownSpec(type: DocumentSchema | InlineSchema, contentProvider: (codes: {
+    type: string;
+    code: string;
+}[]) => string, colorProvider: (type: string, code: string, isCode: boolean) => string): SchemaSpec;