@mikezimm/fps-library-v2
Version:
Library of reusable typescript/javascript functions, interfaces and constants
133 lines (132 loc) • 5.2 kB
JavaScript
/**
* CodeAnalizerComment: Updated 2 imports on 2024-09-21 23:07:24
* Update:: import { ImageFit } to '@mikezimm/fps-core-v7/lib/types/@fluentUI/@7.199.1/Image;'
* Update:: import { ImageCoverStyle } to '@mikezimm/fps-core-v7/lib/types/@fluentUI/@7.199.1/Image;'
*/
import * as React from 'react';
import { Image, } from '@fluentui/react/lib/Image';
import { ImageFit, ImageCoverStyle } from '@fluentui/react/lib/Image';
import { ColoredLine } from './draw';
/**
*
* @param title Title string if required, can contain <above> or <below> anywhere to target location.
* @param styles Styles should be this limited structure: { color: 'htmlColor', height: 2 }
*/
export function MyDivider(title, styles) {
let color = styles.color ? styles.color : 'gray';
let height = styles.height ? styles.height : 1;
let dividerElements = [];
let divider = React.createElement("div", null,
React.createElement(ColoredLine, { color: color, height: height }));
let isAbove = title.toLowerCase().indexOf('<above>') > -1 ? true : false;
let isBelow = isAbove === false || title.toLowerCase().indexOf('<below>') > -1 ? true : false;
let titleElement = title != '' ? React.createElement("span", { style: { fontSize: 28 } },
" ",
title.replace(/\<above\>/gi, '').replace(/\<below\>/gi, ''),
" ") : null;
if (isAbove && titleElement != null) {
dividerElements.push(titleElement);
}
dividerElements.push(divider);
if (isBelow && titleElement != null) {
dividerElements.push(titleElement);
}
let thisDivider = React.createElement("div", { style: { width: '100%' } },
" ",
dividerElements.map(e => { return e; }));
return thisDivider;
}
export function MyText(type, title, styles) {
let myStyles = {};
if (styles && typeof styles === 'string') {
try {
myStyles = JSON.parse(styles);
}
catch (e) {
alert('Unable to parse JSON styles in MyText\n' + styles);
}
}
else if (styles) {
myStyles = styles;
}
if (type === 'h1') {
return React.createElement("h1", { style: myStyles },
" ",
title,
" ");
}
if (type === 'h2') {
return React.createElement("h2", { style: myStyles },
" ",
title,
" ");
}
if (type === 'h3') {
return React.createElement("h3", { style: myStyles },
" ",
title,
" ");
}
if (type === 'p') {
return React.createElement("p", { style: myStyles },
" ",
title,
" ");
}
if (type === 'span') {
return React.createElement("span", { style: myStyles },
" ",
title,
" ");
}
alert('If you are seeing this, there is a problem creating element: "MyText" \n' + title);
return null;
}
/**
*
* @param title
* @param src
* @param styles usable styles
* styles = {
* padding: 20, // padding is around entire image
* ImageFit: 0 | 1 | 2 | 3 | 4 | 5, // These would be the ImageFit types
* ImageCoverStyle: 0 | 1, // These would be the ImageCoverStyle types (landscape and portrait)
* height: 20,
* width: 20,
*
* }
*/
export function MyImage(title, src, styles, href) {
let thisImage = null;
thisImage = React.createElement("div", { style: {
padding: styles.padding ? styles.padding : null,
width: styles.width ? styles.width : null,
height: styles.height ? styles.height : null,
} },
React.createElement("a", { href: href, target: '_blank' },
React.createElement(Image, { title: title, src: src, shouldFadeIn: true, imageFit: styles.ImageFit ? styles.ImageFit : ImageFit.centerContain, coverStyle: styles.ImageCoverStyle ? styles.ImageCoverStyle : ImageCoverStyle.landscape, width: styles.width ? styles.width : null, height: styles.height ? styles.height : null })));
return thisImage;
}
export function convertTextToListItems(value, delim, leftPad, type) {
let result = value;
if (value !== null && value !== undefined && value.length > 0) {
let lines = value.split(delim);
if (lines.length > 0) {
result = lines.map(line => { return React.createElement("li", { style: { paddingLeft: 0 } }, line); });
if (type === 'ul') {
result = React.createElement("div", { style: { padding: 0 } },
React.createElement("ul", { style: { paddingLeft: leftPad, margin: 0 } },
result,
" "));
}
else if (type === 'ol') {
result = React.createElement("div", { style: { padding: 0 } },
React.createElement("ol", { style: { paddingLeft: leftPad, margin: 0 } },
result,
" "));
}
}
}
return result;
}
//# sourceMappingURL=basic.js.map