@mikezimm/fps-library-v2
Version:
Library of reusable typescript/javascript functions, interfaces and constants
68 lines (67 loc) • 4.41 kB
JavaScript
/**
* CodeAnalizerComment: Updated 2 imports on 2024-09-21 23:07:24
* Update:: import { IFPSFilterButtonWPProps } to '@mikezimm/fps-core-v7/lib/components/atoms/FilterButtons/interfaces/IFPSFilterButtonWPProps;'
* Update:: import { createStyleFromString } to '@mikezimm/fps-core-v7/lib/logic/Strings/reactCSS;'
*/
import * as React from 'react';
import { Icon, } from '@fluentui/react/lib/Icon';
import { createStyleFromString } from '@mikezimm/fps-core-v7/lib/logic/Strings/reactCSS';
/**
* If a label property starts with a ^, it does not show the label on the button but puts it in the title.
* Use that to have just an Icon button
* @param props
* @returns
*/
export function sourceButtonRow(props) {
if (!props) {
console.log('sourceButtonRow Unexpected props===undefined ~ 21');
return undefined;
}
const { title, Labels, selected, selectedClass, multiSelected, onClick, disabled, QFButtons } = props;
const UseLabels = QFButtons ? QFButtons.map(item => item.label) : Labels;
const result = React.createElement("div", { style: props.rowCSS ? props.rowCSS : {}, className: ['sourceButtonRow', props.rowClass, QFButtons ? 'qFButtonRow' : ''].join(' ') },
props.leadEle ? props.leadEle : undefined,
props.heading ? props.heading : undefined,
title,
UseLabels.map((label, index) => {
const ThisQFButton = QFButtons && QFButtons.length > 0 ? QFButtons[index] : null;
let isDisabled = disabled === 'all' ? true : disabled && disabled.length > 0 && (disabled.indexOf(index) > -1 || disabled.indexOf(label) > -1) ? true : false;
let buttonStyle = props.buttonCSS ? props.buttonCSS : {};
let IconElement = undefined;
const ButtonLabel = label.indexOf('^') === 0 ? '' : label.replace('^', '');
const ButtonTitle = label.indexOf('^') === 0 ? label.replace('^', '') : '';
// Added for Multiselect option
const selectedValues = selected || selected === 0 ? [selected] : multiSelected && multiSelected.length > 0 ? multiSelected : [];
const isSelected = selectedValues.indexOf(index) > -1 ? true : false;
const buttonClass = ['button', isSelected === true ? 'isSelected' : '', isSelected === true ? selectedClass : '',].join(' ');
// Explicitly check if the QFButton has a disabled setting. If it's explicit, then set to that otherwise use isDisabled;
if (QFButtons) {
isDisabled = ThisQFButton.disabled === true || ThisQFButton.disabled === false ? ThisQFButton.disabled === true : isDisabled;
const QFButtonStyle = createStyleFromString(ThisQFButton.buttonStyle, {}, '', '');
if (ThisQFButton.buttonStyle)
buttonStyle = { ...buttonStyle, ...QFButtonStyle };
if (ThisQFButton.iconName) {
const IconStyle = createStyleFromString(ThisQFButton.iconStyle, {}, '', '');
if (!ButtonLabel)
IconStyle.paddingRight = '2px';
// Added to reset icon styles when selected and there is a selected class for: https://github.com/mikezimm/drilldown7/issues/430
if (isSelected === true && selectedClass) {
IconStyle.color = 'inherit';
IconStyle.fontWeight = 'initial';
}
IconElement = React.createElement(Icon, { iconName: ThisQFButton.iconName, style: IconStyle });
}
}
const QClick = QFButtons ? ThisQFButton.onClick : onClick;
const useOnClick = QFButtons ? (event) => QClick(index, ThisQFButton, 'cmd', event) : () => onClick(index);
return React.createElement("button", { disabled: isDisabled, key: label, onClick: useOnClick, style: buttonStyle, title: ButtonTitle, className: buttonClass },
IconElement,
ButtonLabel);
}),
props.infoEle ? props.infoEle : undefined,
!props.descEle ? undefined :
typeof props.descEle === 'string' ? React.createElement("div", { style: { fontSize: 'smaller', paddingTop: '1em' } }, props.descEle) :
props.descEle);
return result;
}
//# sourceMappingURL=sourceButtonRow.js.map