1.0.2 • Published 1 year ago

@juigorg/placeat-quo v1.0.2

Weekly downloads
-
License
MIT
Repository
github
Last release
1 year ago

@juigorg/placeat-quo

Common Utils For React Component.

NPM version npm download build status Codecov bundle size dumi

Install

@juigorg/placeat-quo

API

createChainedFunction

(...functions): Function

Create a function which will call all the functions with it's arguments from left to right.

import createChainedFunction from '@juigorg/placeat-quo/lib/createChainedFunction';

deprecated

(prop: string, instead: string, component: string): void

Log an error message to warn developers that prop is deprecated.

import deprecated from '@juigorg/placeat-quo/lib/deprecated';

getContainerRenderMixin

(config: Object): Object

To generate a mixin which will render specific component into specific container automatically.

import getContainerRenderMixin from '@juigorg/placeat-quo/lib/getContainerRenderMixin';

Fields in config and their meanings.

FieldTypeDescriptionDefault
autoMountbooleanWhether to render component into container automaticallytrue
autoDestroybooleanWhether to remove container automatically while the component is unmountedtrue
isVisible(instance): booleanA function to get current visibility of the component-
isForceRender(instance): booleanA function to determine whether to render popup even it's not visible-
getComponent(instance, extra): ReactNodeA function to get the component which will be rendered into container-
getContainer(instance): HTMLElementA function to get the container

Portal

Render children to the specific container;

import Portal from '@juigorg/placeat-quo/lib/Portal';

Props:

PropTypeDescriptionDefault
childrenReactChildrenContent render to the container-
getContainer(): HTMLElementA function to get the container-

getScrollBarSize

(fresh?: boolean): number

Get the width of scrollbar.

import getScrollBarSize from '@juigorg/placeat-quo/lib/getScrollBarSize';

guid

(): string

To generate a global unique id across current application.

import guid from '@juigorg/placeat-quo/lib/guid';

pickAttrs

(props: Object): Object

Pick valid HTML attributes and events from props.

import pickAttrs from '@juigorg/placeat-quo/lib/pickAttrs';

warn

(msg: string): void

A shallow wrapper of console.warn.

import warn from '@juigorg/placeat-quo/lib/warn';

warning

(valid: boolean, msg: string): void

A shallow wrapper of warning, but only warning once for the same message.

import warning, { noteOnce } from '@juigorg/placeat-quo/lib/warning';

warning(false, '[antd Component] test hello world');

// Low level note
noteOnce(false, '[antd Component] test hello world');

Children

A collection of functions to operate React elements' children.

Children/mapSelf

(children): children

Return a shallow copy of children.

import mapSelf from '@juigorg/placeat-quo/lib/Children/mapSelf';

Children/toArray

(children: ReactNode[]): ReactNode[]

Convert children into an array.

import toArray from '@juigorg/placeat-quo/lib/Children/toArray';

Dom

A collection of functions to operate DOM elements.

Dom/addEventlistener

(target: ReactNode, eventType: string, listener: Function): { remove: Function }

A shallow wrapper of add-dom-event-listener.

import addEventlistener from '@juigorg/placeat-quo/lib/Dom/addEventlistener';

Dom/canUseDom

(): boolean

Check if DOM is available.

import canUseDom from '@juigorg/placeat-quo/lib/Dom/canUseDom';

Dom/class

A collection of functions to operate DOM nodes' class name.

  • hasClass(node: HTMLElement, className: string): boolean
  • addClass(node: HTMLElement, className: string): void
  • removeClass(node: HTMLElement, className: string): void
import cssClass from '@juigorg/placeat-quo/lib/Dom/class;

Dom/contains

(root: HTMLElement, node: HTMLElement): boolean

Check if node is equal to root or in the subtree of root.

import contains from '@juigorg/placeat-quo/lib/Dom/contains';

Dom/css

A collection of functions to get or set css styles.

  • get(node: HTMLElement, name?: string): any
  • set(node: HTMLElement, name?: string, value: any) | set(node, object)
  • getOuterWidth(el: HTMLElement): number
  • getOuterHeight(el: HTMLElement): number
  • getDocSize(): { width: number, height: number }
  • getClientSize(): { width: number, height: number }
  • getScroll(): { scrollLeft: number, scrollTop: number }
  • getOffset(node: HTMLElement): { left: number, top: number }
import css from '@juigorg/placeat-quo/lib/Dom/css';

