Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
getXrmP().then(xrm => {
const data = getURLParameter("data", document.location.search)
let params = {} as { addressEditorRunProps?: Partial }
try {
params = JSON.parse(data || "{}")
} catch (e) {
console.log(`${NAME}: Error parsing data object from url. Continuing.`, e)
}
props = R.mergeDeepRight(props, params.addressEditorRunProps || {}) as AddressEditorRunProps
const client = props.client || mkClient(xrm, API_POSTFIX)
const repo: CustomerAddressDAO = props.addressRepo || new CustomerAddressDAOImpl(client)
const className = mergeStyles(props.className, defaultStyles, props.styles)
const sec = new Security(client)
const metadatap = getEditorEntityMetadata(repo.metadata)
// todo Remove dependency on Page and rely on form context perhaps, also rely on metadata
const entityName = xrm.Page.data.entity.getEntityName()
const access = sec.userPrinicpalAccessForRecord(xrm.Utility.getGlobalContext().getUserId(),
entityName, cleanId(xrm.Page.data.entity.getId()))
const controller: DataController =
props.controller ||
(props.makeController ? props.makeController(repo) : makeController(repo, directCopyProps))
const renderit = (target: HTMLElement, metadata: EditorEntityMetadata, access: AccessRights) => {
const Ed = addEditorState(AddressEditor)
const defaultRenderEditor = (props: AddressEditorProps) =>
const specification: EditorSpecification = {
import * as React from 'react';
import { Stack } from '../Stack';
import { IStackStyles, IStackTokens } from '../Stack.types';
import { mergeStyles, DefaultPalette } from 'office-ui-fabric-react/lib/Styling';
// Styles definition
const stackStyles: IStackStyles = {
root: {
background: DefaultPalette.themeTertiary
}
};
const stackItemStyles = mergeStyles({
alignItems: 'center',
background: DefaultPalette.themePrimary,
color: DefaultPalette.white,
display: 'flex',
height: 50,
justifyContent: 'center',
width: 50
});
// Tokens definition
const sectionStackTokens: IStackTokens = { childrenGap: 10 };
const headingStackTokens: IStackTokens = { childrenGap: 50 };
const numericalSpacingStackTokens: IStackTokens = {
childrenGap: 10,
padding: 10
};
style[key] = {
...style[key],
...codeStyle,
padding: '6px 20px',
background: 'white'
};
} else {
// correct text colors (convert to lowercase due to inconsistent casing)
const color = (style[key].color || '').toLowerCase();
if (colorMap[color]) {
style[key].color = colorMap[color];
}
}
}
const rootClass = mergeStyles({
maxHeight: 400
});
export interface ITypeScriptSnippetProps {
className?: string;
}
/** TypeScript code snippet with a theme similar to Monaco's VS light. */
export const TypeScriptSnippet: React.FunctionComponent = props => {
return (
{props.children}
);
};
IColumn,
ConstrainMode,
IDetailsFooterProps,
DetailsRow
} from 'office-ui-fabric-react/lib/DetailsList';
import { IRenderFunction } from 'office-ui-fabric-react/lib/Utilities';
import { TooltipHost, ITooltipHostProps } from 'office-ui-fabric-react/lib/Tooltip';
import { ScrollablePane, ScrollbarVisibility } from 'office-ui-fabric-react/lib/ScrollablePane';
import { Sticky, StickyPositionType } from 'office-ui-fabric-react/lib/Sticky';
import { MarqueeSelection } from 'office-ui-fabric-react/lib/MarqueeSelection';
import { lorem } from 'office-ui-fabric-react/lib/utilities/exampleData';
import { SelectionMode } from 'office-ui-fabric-react/lib/utilities/selection/index';
import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
import { getTheme, mergeStyles } from 'office-ui-fabric-react/lib/Styling';
const stickyListTitleClass = mergeStyles({
paddingTop: '100px'
});
const _columns: IColumn[] = [
{
key: 'column1',
name: 'Test 1',
fieldName: 'test1',
minWidth: 100,
maxWidth: 200,
isResizable: true
},
{
key: 'column2',
name: 'Test 2',
fieldName: 'test2',
import * as React from 'react';
import { Shimmer, ShimmerElementType } from 'office-ui-fabric-react/lib/Shimmer';
import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
import { mergeStyles } from 'office-ui-fabric-react/lib/Styling';
const wrapperClass = mergeStyles({
padding: 2,
selectors: {
'& > .ms-Shimmer-container': {
margin: '10px 0'
}
}
});
export const ShimmerBasicExample: React.StatelessComponent = () => {
return (
Basic Shimmer with no elements provided. It defaults to a line of 16px height.
Basic Shimmer with elements provided.
overflow: 'hidden'
}
};
return (
<div>
I shrink
I shrink
I don't shrink
I shrink
</div>
import * as React from 'react';
import { StaticList } from '@uifabric/lists';
import { mergeStyles } from 'office-ui-fabric-react/lib/Styling';
function generateItems(count: number): number[] {
const itemsArray: number[] = [];
for (let i = 0; i < count; i++) {
itemsArray.push(i);
}
return itemsArray;
}
const ITEMS: ReadonlyArray = generateItems(25);
const listClassName = mergeStyles({
listStyleType: 'none',
margin: 0,
padding: 0,
borderLeft: '3px solid #0078d4',
selectors: {
li: {
background: '#ffffff',
height: 25,
lineHeight: 25,
paddingLeft: 27
},
'li:nth-child(even)': {
background: '#f3f2f1',
height: 50,
lineHeight: 50
}
);
const VerticalSeparatorStack = (props: { children: JSX.Element[] }) => (
{React.Children.map(props.children, child => {
return (
{child}
);
})}
);
const verticalStyle = mergeStyles({
height: '200px'
});
export class SeparatorBasicExample extends React.Component<{}, {}> {
public render(): JSX.Element {
const content = 'Today';
return (
<>
{content}
<>
private _renderItemColumn(row: any, index: number, column: IColumn): JSX.Element | undefined {
let cell;
if (column.fieldName === 'c1') {
cell = row.c1;
} else if (column.fieldName === 'c2') {
cell = row.c2;
} else {
cell = row.c3;
}
const customColorCss = getClassNames(getStyles({ iconColor: cell.iconColor, textColor: cell.textColor, boldText: cell.boldText }));
const customTextClasses = row.isClickable ? mergeStyles(customColorCss.text, classNames.cursonPointer) : customColorCss.text;
switch (column.key) {
case 'facepile':
return (
<div data-selection-invoke="{row.isClickable}">
<span>
<img height="{24}" width="{24}" src="{cell.facepileImageSrc}">
</span>
<span>{cell.content}</span>
</div>
);
case 'icon':
return (
<div data-selection-invoke="{row.isClickable}">
<span>
</span></div>
const _getStatusIcon = (status?: ConfirmationStatus) => {
if (status) {
switch (status) {
case ConfirmationStatus.Success: {
return ;
}
case ConfirmationStatus.Failed: {
return ;
}
case ConfirmationStatus.Warning: {
return ;
}
}
}
return null;
};