@pdfme/ui 1.0.18 → 1.1.0

package/dist/esm/src/components/Schemas/BarcodeSchema.js

@@ -0,0 +1,79 @@
+import React, { forwardRef } from 'react';
+import { validateBarcodeInput } from '@pdfme/common';
+import { ZOOM } from '../../constants.js';
+import ean8 from '../../assets/barcodeExamples/ean8.png';
+import ean13 from '../../assets/barcodeExamples/ean13.png';
+import code39 from '../../assets/barcodeExamples/code39.png';
+import code128 from '../../assets/barcodeExamples/code128.png';
+import nw7 from '../../assets/barcodeExamples/nw7.png';
+import itf14 from '../../assets/barcodeExamples/itf14.png';
+import japanpost from '../../assets/barcodeExamples/japanpost.png';
+import qrcode from '../../assets/barcodeExamples/qrcode.png';
+import upca from '../../assets/barcodeExamples/upca.png';
+import upce from '../../assets/barcodeExamples/upce.png';
+const barcodeExampleImageObj = {
+    qrcode,
+    japanpost,
+    ean13,
+    ean8,
+    code39,
+    code128,
+    nw7,
+    itf14,
+    upca,
+    upce,
+};
+const SampleBarcode = ({ schema }) => (React.createElement("img", { style: {
+        width: schema.width * ZOOM,
+        height: schema.height * ZOOM,
+        position: 'absolute',
+        borderRadius: 0,
+        opacity: 0.5,
+    }, src: barcodeExampleImageObj[schema.type] }));
+const ErrorBarcode = () => (React.createElement("div", { style: { display: 'flex', alignItems: 'center', justifyContent: 'center', height: '100%' } },
+    React.createElement("span", { style: {
+            color: 'white',
+            background: 'red',
+            padding: '0.25rem',
+            fontSize: '12pt',
+            fontWeight: 'bold',
+            borderRadius: 2,
+        } }, "ERROR")));
+const BarcodePreview = (props) => {
+    const { schema, value } = props;
+    if (value.length === 0) {
+        return null;
+    }
+    return validateBarcodeInput(schema.type, value) ? (React.createElement(SampleBarcode, { schema: schema })) : (React.createElement(ErrorBarcode, null));
+};
+const BarcodeSchemaUI = ({ schema, editable, placeholder, tabIndex, onChange }, ref) => {
+    const value = schema.data;
+    const style = {
+        textAlign: 'center',
+        position: 'absolute',
+        zIndex: 2,
+        fontSize: '1rem',
+        color: '#000',
+        height: Number(schema.height) * ZOOM,
+        width: Number(schema.width) * ZOOM,
+        backgroundColor: editable || value ? 'rgb(242 244 255 / 75%)' : 'none',
+        border: 'none',
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        overflow: 'auto',
+    };
+    return (React.createElement("div", { style: {
+            width: '100%',
+            height: '100%',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            fontFamily: "'Open Sans', sans-serif",
+        } },
+        editable ? (React.createElement("input", { ref: ref, tabIndex: tabIndex, placeholder: placeholder, style: style, value: value, onChange: (e) => onChange(e.target.value) })) : (React.createElement("div", { style: style },
+            React.createElement("span", null, value))),
+        React.createElement(BarcodePreview, { value: value, schema: schema })));
+};
+export default forwardRef(BarcodeSchemaUI);
+//# sourceMappingURL=BarcodeSchema.js.map

package/dist/esm/src/components/Schemas/BarcodeSchema.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BarcodeSchema.js","sourceRoot":"","sources":["../../../../../src/components/Schemas/BarcodeSchema.tsx"],"names":[],"mappings":"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"}

package/dist/esm/src/components/Schemas/ImageSchema.js