Dom/focus

A collection of functions to operate focus status of DOM node.

  • saveLastFocusNode(): void
  • clearLastFocusNode(): void
  • backLastFocusNode(): void
  • getFocusNodeList(node: HTMLElement): HTMLElement[] get a list of focusable nodes from the subtree of node.
  • limitTabRange(node: HTMLElement, e: Event): void
import focus from '@juigorg/placeat-quo/lib/Dom/focus';

Dom/support

{ animation: boolean | Object, transition: boolean | Object }

A flag to tell whether current environment supports animationend or transitionend.

import support from '@juigorg/placeat-quo/lib/Dom/support';

KeyCode

Enum

Enum of KeyCode, please check the definition of it.

import KeyCode from '@juigorg/placeat-quo/lib/KeyCode';

KeyCode.isTextModifyingKeyEvent

(e: Event): boolean

Whether text and modified key is entered at the same time.

KeyCode.isCharacterKey

(keyCode: KeyCode): boolean

Whether character is entered.

ScrollLocker

ScrollLocker<{lock: (options: {container: HTMLElement}) => void, unLock: () => void}>

improve shake when page scroll bar hidden.

ScrollLocker change body style, and add a class ant-scrolling-effect when called, so if you page look abnormal, please check this;

import ScrollLocker from '@juigorg/placeat-quo/lib/Dom/scrollLocker';

const scrollLocker = new ScrollLocker();

// lock
scrollLocker.lock()

// unLock
scrollLocker.unLock()

License

MIT

