@pdfme/schemas
Version:
TypeScript base PDF generator and React base UI. Open source, developed by the community, and completely free to use under the MIT license!
105 lines • 4.07 kB
JavaScript
import { getFallbackFontName, DEFAULT_FONT_NAME } from '@pdfme/common';
import { getDefaultCellStyles, getCellPropPanelSchema, getColumnStylesPropPanelSchema, } from './helper.js';
import { HEX_COLOR_PATTERN } from '../constants.js';
export const propPanel = {
schema: ({ activeSchema, options, i18n }) => {
// @ts-expect-error Type casting is necessary here as the activeSchema type is generic
const tableSchema = activeSchema;
const head = tableSchema.head || [];
const showHead = tableSchema.showHead || false;
const font = options.font || { [DEFAULT_FONT_NAME]: { data: '', fallback: true } };
const fontNames = Object.keys(font);
const fallbackFontName = getFallbackFontName(font);
return {
showHead: {
title: i18n('schemas.table.showHead'),
type: 'boolean',
widget: 'checkbox',
span: 12,
},
repeatHead: {
title: i18n('schemas.table.repeatHead'),
type: 'boolean',
widget: 'checkbox',
span: 12,
},
'-------': { type: 'void', widget: 'Divider' },
tableStyles: {
title: i18n('schemas.table.tableStyle'),
type: 'object',
widget: 'Card',
span: 24,
properties: {
borderWidth: {
title: i18n('schemas.borderWidth'),
type: 'number',
widget: 'inputNumber',
props: { min: 0, step: 0.1 },
step: 1,
},
borderColor: {
title: i18n('schemas.borderColor'),
type: 'string',
widget: 'color',
props: {
disabledAlpha: true,
},
rules: [{ pattern: HEX_COLOR_PATTERN, message: i18n('validation.hexColor') }],
},
},
},
headStyles: {
hidden: !showHead,
title: i18n('schemas.table.headStyle'),
type: 'object',
widget: 'Card',
span: 24,
properties: getCellPropPanelSchema({ i18n, fallbackFontName, fontNames }),
},
bodyStyles: {
title: i18n('schemas.table.bodyStyle'),
type: 'object',
widget: 'Card',
span: 24,
properties: getCellPropPanelSchema({ i18n, fallbackFontName, fontNames, isBody: true }),
},
columnStyles: {
title: i18n('schemas.table.columnStyle'),
type: 'object',
widget: 'Card',
span: 24,
properties: getColumnStylesPropPanelSchema({ head, i18n }),
},
};
},
defaultSchema: {
name: '',
type: 'table',
position: { x: 0, y: 0 },
width: 150,
height: 20,
content: JSON.stringify([
['Alice', 'New York', 'Alice is a freelance web designer and developer'],
['Bob', 'Paris', 'Bob is a freelance illustrator and graphic designer'],
]),
showHead: true,
repeatHead: false,
head: ['Name', 'City', 'Description'],
headWidthPercentages: [30, 30, 40],
tableStyles: {
borderColor: '#000000',
borderWidth: 0.3,
},
headStyles: Object.assign(getDefaultCellStyles(), {
fontColor: '#ffffff',
backgroundColor: '#2980ba',
borderColor: '',
borderWidth: { top: 0, right: 0, bottom: 0, left: 0 },
}),
bodyStyles: Object.assign(getDefaultCellStyles(), {
alternateBackgroundColor: '#f5f5f5',
}),
columnStyles: {},
},
};
//# sourceMappingURL=propPanel.js.map