Awesome

Solid Primitives

<!-- INSERT-NPM-DOWNLOADS-BADGE:START -->

A project that strives to develop high-quality, community contributed Solid primitives. All utilities are well tested and continuously maintained. Every contribution to the repository is checked for quality and maintained to the highest degree of excellence. The ultimate goal is to extend Solid's primary and secondary primitives with a set of tertiary primitives.

While Solid Primitives is not officially maintained by the SolidJS Core Team, it is managed by members of the SolidJS core and ecosystem teams. This separation allows the core library to iterate independently while allowing Solid Primitives to remain in-sync with future plans.

Philosophy

The goal of Solid Primitives is to wrap client and server side functionality to provide a fully reactive API layer. Ultimately the more rooted our tertiary primitives are, the more they act as foundation within Solid's base ecosystem. With well built and re-used foundations, the smaller (aggregate tree-shaking benefits), more concise (readability) and stable (consistent and managed testing + maintenance) applications can be overall.

Primitives

Name	Stage	Primitives	Size	NPM
<h4>Inputs</h4>
active-element		createActiveElement<br />createFocusSignal
autofocus		autofocus<br />createAutofocus
input-mask		createInputMask<br />createMaskPattern
keyboard		useKeyDownList<br />useCurrentlyHeldKey<br />useKeyDownSequence<br />createKeyHold<br />createShortcut
mouse		createMousePosition<br />createPositionToElement
pointer		createPointerListeners<br />createPerPointerListeners<br />createPointerPosition<br />createPointerList
scroll		createScrollPosition<br />useWindowScrollPosition
selection		createSelection
<h4>Display & Media</h4>
audio		makeAudio<br />makeAudioPlayer<br />createAudio
bounds		createElementBounds
devices		createDevices<br />createMicrophones<br />createSpeakers<br />createCameras<br />createAccelerometer<br />createGyroscope
filesystem		createFileSystem<br />createSyncFileSystem<br />createAsyncFileSystem<br />makeNoFileSystem<br />makeNoAsyncFileSystem<br />makeVirtualFileSystem<br />makeWebAccessFileSystem<br />makeNodeFileSystem<br />makeTauriFileSystem<br />makeChokidarWatcher<br />rsync
idle		createIdleTimer
intersection-observer		createIntersectionObserver<br />createViewportObserver<br />createVisibilityObserver
media		makeMediaQueryListener<br />createMediaQuery<br />createBreakpoints<br />usePrefersDark
page-visibility		createPageVisibility
resize-observer		createResizeObserver<br />createWindowSize<br />createElementSize
styles		createRemSize
<h4>Browser APIs</h4>
broadcast-channel		makeBroadcastChannel<br />createBroadcastChannel
clipboard		copyClipboard<br />writeClipboard<br />createClipboard
event-listener		createEventListener<br />createEventSignal<br />createEventListenerMap<br />WindowEventListener<br />DocumentEventListener
event-props		createEventProps
fullscreen		createFullscreen
geolocation		createGeolocation<br />createGeolocationWatcher
mutation-observer		createMutationObserver
permission		createPermission
storage		makePersisted<br />cookieStorage<br />tauriStorage<br />multiplexStorage<br />storageSync<br />messageSync<br />wsSync<br />multiplexSync<br />addClearMethod<br />addWithOptionsMethod<br />makeObjectStorage
timer		makeTimer<br />createTimer<br />createTimeoutLoop<br />createPolled<br />createIntervalCounter
upload		createFileUploader<br />createDropzone
workers		createWorker<br />createWorkerPool<br />createSignaledWorker
<h4>Network</h4>
connectivity		createConnectivitySignal
fetch		createFetch
graphql		createGraphQLClient
stream		createStream<br />createAmplitudeStream<br />createMediaPermissionRequest<br />createAmplitudeFromStream<br />createScreen
websocket		makeWS<br />createWS<br />createWSState<br />makeReconnectingWS<br />createReconnectingWS<br />makeHeartbeatWS
<h4>Control Flow</h4>
context		createContextProvider<br />MultiProvider
jsx-tokenizer		createTokenizer<br />createToken<br />resolveTokens<br />isToken
keyed		keyArray<br />Key<br />Entries
list		listArray<br />List
range		repeat<br />mapRange<br />indexRange<br />Repeat<br />Range<br />IndexRange
refs		mergeRefs<br />resolveElements<br />resolveFirst<br />Ref<br />Refs
<h4>Utilities</h4>
controlled-props		createControlledProp
cursor		createElementCursor<br />createBodyCursor
date		createDate<br />createDateNow<br />createTimeDifference<br />createTimeDifferenceFromNow<br />createTimeAgo<br />createCountdown<br />createCountdownFromNow
event-bus		createEventBus<br />createEmitter<br />createEventHub<br />createEventStack
event-dispatcher		createEventDispatcher
flux-store		createFluxStore<br />createFluxFactory<br />createActions<br />createAction
history		createUndoHistory
i18n		flatten<br />resolveTemplate<br />translator<br />scopedTranslator<br />chainedTranslator
platform		List of variables
promise		promiseTimeout<br />raceTimeout<br />until
props		combineProps<br />filterProps
scheduled		debounce<br />throttle<br />scheduleIdle<br />leading<br />createScheduled<br />leadingAndTrailing
script-loader		createScriptLoader
share		createSocialShare<br />createWebShare
<h4>Reactivity</h4>
deep		trackDeep<br />trackStore<br />captureStoreUpdates
destructure		destructure
immutable		createImmutable
lifecycle		createIsMounted<br />isHydrated<br />onConnect
map		ReactiveMap<br />ReactiveWeakMap
memo		createLatest<br />createLatestMany<br />createWritableMemo<br />createLazyMemo<br />createPureReaction<br />createMemoCache<br />createReducer
mutable		createMutable<br />modifyMutable
resource		createAggregated<br />createDeepSignal<br />makeAbortable<br />createAbortable<br />makeCache<br />makeRetrying
rootless		createSubRoot<br />createCallback<br />createDisposable<br />createSharedRoot<br />createRootPool
set		ReactiveSet<br />ReactiveWeakSet
signal-builders		List of builders
state-machine		createMachine
static-store		createStaticStore<br />createDerivedStaticStore
trigger		createTrigger<br />createTriggerCache
<h4>UI Patterns</h4>
marker		createMarker
masonry		createMasonry
pagination		createPagination<br />createInfiniteScroll
virtual		VirtualList
<h4>Animation</h4>
presence		createPresence
raf		createRAF<br />createMs<br />targetFPS
transition-group		createSwitchTransition<br />createListTransition
tween		createTween
<h4>Solid Start</h4>
start		createServerCookie<br />createUserTheme