@@ -0,0 +1,47 @@
+import React, { useState, forwardRef } from 'react';
+import { readFiles } from '../../helper.js';
+import { ZOOM } from '../../constants.js';
+import { XMarkIcon } from '@heroicons/react/24/outline';
+const ImageSchemaUI = (props, ref) => {
+    const { editable, placeholder, tabIndex, schema, onChange } = props;
+    const [fileName, setFileName] = useState('');
+    const hasData = Boolean(schema.data);
+    const size = { width: schema.width * ZOOM, height: schema.height * ZOOM };
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { style: Object.assign(Object.assign({}, size), { opacity: hasData ? 1 : 0.5, backgroundImage: hasData || !editable ? 'none' : `url(${placeholder})`, backgroundSize: `${size.width}px ${size.height}px` }), onClick: (e) => {
+                if (editable) {
+                    e.stopPropagation();
+                }
+            } },
+            hasData && React.createElement("img", { style: Object.assign(Object.assign({}, size), { borderRadius: 0 }), src: schema.data }),
+            hasData && editable && (React.createElement("button", { tabIndex: tabIndex, style: {
+                    position: 'absolute',
+                    top: 0,
+                    left: 0,
+                    zIndex: 1,
+                    display: 'flex',
+                    justifyContent: 'center',
+                    alignItems: 'center',
+                    color: '#333',
+                    background: '#f2f2f2',
+                    borderRadius: 2,
+                    border: '1px solid #767676',
+                    cursor: 'pointer',
+                    height: 20,
+                    width: 20,
+                }, "aria-label": "close", onClick: () => {
+                    setFileName('');
+                    onChange('');
+                } },
+                React.createElement(XMarkIcon, { width: 10, height: 10 })))),
+        React.createElement("label", { style: {
+                display: editable ? 'flex' : 'none',
+                position: 'absolute',
+                top: '50%',
+                width: '100%',
+                cursor: 'pointer',
+            } },
+            React.createElement("input", { ref: ref, tabIndex: tabIndex, value: fileName, onChange: (event) => readFiles(event.target.files, 'dataURL').then((result) => onChange(result)), type: "file", accept: "image/jpeg, image/png" }))));
+};
+export default forwardRef(ImageSchemaUI);
+//# sourceMappingURL=ImageSchema.js.map

package/dist/esm/src/components/Schemas/ImageSchema.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageSchema.js","sourceRoot":"","sources":["../../../../../src/components/Schemas/ImageSchema.tsx"],"names":[],"mappings":"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"}

package/dist/esm/src/components/Schemas/SchemaUI.js

@@ -0,0 +1,27 @@
+import React, { forwardRef } from 'react';
+import { isTextSchema, isImageSchema, isBarcodeSchema } from '@pdfme/common';
+import { ZOOM, SELECTABLE_CLASSNAME } from '../../constants.js';
+import TextSchema from './TextSchema.js';
+import ImageSchema from './ImageSchema.js';
+import BarcodeSchema from './BarcodeSchema.js';
+const Wrapper = ({ children, border, onChangeHoveringSchemaId, schema, }) => (React.createElement("div", { title: schema.key, onMouseEnter: () => onChangeHoveringSchemaId && onChangeHoveringSchemaId(schema.id), onMouseLeave: () => onChangeHoveringSchemaId && onChangeHoveringSchemaId(null), className: SELECTABLE_CLASSNAME, id: schema.id, style: {
+        position: 'absolute',
+        cursor: 'pointer',
+        height: schema.height * ZOOM,
+        width: schema.width * ZOOM,
+        top: schema.position.y * ZOOM,
+        left: schema.position.x * ZOOM,
+        border,
+    } }, children));
+const SchemaUI = (props, ref) => {
+    const r = {
+        [props.editable ? 'ref' : '']: ref,
+    };
+    const { schema } = props;
+    return (React.createElement(Wrapper, Object.assign({}, props),
+        isTextSchema(schema) && React.createElement(TextSchema, Object.assign({}, r, props, { schema: schema })),
+        isImageSchema(schema) && React.createElement(ImageSchema, Object.assign({}, r, props, { schema: schema })),
+        isBarcodeSchema(schema) && React.createElement(BarcodeSchema, Object.assign({}, r, props, { schema: schema }))));
+};
+export default forwardRef(SchemaUI);
+//# sourceMappingURL=SchemaUI.js.map

