Skip to content

snappmarket/frontend-toolbox

Repository files navigation

⚙ SnappMarket frontend powerful tools

version downloads PRs Welcome MIT License CodeFactor

All Contributors

hooks, helpers, ui components and icons that we used in new version of snappmarket website

demo

You can see demo at : https://ft-box.netlify.com/

get started

npm i @snappmarket/ui
npm i @snappmarket/hooks
npm i @snappmarket/helpers
npm i @snappmarket/icons
npm i @snappmarket/config

// OR 

yarn add @snappmarket/ui
yarn add @snappmarket/hooks
yarn add @snappmarket/helpers
yarn add @snappmarket/icons
yarn add @snappmarket/config

Hooks Found Here

Hook Name Description
useDebounce 🔂 Change rapidly, do once
useDidUpdateEffect 🧵 Do not worry about render phase effect calls
useFocus 😵 Focus on every thing you want
useForceUpdate 👿 force update component
useGeoLocation 🗺 easily deal with navigator location API
useRouteChange 🏹 detect when react router dom route changes
useTimer ⏱ easily handle timing

💈 UI Components found here

Component Description
Accordion Accordion Ui component
Alert Alert Ui component
Breadcrumb Breadcrumb Ui component
Button Button Ui component
Checkbox CheckBox Ui component
ConfirmDialog ConfirmDialog Ui component
Dialog Dialog Ui component
Grid Grid Ui component
GridSystem GridSystem Ui component
Icon Icon Ui component
Image Image Ui component
Input Input Ui component
InputRange InputRange Ui component
Range Range Ui component
Range Range Ui component
Json Json Ui component
Label Label Ui component
LinedText LinedText Ui component
Loading Loading Ui component
Modal Modal Ui component
OptionGroup OptionGroup Ui component
Radio Radio Ui component
Pagination Pagination Ui component
ProgressBar ProgressBar Ui component
Skeleton Skeleton Ui component
Slider Slider Ui component
TabSwitcher TabSwitcher Ui component
TextWrap TextWrap Ui component
Toggle Toggle Ui component
Tooltip Tooltip Ui component

💊 Helpers Found Here

Helper Methods
ArrayHelpers arrayItemAddProp ,flattenArray ,serializeObject ,stringifyArray ,deepFlatten
CookieHelpers getCookie, setCookie
DebugHelpers delog, ApiError, globalErrorCatcher
HttpHelpers fetchWithTimeOut, universalCall
JsonHelpers recursiveJsonParse
MapHelpers isLocationInIran
NumberHelpers persianNumber, englishNumber, generateKey, cellphoneValidate, cellphoneValidatePattern, currencyPrice
ObjectHelpers removeByKey, flattenObject, makeCookieString, safeObjectPropertyRead, getNextProp
OSHelpers getOSName, getAgent
PromiseHelpers racePromise, makeTimeout, emptyPromise
ProxyHelpers onChangeReflector
ReduxHelpers actionMaker, normalizeActionType, configPersistor
StorageHelpers getLocalStorageData
StringHelpers stringReplace, bulkStringReplace
TemplateHelpers HexToRgb, defineForegroundColor, makeRgba, decideMeasurement, makeShadow
WindowHelpers getPathName, getWindowSize

💎 Icons found here

All icons has svg file, react component, and an special sprite svg

  • 💯 100% tested react 100+ svg icon components

Contributors ✨

Thanks goes to these wonderful people (emoji key):


Jafar Rezaei

🚇 ⚠️ 📖 💻 🤔 🚧 📦 👀

Reza Erami

🚇 ⚠️ 📖 💻

mahsa mesbah

⚠️ 📖 💻

Mostafa Rastegar

🤔 ⚠️ 💻

This project follows the all-contributors specification. Contributions of any kind welcome!