@pdfme/schemas 3.1.5-dev.9 → 3.2.0

package/src/image/uiRender.ts

@@ -1,121 +0,0 @@
-import type { ChangeEvent } from 'react';
-import type * as CSS from 'csstype';
-import type { ImageSchema } from './types';
-import { UIRenderProps, ZOOM } from '@pdfme/common';
-import { addAlphaToHex, isEditable } from '../renderUtils.js';
-
-const fullSize = { width: '100%', height: '100%' };
-
-const readFile = (input: File | FileList | null): Promise<string | ArrayBuffer> =>
-  new Promise((resolve, reject) => {
-    const fileReader = new FileReader();
-
-    fileReader.onload = (e) => {
-      if (e.target?.result) {
-        resolve(e.target.result);
-      }
-    };
-
-    fileReader.onerror = (e) => {
-      reject(new Error('[@pdfme/schemas] File reading failed'));
-    };
-
-    let file: File | null = null;
-    if (input instanceof FileList && input.length > 0) {
-      file = input[0];
-    } else if (input instanceof File) {
-      file = input;
-    }
-
-    if (file) {
-      fileReader.readAsDataURL(file);
-    } else {
-      reject(new Error('[@pdfme/schemas] No files provided'));
-    }
-  });
-
-export const uiRender = async (arg: UIRenderProps<ImageSchema>) => {
-  const { value, rootElement, mode, onChange, stopEditing, tabIndex, placeholder, schema, theme } =
-    arg;
-  const editable = isEditable(mode);
-
-  const size = { width: schema.width * ZOOM, height: schema.height * ZOOM };
-
-  const container = document.createElement('div');
-  const backgroundStyle = placeholder ? `url(${placeholder})` : 'none';
-  const containerStyle: CSS.Properties = {
-    ...fullSize,
-    backgroundImage: value ? 'none' : backgroundStyle,
-    backgroundSize: `${size.width}px ${size.height}px`,
-  };
-  Object.assign(container.style, containerStyle);
-  container.addEventListener('click', (e) => {
-    if (editable) {
-      e.stopPropagation();
-    }
-  });
-  rootElement.appendChild(container);
-
-  // image tag
-  if (value) {
-    const img = document.createElement('img');
-    const imgStyle: CSS.Properties = { height: '100%', width: '100%', borderRadius: 0 };
-    Object.assign(img.style, imgStyle);
-    img.src = value;
-    container.appendChild(img);
-  }
-
-  // remove button
-  if (value && editable) {
-    const button = document.createElement('button');
-    button.textContent = 'x';
-    const buttonStyle: CSS.Properties = {
-      position: 'absolute',
-      top: 0,
-      left: 0,
-      zIndex: 1,
-      display: 'flex',
-      justifyContent: 'center',
-      alignItems: 'center',
-      color: '#333',
-      background: '#f2f2f2',
-      borderRadius: '2px',
-      border: '1px solid #767676',
-      cursor: 'pointer',
-      height: '24px',
-      width: '24px',
-    };
-    Object.assign(button.style, buttonStyle);
-    button.addEventListener('click', () => {
-      onChange && onChange('');
-    });
-    container.appendChild(button);
-  }
-
-  // file input
-  if (!value && editable) {
-    const label = document.createElement('label');
-    const labelStyle: CSS.Properties = {
-      ...fullSize,
-      display: editable ? 'flex' : 'none',
-      position: 'absolute',
-      top: 0,
-      backgroundColor: editable || value ? addAlphaToHex(theme.colorPrimaryBg, 30) : 'none',
-      cursor: 'pointer',
-    };
-    Object.assign(label.style, labelStyle);
-    container.appendChild(label);
-    const input = document.createElement('input');
-    const inputStyle: CSS.Properties = { ...fullSize, position: 'absolute', top: '50%' };
-    Object.assign(input.style, inputStyle);
-    input.tabIndex = tabIndex || 0;
-    input.type = 'file';
-    input.accept = 'image/jpeg, image/png';
-    input.addEventListener('change', (event: Event) => {
-      const changeEvent = event as unknown as ChangeEvent<HTMLInputElement>;
-      readFile(changeEvent.target.files).then((result) => onChange && onChange(result as string));
-    });
-    input.addEventListener('blur', () => stopEditing && stopEditing());
-    label.appendChild(input);
-  }
-};