package/dist/esm/src/components/Schemas/SchemaUI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaUI.js","sourceRoot":"","sources":["../../../../../src/components/Schemas/SchemaUI.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAA6B,MAAM,OAAO,CAAC;AACrE,OAAO,EAAe,YAAY,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAC1F,OAAO,EAAE,IAAI,EAAE,oBAAoB,EAAE,MAAM,oBAAoB,CAAC;AAChE,OAAO,UAAU,MAAM,iBAAiB,CAAC;AACzC,OAAO,WAAW,MAAM,kBAAkB,CAAC;AAC3C,OAAO,aAAa,MAAM,oBAAoB,CAAC;AAe/C,MAAM,OAAO,GAAG,CAAC,EACf,QAAQ,EACR,MAAM,EACN,wBAAwB,EACxB,MAAM,GAC0B,EAAE,EAAE,CAAC,CACrC,6BACE,KAAK,EAAE,MAAM,CAAC,GAAG,EACjB,YAAY,EAAE,GAAG,EAAE,CAAC,wBAAwB,IAAI,wBAAwB,CAAC,MAAM,CAAC,EAAE,CAAC,EACnF,YAAY,EAAE,GAAG,EAAE,CAAC,wBAAwB,IAAI,wBAAwB,CAAC,IAAI,CAAC,EAC9E,SAAS,EAAE,oBAAoB,EAC/B,EAAE,EAAE,MAAM,CAAC,EAAE,EACb,KAAK,EAAE;QACL,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,SAAS;QACjB,MAAM,EAAE,MAAM,CAAC,MAAM,GAAG,IAAI;QAC5B,KAAK,EAAE,MAAM,CAAC,KAAK,GAAG,IAAI;QAC1B,GAAG,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,GAAG,IAAI;QAC7B,IAAI,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,GAAG,IAAI;QAC9B,MAAM;KACP,IAEA,QAAQ,CACL,CACP,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,KAAY,EAAE,GAAgD,EAAE,EAAE;IAClF,MAAM,CAAC,GAAG;QACR,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,GAAwD;KACxF,CAAC;IACF,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAEzB,OAAO,CACL,oBAAC,OAAO,oBAAK,KAAK;QACf,YAAY,CAAC,MAAM,CAAC,IAAI,oBAAC,UAAU,oBAAK,CAAC,EAAM,KAAK,IAAE,MAAM,EAAE,MAAM,IAAI;QACxE,aAAa,CAAC,MAAM,CAAC,IAAI,oBAAC,WAAW,oBAAK,CAAC,EAAM,KAAK,IAAE,MAAM,EAAE,MAAM,IAAI;QAC1E,eAAe,CAAC,MAAM,CAAC,IAAI,oBAAC,aAAa,oBAAK,CAAC,EAAM,KAAK,IAAE,MAAM,EAAE,MAAM,IAAI,CACvE,CACX,CAAC;AACJ,CAAC,CAAC;AACF,eAAe,UAAU,CAAgD,QAAQ,CAAC,CAAC"}

package/dist/esm/src/components/Schemas/TextSchema.js

