@mikezimm/fps-library-v2
Version:
Library of reusable typescript/javascript functions, interfaces and constants
29 lines (28 loc) • 2.52 kB
JavaScript
/**
* CodeAnalizerComment: Updated 3 imports on 2024-09-22 14:49:52
* Update:: import { IFPSAgeSliderProps } to '@mikezimm/fps-core-v7/lib/components/atoms/FPSAgeSlider/FPSAgeTypes;'
* Update:: import { FPSAgeSliderOptions } to '@mikezimm/fps-core-v7/lib/components/atoms/FPSAgeSlider/FPSAgeTypes;'
* Update:: import { FPSAgeSliderOptionsOOTB } to '@mikezimm/fps-core-v7/lib/components/atoms/FPSAgeSlider/FPSAgeTypes;'
*/
import * as React from 'react';
// eslint-disable-next-line @typescript-eslint/no-unused-vars
// import { useState, useEffect } from 'react';
import { Slider } from '@fluentui/react/lib/Slider';
import { FPSAgeSliderOptions, FPSAgeSliderOptionsOOTB } from '@mikezimm/fps-core-v7/lib/components/atoms/FPSAgeSlider/FPSAgeTypes';
const FPSAgeSliderHook = (props) => {
const { disabled, FPSAgeIsVisible, FPSAgeColumnTitle, FPSAgeDefault, onChange } = props.props; //onClosePanel
const isOOTBMeta = FPSAgeColumnTitle === 'Modified' || FPSAgeColumnTitle === 'Created' ? true : false;
const UseTheseOptions = props.props.alternateOptions ? props.props.alternateOptions : isOOTBMeta === true ? FPSAgeSliderOptionsOOTB : FPSAgeSliderOptions;
// min needs to be negative sign so that slider looks correct... slide left to show more
const min = (UseTheseOptions.length - 1) * -1;
// const IconStyles: React.CSSProperties = { cursor: 'pointer', fontSize: 'x-large', marginLeft: '20px' };
const AgeSlider = FPSAgeIsVisible === false ? React.createElement("div", null) : React.createElement(Slider, { disabled: disabled === true ? true : false, label: `${FPSAgeColumnTitle} ${isOOTBMeta !== true ? 'age (days ago)' : ''}`, min: min, max: 0, step: 1,
// NOTE: defaultValue Must be negative due to props index is positive
defaultValue: FPSAgeDefault * -1, valueFormat: (value) => isOOTBMeta === true ? UseTheseOptions[Math.abs(value)].text : UseTheseOptions[Math.abs(value)].text,
// onChanged={ (event: any, value: number, ) => this.setState({ searchAge: value }) }
// onChanged={ (event: any, value: number, ) => this._searchForItems( this.state.searchText, this.state.searchMeta, this.state.searchMeta.length, 'age', value ) }
onChange: (value) => onChange(value * -1), className: 'forceColorWhiteOnDefWhite', styles: { container: { width: '250px' }, valueLabel: { width: '120px' } }, originFromZero: true });
return (AgeSlider);
};
export default FPSAgeSliderHook;
//# sourceMappingURL=FPSAgeHook.js.map