package/src/line/constants.ts

@@ -1 +0,0 @@
-export const DEFAULT_LINE_COLOR = '#000000';

package/src/line/index.ts

@@ -1,8 +0,0 @@
-import type { Plugin } from '@pdfme/common';
-import { pdfRender } from './pdfRender.js';
-import { propPanel } from './propPanel.js';
-import { uiRender } from './uiRender.js';
-import type { LineSchema } from './types.js';
-
-const schema: Plugin<LineSchema> = { pdf: pdfRender, ui: uiRender, propPanel };
-export default schema;

package/src/line/pdfRender.ts

@@ -1,24 +0,0 @@
-import type { PDFRenderProps } from '@pdfme/common';
-import type { LineSchema } from './types';
-import { rotatePoint, convertForPdfLayoutProps, hex2RgbColor } from '../renderUtils.js';
-import { DEFAULT_LINE_COLOR } from './constants.js';
-
-export const pdfRender = (arg: PDFRenderProps<LineSchema>) => {
-  const { page, schema } = arg;
-  const pageHeight = page.getHeight();
-  const {
-    width,
-    height,
-    rotate,
-    position: { x, y },
-    opacity,
-  } = convertForPdfLayoutProps({ schema, pageHeight, applyRotateTranslate: false });
-  const pivot = { x: x + width / 2, y: y + height / 2 };
-  page.drawLine({
-    start: rotatePoint({ x, y: y + height / 2 }, pivot, rotate.angle),
-    end: rotatePoint({ x: x + width, y: y + height / 2 }, pivot, rotate.angle),
-    thickness: height,
-    color: hex2RgbColor(schema.color ?? DEFAULT_LINE_COLOR),
-    opacity: opacity,
-  });
-};

package/src/line/propPanel.ts

@@ -1,34 +0,0 @@
-import { PropPanel } from '@pdfme/common';
-import type { LineSchema } from './types';
-import { HEX_COLOR_PATTERN } from '../constants.js';
-import { DEFAULT_LINE_COLOR } from './constants.js';
-
-export const propPanel: PropPanel<LineSchema> = {
-  schema: ({ i18n }) => {
-    return {
-      color: {
-        title: i18n('schemas.line.color'),
-        type: 'string',
-        widget: 'color',
-        required: true,
-        rules: [
-          {
-            pattern: HEX_COLOR_PATTERN,
-            message: i18n('hexColorPrompt'),
-          },
-        ],
-      },
-    };
-  },
-  defaultValue: '',
-  defaultSchema: {
-    type: 'line',
-    position: { x: 0, y: 0 },
-    width: 50,
-    height: 1,
-    rotate: 0,
-    opacity: 1,
-    readOnly: true,
-    color: DEFAULT_LINE_COLOR,
-  },
-};

package/src/line/types.ts

@@ -1,5 +0,0 @@
-import { Schema } from '@pdfme/common';
-
-export interface LineSchema extends Schema {
-  color: string;
-}

package/src/line/uiRender.ts

@@ -1,12 +0,0 @@
-import type { LineSchema } from './types';
-import { UIRenderProps } from '@pdfme/common';
-import { DEFAULT_LINE_COLOR } from './constants.js';
-
-export const uiRender = (arg: UIRenderProps<LineSchema>) => {
-  const { schema, rootElement } = arg;
-  const div = document.createElement('div');
-  div.style.backgroundColor = schema.color ?? DEFAULT_LINE_COLOR;
-  div.style.width = '100%';
-  div.style.height = '100%';
-  rootElement.appendChild(div);
-};