@@ -0,0 +1,29 @@
+import React, { forwardRef } from 'react';
+import { DEFAULT_FONT_SIZE, DEFAULT_ALIGNMENT, DEFAULT_LINE_HEIGHT, DEFAULT_CHARACTER_SPACING, DEFAULT_FONT_COLOR, } from '@pdfme/common';
+import { ZOOM } from '../../constants.js';
+const TextSchemaUI = ({ schema, editable, placeholder, tabIndex, onChange }, ref) => {
+    var _a, _b, _c, _d, _e;
+    const style = {
+        padding: 0,
+        resize: 'none',
+        position: 'absolute',
+        fontFamily: schema.fontName ? `'${schema.fontName}'` : 'inherit',
+        height: schema.height * ZOOM,
+        // Increase the width by 1 point. (0.75 pixels)
+        width: (schema.width + ((_a = schema.characterSpacing) !== null && _a !== void 0 ? _a : DEFAULT_CHARACTER_SPACING) * 0.75) * ZOOM,
+        textAlign: (_b = schema.alignment) !== null && _b !== void 0 ? _b : DEFAULT_ALIGNMENT,
+        fontSize: `${(_c = schema.fontSize) !== null && _c !== void 0 ? _c : DEFAULT_FONT_SIZE}pt`,
+        letterSpacing: `${(_d = schema.characterSpacing) !== null && _d !== void 0 ? _d : DEFAULT_CHARACTER_SPACING}pt`,
+        lineHeight: `${(_e = schema.lineHeight) !== null && _e !== void 0 ? _e : DEFAULT_LINE_HEIGHT}em`,
+        whiteSpace: 'pre-line',
+        wordBreak: 'break-all',
+        border: 'none',
+        color: schema.fontColor ? schema.fontColor : DEFAULT_FONT_COLOR,
+        backgroundColor: schema.data && schema.backgroundColor ? schema.backgroundColor : 'rgb(242 244 255 / 75%)',
+    };
+    return editable ? (React.createElement("textarea", { ref: ref, placeholder: placeholder, tabIndex: tabIndex, style: style, onChange: (e) => onChange(e.target.value), value: schema.data })) : (React.createElement("div", { style: style }, schema.data.split('').map((l, i) => (React.createElement("span", { key: i, style: {
+            letterSpacing: String(schema.data).length === i + 1 ? 0 : 'inherit',
+        } }, l)))));
+};
+export default forwardRef(TextSchemaUI);
+//# sourceMappingURL=TextSchema.js.map

package/dist/esm/src/components/Schemas/TextSchema.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextSchema.js","sourceRoot":"","sources":["../../../../../src/components/Schemas/TextSchema.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAO,MAAM,OAAO,CAAC;AAC/C,OAAO,EACL,iBAAiB,EACjB,iBAAiB,EACjB,mBAAmB,EACnB,yBAAyB,EACzB,kBAAkB,GAEnB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAI1C,MAAM,YAAY,GAAG,CACnB,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAS,EAC5D,GAA6B,EAC7B,EAAE;;IACF,MAAM,KAAK,GAAwB;QACjC,OAAO,EAAE,CAAC;QACV,MAAM,EAAE,MAAM;QACd,QAAQ,EAAE,UAAU;QACpB,UAAU,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,MAAM,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC,SAAS;QAChE,MAAM,EAAE,MAAM,CAAC,MAAM,GAAG,IAAI;QAC5B,+CAA+C;QAC/C,KAAK,EAAE,CAAC,MAAM,CAAC,KAAK,GAAG,CAAC,MAAA,MAAM,CAAC,gBAAgB,mCAAI,yBAAyB,CAAC,GAAG,IAAI,CAAC,GAAG,IAAI;QAC5F,SAAS,EAAE,MAAA,MAAM,CAAC,SAAS,mCAAI,iBAAiB;QAChD,QAAQ,EAAE,GAAG,MAAA,MAAM,CAAC,QAAQ,mCAAI,iBAAiB,IAAI;QACrD,aAAa,EAAE,GAAG,MAAA,MAAM,CAAC,gBAAgB,mCAAI,yBAAyB,IAAI;QAC1E,UAAU,EAAE,GAAG,MAAA,MAAM,CAAC,UAAU,mCAAI,mBAAmB,IAAI;QAC3D,UAAU,EAAE,UAAU;QACtB,SAAS,EAAE,WAAW;QACtB,MAAM,EAAE,MAAM;QACd,KAAK,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,kBAAkB;QAC/D,eAAe,EACb,MAAM,CAAC,IAAI,IAAI,MAAM,CAAC,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,CAAC,wBAAwB;KAC5F,CAAC;IAEF,OAAO,QAAQ,CAAC,CAAC,CAAC,CAChB,kCACE,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACzC,KAAK,EAAE,MAAM,CAAC,IAAI,GACR,CACb,CAAC,CAAC,CAAC,CACF,6BAAK,KAAK,EAAE,KAAK,IAEd,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACnC,8BACE,GAAG,EAAE,CAAC,EACN,KAAK,EAAE;YACL,aAAa,EAAE,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;SACpE,IAEA,CAAC,CACG,CACR,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,UAAU,CAA6B,YAAY,CAAC,CAAC"}

