1.0.6 • Published 3 months ago

@soyfri/template v1.0.6

Weekly downloads
-
License
MIT
Repository
github
Last release
3 months ago

@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.