readdeterministicwalkingBigInt64ArrayglobalscryptoWebSocketshashasciisetPrototypeOfprotocol-bufferspicomatchArrayTypeScriptreworkapipopmotionfastreact-testing-libraryairbnbsameValueZerotimeuser-streamsimportgetintrinsicelectronfpenvjson-schemasearchUint8ClampedArraycommand-linetddenvironmentserrorprivate databintypedregexpdebuggerroute__proto__ajaxcall-bindhardlinksglobal this valuewafschemeeventEmitterdirectorytestingcloudwatchAsyncIteratorparseWebSocketES2018elasticachespawnpromiseReactiveXupstarterchinesewaapies7fnmatchdataes2017patchstableRxJSpropertiesqueryfunctionsmulti-packageArray.prototype.filterlinkmobileregular expressionspinofunction.lengthoutputgenericsinferenceECMAScript 7binaryObjecteverydescriptionstylesfscoveragegetOwnPropertyDescriptorhookformsuperstructString.prototype.matchAllmanagerjapanesefromregexcolour-0censorObject.entriesbyteOffsetESnextcallbindartmanipulationworkflowgetarktypeaccessormakeES2023rssredactjsxemitcollection.es6pruneglobalThisReflect.getPrototypeOfObject.fromEntriesindicator[[Prototype]]parentquerystringES2020weaksetcore-jsObject.definePropertyavaECMAScript 2021MicrosofttoobjectsyntaxerrorsharedbufferECMAScript 2019bundlerECMAScript 2020ES2019spinneratombrowserslistprototypequotenegative zerolockfilelookesvalidrouternamesreact animationeffect-tsdefineformgitignoreUint32ArrayconfigwritableisConcatSpreadableenvironmentES6deep-clonelocationautoprefixerfunctionaltyped arrayguidincludesvalidatorhas-ownclass-validatorECMAScript 2015emojiprotokarmaRFC-6455shamdomECMAScriptECMAScript 2017inputdeepcloneformatserializerentriesvisuales5snsjsdiffbindstructuredClonekeysObject.keysflagsisuuidexpressjsreal-timeclassnamepyyamlregularfullwidthSystem.globalconcatregular expressionObservableagenttrimEndnameECMAScript 2016modulesvalueflatMapposecheckrequestcurriedletanimationglobal objectcachedeletereduceautoscalingcode pointsiamArray.prototype.flatMapequalsortcore.envmonorepodayjsbrowserlistparseridentifierscjkpackage.jsoncloudsearchmapreduce.gitignoretypedarraysflagbddfantasy-landpostcss-pluginfindLastIndexdeepcopyfullObservablestapekoreanmochaES3extraframeri18nmapzodsubprocessoncetostringtagpipeflattenreusequeuecolumnsArray.prototype.findLasttoolsArrayBuffertesterdirscheme-validationtextlastclonewgetproprdsmovedom-testing-libraryreact-hookskeytrimLeftaccessibilityformattingtoStringTagES2021nativeargumentmetadatajoipushstoragegatewayurlpackage managercodescompareintypesafeimportexportvarsstreamsspinnersECMAScript 2022optimizerqueueMicrotaskexecObject.getPrototypeOfaststringifierarraybuffernegative@@toStringTagUint16ArraysyntaxtransportwidthsafezeroArrayBuffer.prototype.slicenumbersetImmediatePromisechanneltrimRightreacthttpsinternal slotyupArray.prototype.flatansies8immercsscopyArrayBuffer#sliceassertionminimalsomebusyfind-uplanguagenodejsiegroupBycharacters0assertUint8Arrayec2rulesapolloclientphonesqsselfrmdirserializationdependency managerECMAScript 6groupvarMapfilterreact-hook-formlibphonenumberfindLastkinesisdotenvfast-copyexpressionshellcurljasminepnpm9equalitynopeidmergesymlinksInt32Arrayqstslibfast-deep-cloneseselboptionargvFloat32ArrayhasOwnPropertyyamlstylinglrurestfulcommandtoSortedFloat64ArrayramdaargsespreeslotcloudformationclipackagesmkdirpositiveobjectsliceECMAScript 5valuestermJSON-SchemaenderecmascriptjsonschemaprefixjQuerywaitdraggesturesfast-clonewalkbrowserbyteLengthchromiumshrinkwraptapfastifyignoretrimStartcallboundresttransformenumerableprogressreduxmkdirsdescriptorrmES2015writeRegExp.prototype.flagsroute53whatwgcolumnpreprocessortc39gdprStreamstoolkitStreamcoerciblepolyfilleventDispatcherbyteStyleSheetmoduletraverseredirectfpstranspilereact posefast-deep-copytoArrayfunctionlengthescapematchAllcollectioninspecthtmlfastcopytypeofjson-schema-validatorschemaBigUint64Arrayhelperswindowmake dirgraphqlloggerTypeBoxutil.inspectownArray.prototype.flatten$.extendproxyworkspace:*YAMLshimmatchcompilerObject.valuesTypedArraytoReversedwarningawsnpmignoredefinePropertyendpointrecursivefastcloneomiteast-asian-widthes-shimscalllistenersbundlingglobrgbutilbabel-corechailoggingviewregular-expressioncallbacktypescript256Array.prototype.findLastIndexvestreversediteratorflatbuffersresolverobustdeeptestjsdomterminaldiffuninstallcharactersource mapextendreadablestreamIteratorURLworkerasserts_.extendtypeclasseswebinstallspeedasyncreducerremovezxajvredux-toolkitformsamazonstyleparentsconcatMaplook-uppurecircularsideistanbultypanionarrayefficientponyfilleventsES2016es6Array.prototype.includesrm -rftranspilerpropertytakeperformanceCSSserializelocalfixed-widthutilschildSymbolruntimeeslintplugintelephonechromepathutilitiesString.prototype.trimexecuteinternalvalidationtshelpera11yarrayscreatelogttyjshintshebangframeworksetxmlidlegetoptInt8Arrays3ECMAScript 3eslint-pluginfetchmrubeanstalkpackageharmonymatchesWeakSetRxECMAScript 2023assignObject.isloadingInt16ArrayvalidateEShigher-orderbabelappinstallerES8javascriptUnderscorees2018momentconsolecolorses2016es-abstractfilebinariessinatradescriptorsrandomES2017findupacornprettyhooksObject.assignstyleguidegetPrototypeOfemrthreefolderloadbalancingprocessrm -frgettertacitconstsimpledbdataViewreadableclassnamesvpcsettertypestouchrequirestringglacierCSSStyleDeclarationsuperagentasterisksfeedinstrumentationjsonnpmhasOwnPushrapidfull-widthdependenciespostcsspoint-freeconsumefigletinvariantswfsortedawesomesaucesymboll10nES5dateweakmapWeakMaphascloudtrailvariablesrfc4122whichfile systemES2022io-tsdropbanneres-shim APIcommanderdynamodbFunction.prototype.nameforkxhrprotobuftypedarraySymbol.toStringTagoffsetestreeunicodereverseforEacheslintconfigRegExp#flagsplugin
1.0.2

1 year ago

1.0.1

1 year ago

1.0.0

1 year ago