package/dist/esm/src/components/Spinner.js

@@ -0,0 +1,26 @@
+import React from 'react';
+const Spinner = () => (React.createElement(React.Fragment, null,
+    React.createElement("style", null, `
+      @keyframes spin {
+        0% { transform: rotate(0deg) }
+        
+        100% { transform: rotate(359deg) }
+      }
+    `),
+    React.createElement("div", { style: {
+            width: '100%',
+            height: '100%',
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+        } },
+        React.createElement("div", { style: {
+                width: 65,
+                height: 65,
+                borderRadius: '50%',
+                border: '4px solid',
+                borderColor: '#4285f4 rgba(0,0,0,0.1) rgba(0,0,0,0.1)',
+                animation: 'spin 1s ease infinite',
+            } }))));
+export default Spinner;
+//# sourceMappingURL=Spinner.js.map

package/dist/esm/src/components/Spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../../../src/components/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,OAAO,GAAG,GAAG,EAAE,CAAC,CACpB;IACE,mCACG;;;;;;KAMF,CACO;IACR,6BACE,KAAK,EAAE;YACL,KAAK,EAAE,MAAM;YACb,MAAM,EAAE,MAAM;YACd,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;SACzB;QAED,6BACE,KAAK,EAAE;gBACL,KAAK,EAAE,EAAE;gBACT,MAAM,EAAE,EAAE;gBACV,YAAY,EAAE,KAAK;gBACnB,MAAM,EAAE,WAAW;gBACnB,WAAW,EAAE,yCAAyC;gBACtD,SAAS,EAAE,uBAAuB;aACnC,GACI,CACH,CACL,CACJ,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/esm/src/components/UnitPager.js

