1. Docs
  2. Installation

Installation

This guide will show How to install Flexilla In your New or Existing Project

This guide will help you get started with Flexilla

Install via npm

  1. Install the Full Library 

    npm i @flexilla/flexilla

  2. Usage 

    import {Accordion, Tabs} from "@flexilla/flexilla"

const accordion = new Accordion("#my-accordion")
const tabs = new  Tabs("#my-tabs",{ 
    // options
})

Install Single Component

  1. Example: Install a Single Component 

    npm i @flexilla/collapse

  2. Usage 

    import {Collapse} from "@flexilla/collapse"

new Collapse("#my-collapse",{
    // options
})

Using CDN

  1. Import from CDN

    All components 
    <script type="module">
import {
  Tabs,
  Accordion
} from 'https://cdn.jsdelivr.net/npm/@flexilla/flexilla@latest/+esm';

new Tabs("#hego")
new Accordion("#myAccordion")
</script>

    Import a Single Package 

    <script type="module">
import * as flexillatabs from 'https://cdn.jsdelivr.net/npm/@flexilla/tabs@latest/+esm';
new flexillatabs.Tabs("#tabs")
</script>

With Module (require) 

const Accordion = require('@flexilla/accordion');
new Accordion("#myAccordion")

Styling

Flexilla is headless and does not come with built-in styles. You will need to apply your own CSS or use a framework like Tailwind CSS or UnoCSS. See the dedicated styling guides for more information:

Quick Start Examples

Check out these quick start examples to get a feel of Flexilla here