1.0.6 • Published 3 months ago
@soyfri/template v1.0.6
@soyfri/template
Description
This package contains a Metronic template specifically designed for FRI frontend projects. It provides a set of pre-built components, styles, and utilities to streamline frontend development.
Installation
npm install @soyfri/template
# or
yarn add @soyfri/template
Requirements
Peer Dependencies
- React >=16.8.0
- React DOM >=16.8.0
Usage
Basic Layout
Create a basic application layout using the package's wrapper components:
import { HeaderWrapper, FooterWrapper, Content } from '@soyfri/template';
function App() {
return (
<>
<HeaderWrapper />
<Content>
{/* Your content here */}
</Content>
<FooterWrapper />
</>
);
}
Styling
To import the main SCSS stylesheet, add the following import to your main stylesheet or entry file:
@import '@soyfri/template/_metronic/assets/sass/style.react.scss';
Internationalization
The package includes i18n support. To use it:
import { MetronicI18nProvider, setLanguage } from '@soyfri/template';
function App() {
return (
<MetronicI18nProvider>
{/* Your app content */}
</MetronicI18nProvider>
);
}
Features
- Pre-built React components
- Responsive design
- SCSS styling
- Internationalization support
- Easy integration with FRI frontend projects
Avilable Imports and utils
- Layout Core
- HeaderWrapper
- FooterWrapper
- Content
- Sidebar
- ScrollTop
- Toolbar
- MasterLayout
- MasterInit
- LayoutProvider
- PageDataProvider
- useLayout
- ThemeModeProvider
- ThemeModeSwitcher
- MetronicI18nProvider
- i18nProvider
- setLanguage
- useLang
- FeedsWidget2, FeedsWidget3, FeedsWidget4, FeedsWidget5, FeedsWidget6
- MixedWidget1 through MixedWidget15
- ListsWidget1 through ListsWidget9
- StatisticsWidget1 through StatisticsWidget6
- Check the metronic docs for more information: tronic docs for more information
- KTIcon
- KTCard
- KTCardBody
- KTSVG
- CreateAppModal
- SelectLocationModal
- InviteUsers
- UpgradePlan
- toAbsoluteUrl
- getLayoutFromLocalStorage
- setLayoutToLocalStorage
- getEmptyCssClasses
- getEmptyCSSVariables
- getEmptyHTMLAttributes
- ID type
- PaginationState
- SortState
- FilterState
- SearchState
- QueryState
- CookieComponent
- DrawerComponent
- FeedbackComponent
- ImageInputComponent
- ScrollComponent
- ScrollTopComponent
- StepperComponent
- StickyComponent
- ToggleComponent
- PasswordMeterComponent
- SwapperComponent
- MenuComponent
- SearchComponent
License
MIT
Support
For support, please contact the FRI frontend development team.