@@ -0,0 +1,58 @@
+import React from 'react';
+import { ChevronLeftIcon, ChevronDoubleLeftIcon, ChevronRightIcon, ChevronDoubleRightIcon, } from '@heroicons/react/24/outline';
+const buttonHeight = 38;
+const buttonWrapStyle = {
+    pointerEvents: 'initial',
+    position: 'sticky',
+    zIndex: 1,
+    backgroundColor: '#777777bd',
+    borderRadius: 2,
+    padding: '0.5rem',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-around',
+    boxSizing: 'border-box',
+    width: 110,
+    height: buttonHeight,
+};
+const btnStyle = {
+    cursor: 'pointer',
+    border: 'none',
+    background: 'none',
+    display: 'flex',
+    alignItems: 'center',
+};
+const UnitPager = ({ size, unitCursor, unitNum, setUnitCursor }) => {
+    if (unitNum <= 1)
+        return React.createElement(React.Fragment, null);
+    return (React.createElement("div", { style: Object.assign({ position: 'absolute' }, size) },
+        React.createElement("div", { style: {
+                position: 'sticky',
+                width: '100%',
+                zIndex: 1,
+                pointerEvents: 'none',
+                top: `calc(50% - ${buttonHeight / 2}px)`,
+                display: 'flex',
+                alignItems: 'center',
+            } },
+            unitCursor > 0 && (React.createElement("div", { style: Object.assign({ left: '1rem', marginLeft: '1rem' }, buttonWrapStyle) },
+                React.createElement("button", { style: Object.assign({ paddingLeft: '0.5rem' }, btnStyle), disabled: unitCursor <= 0, onClick: () => setUnitCursor(0) },
+                    React.createElement(ChevronDoubleLeftIcon, { width: 20, height: 20, color: '#fff' })),
+                React.createElement("button", { style: Object.assign({ paddingLeft: '0.5rem' }, btnStyle), disabled: unitCursor <= 0, onClick: () => setUnitCursor(unitCursor - 1) },
+                    React.createElement(ChevronLeftIcon, { width: 20, height: 20, color: '#fff' })),
+                React.createElement("strong", { style: { color: 'white', fontSize: '0.9rem' } },
+                    unitCursor + 1,
+                    "/",
+                    unitNum))),
+            unitCursor + 1 < unitNum && (React.createElement("div", { style: Object.assign({ right: '1rem', marginLeft: 'auto', marginRight: '1rem' }, buttonWrapStyle) },
+                React.createElement("strong", { style: { color: 'white', fontSize: '0.9rem' } },
+                    unitCursor + 1,
+                    "/",
+                    unitNum),
+                React.createElement("button", { style: Object.assign({ paddingRight: '0.5rem' }, btnStyle), disabled: unitCursor + 1 >= unitNum, onClick: () => setUnitCursor(unitCursor + 1) },
+                    React.createElement(ChevronRightIcon, { width: 20, height: 20, color: '#fff' })),
+                React.createElement("button", { style: Object.assign({ paddingRight: '0.5rem' }, btnStyle), disabled: unitCursor + 1 >= unitNum, onClick: () => setUnitCursor(unitNum - 1) },
+                    React.createElement(ChevronDoubleRightIcon, { width: 20, height: 20, color: '#fff' })))))));
+};
+export default UnitPager;
+//# sourceMappingURL=UnitPager.js.map

package/dist/esm/src/components/UnitPager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnitPager.js","sourceRoot":"","sources":["../../../../src/components/UnitPager.tsx"],"names":[],"mappings":"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"}

package/dist/esm/src/constants.js

@@ -0,0 +1,7 @@
+export const DEFAULT_LANG = 'en';
+export const DESTROYED_ERR_MSG = 'this instance is already destroyed';
+export const ZOOM = 3.7795275591;
+export const SELECTABLE_CLASSNAME = 'selectable';
+export const RULER_HEIGHT = 30;
+export const SIDEBAR_WIDTH = 300;
+//# sourceMappingURL=constants.js.map

package/dist/esm/src/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../src/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,YAAY,GAAG,IAAa,CAAC;AAE1C,MAAM,CAAC,MAAM,iBAAiB,GAAG,oCAAoC,CAAC;AAEtE,MAAM,CAAC,MAAM,IAAI,GAAG,YAAY,CAAC;AAEjC,MAAM,CAAC,MAAM,oBAAoB,GAAG,YAAY,CAAC;AAEjD,MAAM,CAAC,MAAM,YAAY,GAAG,EAAE,CAAC;AAE/B,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,CAAC"}

package/dist/esm/src/contexts.js

@@ -0,0 +1,7 @@
+import { createContext } from 'react';
+import { curriedI18n } from './i18n.js';
+import { DEFAULT_LANG } from './constants.js';
+import { getDefaultFont } from '@pdfme/common';
+export const I18nContext = createContext(curriedI18n(DEFAULT_LANG));
+export const FontContext = createContext(getDefaultFont());
+//# sourceMappingURL=contexts.js.map

package/dist/esm/src/contexts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contexts.js","sourceRoot":"","sources":["../../../src/contexts.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC,CAAC;AAEpE,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAC,cAAc,EAAE,CAAC,CAAC"}