feat (init): create flutter semantic UI package for flutter app development. Story: #1

- create button, list tile, tabbar, label, card, image overlay components, etc
- add a sample project (example folder) for the testing package

closes Story #1

.gitignore

+# Miscellaneous
+*.class
+*.log
+*.pyc
+*.swp
+.DS_Store
+.atom/
+.buildlog/
+.history
+.svn/
+
+# IntelliJ related
+*.iml
+*.ipr
+*.iws
+.idea/
+
+# The .vscode folder contains launch configuration and tasks you configure in
+# VS Code which you may wish to be included in version control, so this line
+# is commented out by default.
+#.vscode/
+
+# Flutter/Dart/Pub related
+**/doc/api/
+.dart_tool/
+.flutter-plugins
+.flutter-plugins-dependencies
+.packages
+.pub-cache/
+.pub/
+build/
+
+# Android related
+**/android/**/gradle-wrapper.jar
+**/android/.gradle
+**/android/captures/
+**/android/gradlew
+**/android/gradlew.bat
+**/android/local.properties
+**/android/**/GeneratedPluginRegistrant.java
+
+# iOS/XCode related
+**/ios/**/*.mode1v3
+**/ios/**/*.mode2v3
+**/ios/**/*.moved-aside
+**/ios/**/*.pbxuser
+**/ios/**/*.perspectivev3
+**/ios/**/*sync/
+**/ios/**/.sconsign.dblite
+**/ios/**/.tags*
+**/ios/**/.vagrant/
+**/ios/**/DerivedData/
+**/ios/**/Icon?
+**/ios/**/Pods/
+**/ios/**/.symlinks/
+**/ios/**/profile
+**/ios/**/xcuserdata
+**/ios/.generated/
+**/ios/Flutter/App.framework
+**/ios/Flutter/Flutter.framework
+**/ios/Flutter/Flutter.podspec
+**/ios/Flutter/Generated.xcconfig
+**/ios/Flutter/app.flx
+**/ios/Flutter/app.zip
+**/ios/Flutter/flutter_assets/
+**/ios/Flutter/flutter_export_environment.sh
+**/ios/ServiceDefinitions.json
+**/ios/Runner/GeneratedPluginRegistrant.*
+
+# Exceptions to above rules.
+!**/ios/**/default.mode1v3
+!**/ios/**/default.mode2v3
+!**/ios/**/default.pbxuser
+!**/ios/**/default.perspectivev3

.metadata

+# This file tracks properties of this Flutter project.
+# Used by Flutter tool to assess capabilities and perform upgrades etc.
+#
+# This file should be version controlled and should not be manually edited.
+
+version:
+  revision: c40e5294dda34d04cd222dfdf765f171e12e4a8d
+  channel: dev
+
+project_type: package

.vscode/launch.json

+{
+    "version": "0.1.0",
+    "configurations": [
+        
+        {
+            "name": "Flutter",
+            "program": "example/lib/main.dart",
+            "request": "launch",
+            "type": "dart"
+        }
+    ]
+}
\ No newline at end of file

.vscode/settings.json

+{
+    "dart.flutterSdkPath": "D:\\flutter\\2.0.4-stable\\bin"
+}
\ No newline at end of file

CHANGELOG.md

+## 0.0.1 - 2021-04-27
+
+### feat (init): create flutter semantic UI package for flutter app development.
+* create button, list tile, tabbar, label, card, image overlay components, etc
+* add a sample project (example folder) for the testing package
\ No newline at end of file

LICENSE

+TODO: Add your license here.

README.md

+# llswidget
+
+A new Flutter package project.
+
+## Getting Started
+
+This project is a starting point for a Dart
+[package](https://flutter.dev/developing-packages/),
+a library module containing code that can be shared easily across
+multiple Flutter or Dart projects.
+
+For help getting started with Flutter, view our 
+[online documentation](https://flutter.dev/docs), which offers tutorials, 
+samples, guidance on mobile development, and a full API reference.

example/.gitignore

+# Miscellaneous
+*.class
+*.log
+*.pyc
+*.swp
+.DS_Store
+.atom/
+.buildlog/
+.history
+.svn/
+
+# IntelliJ related
+*.iml
+*.ipr
+*.iws
+.idea/
+
+# The .vscode folder contains launch configuration and tasks you configure in
+# VS Code which you may wish to be included in version control, so this line
+# is commented out by default.
+#.vscode/
+
+# Flutter/Dart/Pub related
+**/doc/api/
+**/ios/Flutter/.last_build_id
+.dart_tool/
+.flutter-plugins
+.flutter-plugins-dependencies
+.packages
+.pub-cache/
+.pub/
+/build/
+
+# Web related
+lib/generated_plugin_registrant.dart
+
+# Symbolication related
+app.*.symbols
+
+# Obfuscation related
+app.*.map.json
+
+# Android Studio will place build artifacts here
+/android/app/debug
+/android/app/profile
+/android/app/release

example/.metadata

+# This file tracks properties of this Flutter project.
+# Used by Flutter tool to assess capabilities and perform upgrades etc.
+#
+# This file should be version controlled and should not be manually edited.
+
+version:
+  revision: b1395592de68cc8ac4522094ae59956dd21a91db
+  channel: stable
+
+project_type: app

example/.vscode/settings.json

+{
+    "dart.flutterSdkPath": "D:\\flutter\\2.0.4-stable\\bin"
+}
\ No newline at end of file

example/README.md

+# example
+
+A new Flutter project.
+
+## Getting Started
+
+This project is a starting point for a Flutter application.
+
+A few resources to get you started if this is your first Flutter project:
+
+- [Lab: Write your first Flutter app](https://flutter.dev/docs/get-started/codelab)
+- [Cookbook: Useful Flutter samples](https://flutter.dev/docs/cookbook)
+
+For help getting started with Flutter, view our
+[online documentation](https://flutter.dev/docs), which offers tutorials,
+samples, guidance on mobile development, and a full API reference.

example/android/.gitignore

+gradle-wrapper.jar
+/.gradle
+/captures/
+/gradlew
+/gradlew.bat
+/local.properties
+GeneratedPluginRegistrant.java
+
+# Remember to never publicly share your keystore.
+# See https://flutter.dev/docs/deployment/android#reference-the-keystore-from-the-app
+key.properties

example/android/app/build.gradle

+def localProperties = new Properties()
+def localPropertiesFile = rootProject.file('local.properties')
+if (localPropertiesFile.exists()) {
+    localPropertiesFile.withReader('UTF-8') { reader ->
+        localProperties.load(reader)
+    }
+}
+
+def flutterRoot = localProperties.getProperty('flutter.sdk')
+if (flutterRoot == null) {
+    throw new GradleException("Flutter SDK not found. Define location with flutter.sdk in the local.properties file.")
+}
+
+def flutterVersionCode = localProperties.getProperty('flutter.versionCode')
+if (flutterVersionCode == null) {
+    flutterVersionCode = '1'
+}
+
+def flutterVersionName = localProperties.getProperty('flutter.versionName')
+if (flutterVersionName == null) {
+    flutterVersionName = '1.0'
+}
+
+apply plugin: 'com.android.application'
+apply plugin: 'kotlin-android'
+apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"
+
+android {
+    compileSdkVersion 30
+
+    sourceSets {
+        main.java.srcDirs += 'src/main/kotlin'
+    }
+
+    defaultConfig {
+        // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
+        applicationId "com.demo_package_ui_semantic"
+        minSdkVersion 16
+        targetSdkVersion 30
+        versionCode flutterVersionCode.toInteger()
+        versionName flutterVersionName
+    }
+
+    buildTypes {
+        release {
+            // TODO: Add your own signing config for the release build.
+            // Signing with the debug keys for now, so `flutter run --release` works.
+            signingConfig signingConfigs.debug
+        }
+    }
+}
+
+flutter {
+    source '../..'
+}
+
+dependencies {
+    implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"
+}

example/android/app/src/debug/AndroidManifest.xml

+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    package="com.demo_package_ui_semantic">
+    <!-- Flutter needs it to communicate with the running application
+         to allow setting breakpoints, to provide hot reload, etc.
+    -->
+    <uses-permission android:name="android.permission.INTERNET"/>
+</manifest>

example/android/app/src/main/AndroidManifest.xml

+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    package="com.demo_package_ui_semantic">
+   <application
+        android:label="Demo Package UI Semantic"
+        android:icon="@mipmap/ic_launcher">
+        <activity
+            android:name=".MainActivity"
+            android:launchMode="singleTop"
+            android:theme="@style/LaunchTheme"
+            android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
+            android:hardwareAccelerated="true"
+            android:windowSoftInputMode="adjustResize">
+            <!-- Specifies an Android theme to apply to this Activity as soon as
+                 the Android process has started. This theme is visible to the user
+                 while the Flutter UI initializes. After that, this theme continues
+                 to determine the Window background behind the Flutter UI. -->
+            <meta-data
+              android:name="io.flutter.embedding.android.NormalTheme"
+              android:resource="@style/NormalTheme"
+              />
+            <!-- Displays an Android View that continues showing the launch screen
+                 Drawable until Flutter paints its first frame, then this splash
+                 screen fades out. A splash screen is useful to avoid any visual
+                 gap between the end of Android's launch screen and the painting of
+                 Flutter's first frame. -->
+            <meta-data
+              android:name="io.flutter.embedding.android.SplashScreenDrawable"
+              android:resource="@drawable/launch_background"
+              />
+            <intent-filter>
+                <action android:name="android.intent.action.MAIN"/>
+                <category android:name="android.intent.category.LAUNCHER"/>
+            </intent-filter>
+        </activity>
+        <!-- Don't delete the meta-data below.
+             This is used by the Flutter tool to generate GeneratedPluginRegistrant.java -->
+        <meta-data
+            android:name="flutterEmbedding"
+            android:value="2" />
+    </application>
+</manifest>

example/android/app/src/main/kotlin/com/example/example/MainActivity.kt

+package com.demo_package_ui_semantic
+
+import io.flutter.embedding.android.FlutterActivity
+
+class MainActivity: FlutterActivity() {
+}

example/android/app/src/main/res/drawable-v21/launch_background.xml

+<?xml version="1.0" encoding="utf-8"?>
+<!-- Modify this file to customize your launch splash screen -->
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:drawable="?android:colorBackground" />
+
+    <!-- You can insert your own image assets here -->
+    <!-- <item>
+        <bitmap
+            android:gravity="center"
+            android:src="@mipmap/launch_image" />
+    </item> -->
+</layer-list>

example/android/app/src/main/res/drawable/launch_background.xml

+<?xml version="1.0" encoding="utf-8"?>
+<!-- Modify this file to customize your launch splash screen -->
+<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:drawable="@android:color/white" />
+
+    <!-- You can insert your own image assets here -->
+    <!-- <item>
+        <bitmap
+            android:gravity="center"
+            android:src="@mipmap/launch_image" />
+    </item> -->
+</layer-list>

example/android/app/src/main/res/values-night/styles.xml

+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <!-- Theme applied to the Android Window while the process is starting when the OS's Dark Mode setting is on -->
+    <style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
+        <!-- Show a splash screen on the activity. Automatically removed when
+             Flutter draws its first frame -->
+        <item name="android:windowBackground">@drawable/launch_background</item>
+    </style>
+    <!-- Theme applied to the Android Window as soon as the process has started.
+         This theme determines the color of the Android Window while your
+         Flutter UI initializes, as well as behind your Flutter UI while its
+         running.
+         
+         This Theme is only used starting with V2 of Flutter's Android embedding. -->
+    <style name="NormalTheme" parent="@android:style/Theme.Black.NoTitleBar">
+        <item name="android:windowBackground">?android:colorBackground</item>
+    </style>
+</resources>

example/android/app/src/main/res/values/styles.xml

+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <!-- Theme applied to the Android Window while the process is starting when the OS's Dark Mode setting is off -->
+    <style name="LaunchTheme" parent="@android:style/Theme.Light.NoTitleBar">
+        <!-- Show a splash screen on the activity. Automatically removed when
+             Flutter draws its first frame -->
+        <item name="android:windowBackground">@drawable/launch_background</item>
+    </style>
+    <!-- Theme applied to the Android Window as soon as the process has started.
+         This theme determines the color of the Android Window while your
+         Flutter UI initializes, as well as behind your Flutter UI while its
+         running.
+         
+         This Theme is only used starting with V2 of Flutter's Android embedding. -->
+    <style name="NormalTheme" parent="@android:style/Theme.Light.NoTitleBar">
+        <item name="android:windowBackground">?android:colorBackground</item>
+    </style>
+</resources>

example/android/app/src/profile/AndroidManifest.xml

+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+    package="com.demo_package_ui_semantic">
+    <!-- Flutter needs it to communicate with the running application
+         to allow setting breakpoints, to provide hot reload, etc.
+    -->
+    <uses-permission android:name="android.permission.INTERNET"/>
+</manifest>

example/android/build.gradle

+buildscript {
+    ext.kotlin_version = '1.3.50'
+    repositories {
+        google()
+        jcenter()
+    }
+
+    dependencies {
+        classpath 'com.android.tools.build:gradle:4.1.0'
+        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
+    }
+}
+
+allprojects {
+    repositories {
+        google()
+        jcenter()
+    }
+}
+
+rootProject.buildDir = '../build'
+subprojects {
+    project.buildDir = "${rootProject.buildDir}/${project.name}"
+}
+subprojects {
+    project.evaluationDependsOn(':app')
+}
+
+task clean(type: Delete) {
+    delete rootProject.buildDir
+}

example/android/gradle.properties

+org.gradle.jvmargs=-Xmx1536M
+android.useAndroidX=true
+android.enableJetifier=true

example/android/gradle/wrapper/gradle-wrapper.properties

+#Fri Jun 23 08:50:38 CEST 2017
+distributionBase=GRADLE_USER_HOME
+distributionPath=wrapper/dists
+zipStoreBase=GRADLE_USER_HOME
+zipStorePath=wrapper/dists
+distributionUrl=https\://services.gradle.org/distributions/gradle-6.7-all.zip

example/android/settings.gradle

+include ':app'
+
+def localPropertiesFile = new File(rootProject.projectDir, "local.properties")
+def properties = new Properties()
+
+assert localPropertiesFile.exists()
+localPropertiesFile.withReader("UTF-8") { reader -> properties.load(reader) }
+
+def flutterSdkPath = properties.getProperty("flutter.sdk")
+assert flutterSdkPath != null, "flutter.sdk not set in local.properties"
+apply from: "$flutterSdkPath/packages/flutter_tools/gradle/app_plugin_loader.gradle"

example/ios/.gitignore

+*.mode1v3
+*.mode2v3
+*.moved-aside
+*.pbxuser
+*.perspectivev3
+**/*sync/
+.sconsign.dblite
+.tags*
+**/.vagrant/
+**/DerivedData/
+Icon?
+**/Pods/
+**/.symlinks/
+profile
+xcuserdata
+**/.generated/
+Flutter/App.framework
+Flutter/Flutter.framework
+Flutter/Flutter.podspec
+Flutter/Generated.xcconfig
+Flutter/app.flx
+Flutter/app.zip
+Flutter/flutter_assets/
+Flutter/flutter_export_environment.sh
+ServiceDefinitions.json
+Runner/GeneratedPluginRegistrant.*
+
+# Exceptions to above rules.
+!default.mode1v3
+!default.mode2v3
+!default.pbxuser
+!default.perspectivev3

example/ios/Flutter/AppFrameworkInfo.plist

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+  <key>CFBundleDevelopmentRegion</key>
+  <string>en</string>
+  <key>CFBundleExecutable</key>
+  <string>App</string>
+  <key>CFBundleIdentifier</key>
+  <string>io.flutter.flutter.app</string>
+  <key>CFBundleInfoDictionaryVersion</key>
+  <string>6.0</string>
+  <key>CFBundleName</key>
+  <string>App</string>
+  <key>CFBundlePackageType</key>
+  <string>FMWK</string>
+  <key>CFBundleShortVersionString</key>
+  <string>1.0</string>
+  <key>CFBundleSignature</key>
+  <string>????</string>
+  <key>CFBundleVersion</key>
+  <string>1.0</string>
+  <key>MinimumOSVersion</key>
+  <string>8.0</string>
+</dict>
+</plist>

example/ios/Flutter/Debug.xcconfig

+#include "Generated.xcconfig"

example/ios/Flutter/Release.xcconfig

+#include "Generated.xcconfig"

example/ios/Runner.xcodeproj/project.pbxproj

+// !$*UTF8*$!
+{
+	archiveVersion = 1;
+	classes = {
+	};
+	objectVersion = 46;
+	objects = {
+
+/* Begin PBXBuildFile section */
+		1498D2341E8E89220040F4C2 /* GeneratedPluginRegistrant.m in Sources */ = {isa = PBXBuildFile; fileRef = 1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */; };
+		3B3967161E833CAA004F5970 /* AppFrameworkInfo.plist in Resources */ = {isa = PBXBuildFile; fileRef = 3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */; };
+		74858FAF1ED2DC5600515810 /* AppDelegate.swift in Sources */ = {isa = PBXBuildFile; fileRef = 74858FAE1ED2DC5600515810 /* AppDelegate.swift */; };
+		97C146FC1CF9000F007C117D /* Main.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 97C146FA1CF9000F007C117D /* Main.storyboard */; };
+		97C146FE1CF9000F007C117D /* Assets.xcassets in Resources */ = {isa = PBXBuildFile; fileRef = 97C146FD1CF9000F007C117D /* Assets.xcassets */; };
+		97C147011CF9000F007C117D /* LaunchScreen.storyboard in Resources */ = {isa = PBXBuildFile; fileRef = 97C146FF1CF9000F007C117D /* LaunchScreen.storyboard */; };
+/* End PBXBuildFile section */
+
+/* Begin PBXCopyFilesBuildPhase section */
+		9705A1C41CF9048500538489 /* Embed Frameworks */ = {
+			isa = PBXCopyFilesBuildPhase;
+			buildActionMask = 2147483647;
+			dstPath = "";
+			dstSubfolderSpec = 10;
+			files = (
+			);
+			name = "Embed Frameworks";
+			runOnlyForDeploymentPostprocessing = 0;
+		};
+/* End PBXCopyFilesBuildPhase section */
+
+/* Begin PBXFileReference section */
+		1498D2321E8E86230040F4C2 /* GeneratedPluginRegistrant.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = GeneratedPluginRegistrant.h; sourceTree = "<group>"; };
+		1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.c.objc; path = GeneratedPluginRegistrant.m; sourceTree = "<group>"; };
+		3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.plist.xml; name = AppFrameworkInfo.plist; path = Flutter/AppFrameworkInfo.plist; sourceTree = "<group>"; };
+		74858FAD1ED2DC5600515810 /* Runner-Bridging-Header.h */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.c.h; path = "Runner-Bridging-Header.h"; sourceTree = "<group>"; };
+		74858FAE1ED2DC5600515810 /* AppDelegate.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = AppDelegate.swift; sourceTree = "<group>"; };
+		7AFA3C8E1D35360C0083082E /* Release.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; name = Release.xcconfig; path = Flutter/Release.xcconfig; sourceTree = "<group>"; };
+		9740EEB21CF90195004384FC /* Debug.xcconfig */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xcconfig; name = Debug.xcconfig; path = Flutter/Debug.xcconfig; sourceTree = "<group>"; };
+		9740EEB31CF90195004384FC /* Generated.xcconfig */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.xcconfig; name = Generated.xcconfig; path = Flutter/Generated.xcconfig; sourceTree = "<group>"; };
+		97C146EE1CF9000F007C117D /* Runner.app */ = {isa = PBXFileReference; explicitFileType = wrapper.application; includeInIndex = 0; path = Runner.app; sourceTree = BUILT_PRODUCTS_DIR; };
+		97C146FB1CF9000F007C117D /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/Main.storyboard; sourceTree = "<group>"; };
+		97C146FD1CF9000F007C117D /* Assets.xcassets */ = {isa = PBXFileReference; lastKnownFileType = folder.assetcatalog; path = Assets.xcassets; sourceTree = "<group>"; };
+		97C147001CF9000F007C117D /* Base */ = {isa = PBXFileReference; lastKnownFileType = file.storyboard; name = Base; path = Base.lproj/LaunchScreen.storyboard; sourceTree = "<group>"; };
+		97C147021CF9000F007C117D /* Info.plist */ = {isa = PBXFileReference; lastKnownFileType = text.plist.xml; path = Info.plist; sourceTree = "<group>"; };
+/* End PBXFileReference section */
+
+/* Begin PBXFrameworksBuildPhase section */
+		97C146EB1CF9000F007C117D /* Frameworks */ = {
+			isa = PBXFrameworksBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+		};
+/* End PBXFrameworksBuildPhase section */
+
+/* Begin PBXGroup section */
+		9740EEB11CF90186004384FC /* Flutter */ = {
+			isa = PBXGroup;
+			children = (
+				3B3967151E833CAA004F5970 /* AppFrameworkInfo.plist */,
+				9740EEB21CF90195004384FC /* Debug.xcconfig */,
+				7AFA3C8E1D35360C0083082E /* Release.xcconfig */,
+				9740EEB31CF90195004384FC /* Generated.xcconfig */,
+			);
+			name = Flutter;
+			sourceTree = "<group>";
+		};
+		97C146E51CF9000F007C117D = {
+			isa = PBXGroup;
+			children = (
+				9740EEB11CF90186004384FC /* Flutter */,
+				97C146F01CF9000F007C117D /* Runner */,
+				97C146EF1CF9000F007C117D /* Products */,
+			);
+			sourceTree = "<group>";
+		};
+		97C146EF1CF9000F007C117D /* Products */ = {
+			isa = PBXGroup;
+			children = (
+				97C146EE1CF9000F007C117D /* Runner.app */,
+			);
+			name = Products;
+			sourceTree = "<group>";
+		};
+		97C146F01CF9000F007C117D /* Runner */ = {
+			isa = PBXGroup;
+			children = (
+				97C146FA1CF9000F007C117D /* Main.storyboard */,
+				97C146FD1CF9000F007C117D /* Assets.xcassets */,
+				97C146FF1CF9000F007C117D /* LaunchScreen.storyboard */,
+				97C147021CF9000F007C117D /* Info.plist */,
+				1498D2321E8E86230040F4C2 /* GeneratedPluginRegistrant.h */,
+				1498D2331E8E89220040F4C2 /* GeneratedPluginRegistrant.m */,
+				74858FAE1ED2DC5600515810 /* AppDelegate.swift */,
+				74858FAD1ED2DC5600515810 /* Runner-Bridging-Header.h */,
+			);
+			path = Runner;
+			sourceTree = "<group>";
+		};
+/* End PBXGroup section */
+
+/* Begin PBXNativeTarget section */
+		97C146ED1CF9000F007C117D /* Runner */ = {
+			isa = PBXNativeTarget;
+			buildConfigurationList = 97C147051CF9000F007C117D /* Build configuration list for PBXNativeTarget "Runner" */;
+			buildPhases = (
+				9740EEB61CF901F6004384FC /* Run Script */,
+				97C146EA1CF9000F007C117D /* Sources */,
+				97C146EB1CF9000F007C117D /* Frameworks */,
+				97C146EC1CF9000F007C117D /* Resources */,
+				9705A1C41CF9048500538489 /* Embed Frameworks */,
+				3B06AD1E1E4923F5004D2608 /* Thin Binary */,
+			);
+			buildRules = (
+			);
+			dependencies = (
+			);
+			name = Runner;
+			productName = Runner;
+			productReference = 97C146EE1CF9000F007C117D /* Runner.app */;
+			productType = "com.apple.product-type.application";
+		};
+/* End PBXNativeTarget section */
+
+/* Begin PBXProject section */
+		97C146E61CF9000F007C117D /* Project object */ = {
+			isa = PBXProject;
+			attributes = {
+				LastUpgradeCheck = 1020;
+				ORGANIZATIONNAME = "";
+				TargetAttributes = {
+					97C146ED1CF9000F007C117D = {
+						CreatedOnToolsVersion = 7.3.1;
+						LastSwiftMigration = 1100;
+					};
+				};
+			};
+			buildConfigurationList = 97C146E91CF9000F007C117D /* Build configuration list for PBXProject "Runner" */;
+			compatibilityVersion = "Xcode 9.3";
+			developmentRegion = en;
+			hasScannedForEncodings = 0;
+			knownRegions = (
+				en,
+				Base,
+			);
+			mainGroup = 97C146E51CF9000F007C117D;
+			productRefGroup = 97C146EF1CF9000F007C117D /* Products */;
+			projectDirPath = "";
+			projectRoot = "";
+			targets = (
+				97C146ED1CF9000F007C117D /* Runner */,
+			);
+		};
+/* End PBXProject section */
+
+/* Begin PBXResourcesBuildPhase section */
+		97C146EC1CF9000F007C117D /* Resources */ = {
+			isa = PBXResourcesBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+				97C147011CF9000F007C117D /* LaunchScreen.storyboard in Resources */,
+				3B3967161E833CAA004F5970 /* AppFrameworkInfo.plist in Resources */,
+				97C146FE1CF9000F007C117D /* Assets.xcassets in Resources */,
+				97C146FC1CF9000F007C117D /* Main.storyboard in Resources */,
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+		};
+/* End PBXResourcesBuildPhase section */
+
+/* Begin PBXShellScriptBuildPhase section */
+		3B06AD1E1E4923F5004D2608 /* Thin Binary */ = {
+			isa = PBXShellScriptBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+			);
+			inputPaths = (
+			);
+			name = "Thin Binary";
+			outputPaths = (
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+			shellPath = /bin/sh;
+			shellScript = "/bin/sh \"$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh\" embed_and_thin";
+		};
+		9740EEB61CF901F6004384FC /* Run Script */ = {
+			isa = PBXShellScriptBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+			);
+			inputPaths = (
+			);
+			name = "Run Script";
+			outputPaths = (
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+			shellPath = /bin/sh;
+			shellScript = "/bin/sh \"$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh\" build";
+		};
+/* End PBXShellScriptBuildPhase section */
+
+/* Begin PBXSourcesBuildPhase section */
+		97C146EA1CF9000F007C117D /* Sources */ = {
+			isa = PBXSourcesBuildPhase;
+			buildActionMask = 2147483647;
+			files = (
+				74858FAF1ED2DC5600515810 /* AppDelegate.swift in Sources */,
+				1498D2341E8E89220040F4C2 /* GeneratedPluginRegistrant.m in Sources */,
+			);
+			runOnlyForDeploymentPostprocessing = 0;
+		};
+/* End PBXSourcesBuildPhase section */
+
+/* Begin PBXVariantGroup section */
+		97C146FA1CF9000F007C117D /* Main.storyboard */ = {
+			isa = PBXVariantGroup;
+			children = (
+				97C146FB1CF9000F007C117D /* Base */,
+			);
+			name = Main.storyboard;
+			sourceTree = "<group>";
+		};
+		97C146FF1CF9000F007C117D /* LaunchScreen.storyboard */ = {
+			isa = PBXVariantGroup;
+			children = (
+				97C147001CF9000F007C117D /* Base */,
+			);
+			name = LaunchScreen.storyboard;
+			sourceTree = "<group>";
+		};
+/* End PBXVariantGroup section */
+
+/* Begin XCBuildConfiguration section */
+		249021D3217E4FDB00AE95B9 /* Profile */ = {
+			isa = XCBuildConfiguration;
+			buildSettings = {
+				ALWAYS_SEARCH_USER_PATHS = NO;
+				CLANG_ANALYZER_NONNULL = YES;
+				CLANG_CXX_LANGUAGE_STANDARD = "gnu++0x";
+				CLANG_CXX_LIBRARY = "libc++";
+				CLANG_ENABLE_MODULES = YES;
+				CLANG_ENABLE_OBJC_ARC = YES;
+				CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
+				CLANG_WARN_BOOL_CONVERSION = YES;
+				CLANG_WARN_COMMA = YES;
+				CLANG_WARN_CONSTANT_CONVERSION = YES;
+				CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
+				CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
+				CLANG_WARN_EMPTY_BODY = YES;
+				CLANG_WARN_ENUM_CONVERSION = YES;
+				CLANG_WARN_INFINITE_RECURSION = YES;
+				CLANG_WARN_INT_CONVERSION = YES;
+				CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
+				CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
+				CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
+				CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
+				CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
+				CLANG_WARN_STRICT_PROTOTYPES = YES;
+				CLANG_WARN_SUSPICIOUS_MOVE = YES;
+				CLANG_WARN_UNREACHABLE_CODE = YES;
+				CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
+				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
+				COPY_PHASE_STRIP = NO;
+				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
+				ENABLE_NS_ASSERTIONS = NO;
+				ENABLE_STRICT_OBJC_MSGSEND = YES;
+				GCC_C_LANGUAGE_STANDARD = gnu99;
+				GCC_NO_COMMON_BLOCKS = YES;
+				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
+				GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
+				GCC_WARN_UNDECLARED_SELECTOR = YES;
+				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
+				GCC_WARN_UNUSED_FUNCTION = YES;
+				GCC_WARN_UNUSED_VARIABLE = YES;
+				IPHONEOS_DEPLOYMENT_TARGET = 9.0;
+				MTL_ENABLE_DEBUG_INFO = NO;
+				SDKROOT = iphoneos;
+				SUPPORTED_PLATFORMS = iphoneos;
+				TARGETED_DEVICE_FAMILY = "1,2";
+				VALIDATE_PRODUCT = YES;
+			};
+			name = Profile;
+		};
+		249021D4217E4FDB00AE95B9 /* Profile */ = {
+			isa = XCBuildConfiguration;
+			baseConfigurationReference = 7AFA3C8E1D35360C0083082E /* Release.xcconfig */;
+			buildSettings = {
+				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
+				CLANG_ENABLE_MODULES = YES;
+				CURRENT_PROJECT_VERSION = "$(FLUTTER_BUILD_NUMBER)";
+				ENABLE_BITCODE = NO;
+				INFOPLIST_FILE = Runner/Info.plist;
+				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
+				PRODUCT_BUNDLE_IDENTIFIER = com.demo_package_ui_semantic;
+				PRODUCT_NAME = "$(TARGET_NAME)";
+				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
+				SWIFT_VERSION = 5.0;
+				VERSIONING_SYSTEM = "apple-generic";
+			};
+			name = Profile;
+		};
+		97C147031CF9000F007C117D /* Debug */ = {
+			isa = XCBuildConfiguration;
+			buildSettings = {
+				ALWAYS_SEARCH_USER_PATHS = NO;
+				CLANG_ANALYZER_NONNULL = YES;
+				CLANG_CXX_LANGUAGE_STANDARD = "gnu++0x";
+				CLANG_CXX_LIBRARY = "libc++";
+				CLANG_ENABLE_MODULES = YES;
+				CLANG_ENABLE_OBJC_ARC = YES;
+				CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
+				CLANG_WARN_BOOL_CONVERSION = YES;
+				CLANG_WARN_COMMA = YES;
+				CLANG_WARN_CONSTANT_CONVERSION = YES;
+				CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
+				CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
+				CLANG_WARN_EMPTY_BODY = YES;
+				CLANG_WARN_ENUM_CONVERSION = YES;
+				CLANG_WARN_INFINITE_RECURSION = YES;
+				CLANG_WARN_INT_CONVERSION = YES;
+				CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
+				CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
+				CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
+				CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
+				CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
+				CLANG_WARN_STRICT_PROTOTYPES = YES;
+				CLANG_WARN_SUSPICIOUS_MOVE = YES;
+				CLANG_WARN_UNREACHABLE_CODE = YES;
+				CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
+				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
+				COPY_PHASE_STRIP = NO;
+				DEBUG_INFORMATION_FORMAT = dwarf;
+				ENABLE_STRICT_OBJC_MSGSEND = YES;
+				ENABLE_TESTABILITY = YES;
+				GCC_C_LANGUAGE_STANDARD = gnu99;
+				GCC_DYNAMIC_NO_PIC = NO;
+				GCC_NO_COMMON_BLOCKS = YES;
+				GCC_OPTIMIZATION_LEVEL = 0;
+				GCC_PREPROCESSOR_DEFINITIONS = (
+					"DEBUG=1",
+					"$(inherited)",
+				);
+				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
+				GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
+				GCC_WARN_UNDECLARED_SELECTOR = YES;
+				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
+				GCC_WARN_UNUSED_FUNCTION = YES;
+				GCC_WARN_UNUSED_VARIABLE = YES;
+				IPHONEOS_DEPLOYMENT_TARGET = 9.0;
+				MTL_ENABLE_DEBUG_INFO = YES;
+				ONLY_ACTIVE_ARCH = YES;
+				SDKROOT = iphoneos;
+				TARGETED_DEVICE_FAMILY = "1,2";
+			};
+			name = Debug;
+		};
+		97C147041CF9000F007C117D /* Release */ = {
+			isa = XCBuildConfiguration;
+			buildSettings = {
+				ALWAYS_SEARCH_USER_PATHS = NO;
+				CLANG_ANALYZER_NONNULL = YES;
+				CLANG_CXX_LANGUAGE_STANDARD = "gnu++0x";
+				CLANG_CXX_LIBRARY = "libc++";
+				CLANG_ENABLE_MODULES = YES;
+				CLANG_ENABLE_OBJC_ARC = YES;
+				CLANG_WARN_BLOCK_CAPTURE_AUTORELEASING = YES;
+				CLANG_WARN_BOOL_CONVERSION = YES;
+				CLANG_WARN_COMMA = YES;
+				CLANG_WARN_CONSTANT_CONVERSION = YES;
+				CLANG_WARN_DEPRECATED_OBJC_IMPLEMENTATIONS = YES;
+				CLANG_WARN_DIRECT_OBJC_ISA_USAGE = YES_ERROR;
+				CLANG_WARN_EMPTY_BODY = YES;
+				CLANG_WARN_ENUM_CONVERSION = YES;
+				CLANG_WARN_INFINITE_RECURSION = YES;
+				CLANG_WARN_INT_CONVERSION = YES;
+				CLANG_WARN_NON_LITERAL_NULL_CONVERSION = YES;
+				CLANG_WARN_OBJC_IMPLICIT_RETAIN_SELF = YES;
+				CLANG_WARN_OBJC_LITERAL_CONVERSION = YES;
+				CLANG_WARN_OBJC_ROOT_CLASS = YES_ERROR;
+				CLANG_WARN_RANGE_LOOP_ANALYSIS = YES;
+				CLANG_WARN_STRICT_PROTOTYPES = YES;
+				CLANG_WARN_SUSPICIOUS_MOVE = YES;
+				CLANG_WARN_UNREACHABLE_CODE = YES;
+				CLANG_WARN__DUPLICATE_METHOD_MATCH = YES;
+				"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
+				COPY_PHASE_STRIP = NO;
+				DEBUG_INFORMATION_FORMAT = "dwarf-with-dsym";
+				ENABLE_NS_ASSERTIONS = NO;
+				ENABLE_STRICT_OBJC_MSGSEND = YES;
+				GCC_C_LANGUAGE_STANDARD = gnu99;
+				GCC_NO_COMMON_BLOCKS = YES;
+				GCC_WARN_64_TO_32_BIT_CONVERSION = YES;
+				GCC_WARN_ABOUT_RETURN_TYPE = YES_ERROR;
+				GCC_WARN_UNDECLARED_SELECTOR = YES;
+				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
+				GCC_WARN_UNUSED_FUNCTION = YES;
+				GCC_WARN_UNUSED_VARIABLE = YES;
+				IPHONEOS_DEPLOYMENT_TARGET = 9.0;
+				MTL_ENABLE_DEBUG_INFO = NO;
+				SDKROOT = iphoneos;
+				SUPPORTED_PLATFORMS = iphoneos;
+				SWIFT_OPTIMIZATION_LEVEL = "-Owholemodule";
+				TARGETED_DEVICE_FAMILY = "1,2";
+				VALIDATE_PRODUCT = YES;
+			};
+			name = Release;
+		};
+		97C147061CF9000F007C117D /* Debug */ = {
+			isa = XCBuildConfiguration;
+			baseConfigurationReference = 9740EEB21CF90195004384FC /* Debug.xcconfig */;
+			buildSettings = {
+				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
+				CLANG_ENABLE_MODULES = YES;
+				CURRENT_PROJECT_VERSION = "$(FLUTTER_BUILD_NUMBER)";
+				ENABLE_BITCODE = NO;
+				INFOPLIST_FILE = Runner/Info.plist;
+				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
+				PRODUCT_BUNDLE_IDENTIFIER = com.demo_package_ui_semantic;
+				PRODUCT_NAME = "$(TARGET_NAME)";
+				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
+				SWIFT_OPTIMIZATION_LEVEL = "-Onone";
+				SWIFT_VERSION = 5.0;
+				VERSIONING_SYSTEM = "apple-generic";
+			};
+			name = Debug;
+		};
+		97C147071CF9000F007C117D /* Release */ = {
+			isa = XCBuildConfiguration;
+			baseConfigurationReference = 7AFA3C8E1D35360C0083082E /* Release.xcconfig */;
+			buildSettings = {
+				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
+				CLANG_ENABLE_MODULES = YES;
+				CURRENT_PROJECT_VERSION = "$(FLUTTER_BUILD_NUMBER)";
+				ENABLE_BITCODE = NO;
+				INFOPLIST_FILE = Runner/Info.plist;
+				LD_RUNPATH_SEARCH_PATHS = "$(inherited) @executable_path/Frameworks";
+				PRODUCT_BUNDLE_IDENTIFIER = com.demo_package_ui_semantic;
+				PRODUCT_NAME = "$(TARGET_NAME)";
+				SWIFT_OBJC_BRIDGING_HEADER = "Runner/Runner-Bridging-Header.h";
+				SWIFT_VERSION = 5.0;
+				VERSIONING_SYSTEM = "apple-generic";
+			};
+			name = Release;
+		};
+/* End XCBuildConfiguration section */
+
+/* Begin XCConfigurationList section */
+		97C146E91CF9000F007C117D /* Build configuration list for PBXProject "Runner" */ = {
+			isa = XCConfigurationList;
+			buildConfigurations = (
+				97C147031CF9000F007C117D /* Debug */,
+				97C147041CF9000F007C117D /* Release */,
+				249021D3217E4FDB00AE95B9 /* Profile */,
+			);
+			defaultConfigurationIsVisible = 0;
+			defaultConfigurationName = Release;
+		};
+		97C147051CF9000F007C117D /* Build configuration list for PBXNativeTarget "Runner" */ = {
+			isa = XCConfigurationList;
+			buildConfigurations = (
+				97C147061CF9000F007C117D /* Debug */,
+				97C147071CF9000F007C117D /* Release */,
+				249021D4217E4FDB00AE95B9 /* Profile */,
+			);
+			defaultConfigurationIsVisible = 0;
+			defaultConfigurationName = Release;
+		};
+/* End XCConfigurationList section */
+	};
+	rootObject = 97C146E61CF9000F007C117D /* Project object */;
+}

example/ios/Runner.xcodeproj/project.xcworkspace/contents.xcworkspacedata

+<?xml version="1.0" encoding="UTF-8"?>
+<Workspace
+   version = "1.0">
+   <FileRef
+      location = "self:">
+   </FileRef>
+</Workspace>

example/ios/Runner.xcodeproj/project.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>IDEDidComputeMac32BitWarning</key>
+	<true/>
+</dict>
+</plist>

example/ios/Runner.xcodeproj/project.xcworkspace/xcshareddata/WorkspaceSettings.xcsettings

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>PreviewsEnabled</key>
+	<false/>
+</dict>
+</plist>

example/ios/Runner.xcodeproj/xcshareddata/xcschemes/Runner.xcscheme

+<?xml version="1.0" encoding="UTF-8"?>
+<Scheme
+   LastUpgradeVersion = "1020"
+   version = "1.3">
+   <BuildAction
+      parallelizeBuildables = "YES"
+      buildImplicitDependencies = "YES">
+      <BuildActionEntries>
+         <BuildActionEntry
+            buildForTesting = "YES"
+            buildForRunning = "YES"
+            buildForProfiling = "YES"
+            buildForArchiving = "YES"
+            buildForAnalyzing = "YES">
+            <BuildableReference
+               BuildableIdentifier = "primary"
+               BlueprintIdentifier = "97C146ED1CF9000F007C117D"
+               BuildableName = "Runner.app"
+               BlueprintName = "Runner"
+               ReferencedContainer = "container:Runner.xcodeproj">
+            </BuildableReference>
+         </BuildActionEntry>
+      </BuildActionEntries>
+   </BuildAction>
+   <TestAction
+      buildConfiguration = "Debug"
+      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
+      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
+      shouldUseLaunchSchemeArgsEnv = "YES">
+      <Testables>
+      </Testables>
+      <MacroExpansion>
+         <BuildableReference
+            BuildableIdentifier = "primary"
+            BlueprintIdentifier = "97C146ED1CF9000F007C117D"
+            BuildableName = "Runner.app"
+            BlueprintName = "Runner"
+            ReferencedContainer = "container:Runner.xcodeproj">
+         </BuildableReference>
+      </MacroExpansion>
+      <AdditionalOptions>
+      </AdditionalOptions>
+   </TestAction>
+   <LaunchAction
+      buildConfiguration = "Debug"
+      selectedDebuggerIdentifier = "Xcode.DebuggerFoundation.Debugger.LLDB"
+      selectedLauncherIdentifier = "Xcode.DebuggerFoundation.Launcher.LLDB"
+      launchStyle = "0"
+      useCustomWorkingDirectory = "NO"
+      ignoresPersistentStateOnLaunch = "NO"
+      debugDocumentVersioning = "YES"
+      debugServiceExtension = "internal"
+      allowLocationSimulation = "YES">
+      <BuildableProductRunnable
+         runnableDebuggingMode = "0">
+         <BuildableReference
+            BuildableIdentifier = "primary"
+            BlueprintIdentifier = "97C146ED1CF9000F007C117D"
+            BuildableName = "Runner.app"
+            BlueprintName = "Runner"
+            ReferencedContainer = "container:Runner.xcodeproj">
+         </BuildableReference>
+      </BuildableProductRunnable>
+      <AdditionalOptions>
+      </AdditionalOptions>
+   </LaunchAction>
+   <ProfileAction
+      buildConfiguration = "Profile"
+      shouldUseLaunchSchemeArgsEnv = "YES"
+      savedToolIdentifier = ""
+      useCustomWorkingDirectory = "NO"
+      debugDocumentVersioning = "YES">
+      <BuildableProductRunnable
+         runnableDebuggingMode = "0">
+         <BuildableReference
+            BuildableIdentifier = "primary"
+            BlueprintIdentifier = "97C146ED1CF9000F007C117D"
+            BuildableName = "Runner.app"
+            BlueprintName = "Runner"
+            ReferencedContainer = "container:Runner.xcodeproj">
+         </BuildableReference>
+      </BuildableProductRunnable>
+   </ProfileAction>
+   <AnalyzeAction
+      buildConfiguration = "Debug">
+   </AnalyzeAction>
+   <ArchiveAction
+      buildConfiguration = "Release"
+      revealArchiveInOrganizer = "YES">
+   </ArchiveAction>
+</Scheme>

example/ios/Runner.xcworkspace/contents.xcworkspacedata

+<?xml version="1.0" encoding="UTF-8"?>
+<Workspace
+   version = "1.0">
+   <FileRef
+      location = "group:Runner.xcodeproj">
+   </FileRef>
+</Workspace>

example/ios/Runner.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>IDEDidComputeMac32BitWarning</key>
+	<true/>
+</dict>
+</plist>

example/ios/Runner.xcworkspace/xcshareddata/WorkspaceSettings.xcsettings

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>PreviewsEnabled</key>
+	<false/>
+</dict>
+</plist>

example/ios/Runner/AppDelegate.swift

+import UIKit
+import Flutter
+
+@UIApplicationMain
+@objc class AppDelegate: FlutterAppDelegate {
+  override func application(
+    _ application: UIApplication,
+    didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
+  ) -> Bool {
+    GeneratedPluginRegistrant.register(with: self)
+    return super.application(application, didFinishLaunchingWithOptions: launchOptions)
+  }
+}

example/ios/Runner/Assets.xcassets/AppIcon.appiconset/Contents.json

+{
+  "images" : [
+    {
+      "size" : "20x20",
+      "idiom" : "iphone",
+      "filename" : "Icon-App-20x20@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "size" : "20x20",
+      "idiom" : "iphone",
+      "filename" : "Icon-App-20x20@3x.png",
+      "scale" : "3x"
+    },
+    {
+      "size" : "29x29",
+      "idiom" : "iphone",
+      "filename" : "Icon-App-29x29@1x.png",
+      "scale" : "1x"
+    },
+    {
+      "size" : "29x29",
+      "idiom" : "iphone",
+      "filename" : "Icon-App-29x29@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "size" : "29x29",
+      "idiom" : "iphone",
+      "filename" : "Icon-App-29x29@3x.png",
+      "scale" : "3x"
+    },
+    {
+      "size" : "40x40",
+      "idiom" : "iphone",
+      "filename" : "Icon-App-40x40@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "size" : "40x40",
+      "idiom" : "iphone",
+      "filename" : "Icon-App-40x40@3x.png",
+      "scale" : "3x"
+    },
+    {
+      "size" : "60x60",
+      "idiom" : "iphone",
+      "filename" : "Icon-App-60x60@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "size" : "60x60",
+      "idiom" : "iphone",
+      "filename" : "Icon-App-60x60@3x.png",
+      "scale" : "3x"
+    },
+    {
+      "size" : "20x20",
+      "idiom" : "ipad",
+      "filename" : "Icon-App-20x20@1x.png",
+      "scale" : "1x"
+    },
+    {
+      "size" : "20x20",
+      "idiom" : "ipad",
+      "filename" : "Icon-App-20x20@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "size" : "29x29",
+      "idiom" : "ipad",
+      "filename" : "Icon-App-29x29@1x.png",
+      "scale" : "1x"
+    },
+    {
+      "size" : "29x29",
+      "idiom" : "ipad",
+      "filename" : "Icon-App-29x29@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "size" : "40x40",
+      "idiom" : "ipad",
+      "filename" : "Icon-App-40x40@1x.png",
+      "scale" : "1x"
+    },
+    {
+      "size" : "40x40",
+      "idiom" : "ipad",
+      "filename" : "Icon-App-40x40@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "size" : "76x76",
+      "idiom" : "ipad",
+      "filename" : "Icon-App-76x76@1x.png",
+      "scale" : "1x"
+    },
+    {
+      "size" : "76x76",
+      "idiom" : "ipad",
+      "filename" : "Icon-App-76x76@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "size" : "83.5x83.5",
+      "idiom" : "ipad",
+      "filename" : "Icon-App-83.5x83.5@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "size" : "1024x1024",
+      "idiom" : "ios-marketing",
+      "filename" : "Icon-App-1024x1024@1x.png",
+      "scale" : "1x"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

example/ios/Runner/Assets.xcassets/LaunchImage.imageset/Contents.json

+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "filename" : "LaunchImage.png",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "filename" : "LaunchImage@2x.png",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "filename" : "LaunchImage@3x.png",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

example/ios/Runner/Assets.xcassets/LaunchImage.imageset/README.md

+# Launch Screen Assets
+
+You can customize the launch screen with your own desired assets by replacing the image files in this directory.
+
+You can also do it by opening your Flutter project's Xcode project with `open ios/Runner.xcworkspace`, selecting `Runner/Assets.xcassets` in the Project Navigator and dropping in the desired images.
\ No newline at end of file

example/ios/Runner/Base.lproj/LaunchScreen.storyboard

+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="12121" systemVersion="16G29" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" launchScreen="YES" colorMatched="YES" initialViewController="01J-lp-oVM">
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="12089"/>
+    </dependencies>
+    <scenes>
+        <!--View Controller-->
+        <scene sceneID="EHf-IW-A2E">
+            <objects>
+                <viewController id="01J-lp-oVM" sceneMemberID="viewController">
+                    <layoutGuides>
+                        <viewControllerLayoutGuide type="top" id="Ydg-fD-yQy"/>
+                        <viewControllerLayoutGuide type="bottom" id="xbc-2k-c8Z"/>
+                    </layoutGuides>
+                    <view key="view" contentMode="scaleToFill" id="Ze5-6b-2t3">
+                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
+                        <subviews>
+                            <imageView opaque="NO" clipsSubviews="YES" multipleTouchEnabled="YES" contentMode="center" image="LaunchImage" translatesAutoresizingMaskIntoConstraints="NO" id="YRO-k0-Ey4">
+                            </imageView>
+                        </subviews>
+                        <color key="backgroundColor" red="1" green="1" blue="1" alpha="1" colorSpace="custom" customColorSpace="sRGB"/>
+                        <constraints>
+                            <constraint firstItem="YRO-k0-Ey4" firstAttribute="centerX" secondItem="Ze5-6b-2t3" secondAttribute="centerX" id="1a2-6s-vTC"/>
+                            <constraint firstItem="YRO-k0-Ey4" firstAttribute="centerY" secondItem="Ze5-6b-2t3" secondAttribute="centerY" id="4X2-HB-R7a"/>
+                        </constraints>
+                    </view>
+                </viewController>
+                <placeholder placeholderIdentifier="IBFirstResponder" id="iYj-Kq-Ea1" userLabel="First Responder" sceneMemberID="firstResponder"/>
+            </objects>
+            <point key="canvasLocation" x="53" y="375"/>
+        </scene>
+    </scenes>
+    <resources>
+        <image name="LaunchImage" width="168" height="185"/>
+    </resources>
+</document>

example/ios/Runner/Base.lproj/Main.storyboard

+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<document type="com.apple.InterfaceBuilder3.CocoaTouch.Storyboard.XIB" version="3.0" toolsVersion="10117" systemVersion="15F34" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" initialViewController="BYZ-38-t0r">
+    <dependencies>
+        <deployment identifier="iOS"/>
+        <plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="10085"/>
+    </dependencies>
+    <scenes>
+        <!--Flutter View Controller-->
+        <scene sceneID="tne-QT-ifu">
+            <objects>
+                <viewController id="BYZ-38-t0r" customClass="FlutterViewController" sceneMemberID="viewController">
+                    <layoutGuides>
+                        <viewControllerLayoutGuide type="top" id="y3c-jy-aDJ"/>
+                        <viewControllerLayoutGuide type="bottom" id="wfy-db-euE"/>
+                    </layoutGuides>
+                    <view key="view" contentMode="scaleToFill" id="8bC-Xf-vdC">
+                        <rect key="frame" x="0.0" y="0.0" width="600" height="600"/>
+                        <autoresizingMask key="autoresizingMask" widthSizable="YES" heightSizable="YES"/>
+                        <color key="backgroundColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
+                    </view>
+                </viewController>
+                <placeholder placeholderIdentifier="IBFirstResponder" id="dkx-z0-nzr" sceneMemberID="firstResponder"/>
+            </objects>
+        </scene>
+    </scenes>
+</document>

example/ios/Runner/Info.plist

+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>CFBundleDevelopmentRegion</key>
+	<string>$(DEVELOPMENT_LANGUAGE)</string>
+	<key>CFBundleExecutable</key>
+	<string>$(EXECUTABLE_NAME)</string>
+	<key>CFBundleIdentifier</key>
+	<string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundleName</key>
+	<string>example</string>
+	<key>CFBundlePackageType</key>
+	<string>APPL</string>
+	<key>CFBundleShortVersionString</key>
+	<string>$(FLUTTER_BUILD_NAME)</string>
+	<key>CFBundleSignature</key>
+	<string>????</string>
+	<key>CFBundleVersion</key>
+	<string>$(FLUTTER_BUILD_NUMBER)</string>
+	<key>LSRequiresIPhoneOS</key>
+	<true/>
+	<key>UILaunchStoryboardName</key>
+	<string>LaunchScreen</string>
+	<key>UIMainStoryboardFile</key>
+	<string>Main</string>
+	<key>UISupportedInterfaceOrientations</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+		<string>UIInterfaceOrientationLandscapeLeft</string>
+		<string>UIInterfaceOrientationLandscapeRight</string>
+	</array>
+	<key>UISupportedInterfaceOrientations~ipad</key>
+	<array>
+		<string>UIInterfaceOrientationPortrait</string>
+		<string>UIInterfaceOrientationPortraitUpsideDown</string>
+		<string>UIInterfaceOrientationLandscapeLeft</string>
+		<string>UIInterfaceOrientationLandscapeRight</string>
+	</array>
+	<key>UIViewControllerBasedStatusBarAppearance</key>
+	<false/>
+</dict>
+</plist>

example/ios/Runner/Runner-Bridging-Header.h

+#import "GeneratedPluginRegistrant.h"

example/lib/main.dart

+import 'package:flutter/material.dart';
+import 'package:responsive_framework/responsive_framework.dart';
+import 'route_generator.dart';
+
+void main() {
+  runApp(MyApp());
+}
+
+class MyApp extends StatelessWidget {
+  // This widget is the root of your application.
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp(
+      builder: (context, widget) => ResponsiveWrapper.builder(
+        ClampingScrollWrapper.builder(context, widget!),
+        maxWidth: 1000,
+        minWidth: 450,
+        defaultScale: true,
+        defaultName: MOBILE,
+        breakpoints: [
+          ResponsiveBreakpoint.resize(450, name: MOBILE),
+          ResponsiveBreakpoint.autoScale(800, name: TABLET),
+          ResponsiveBreakpoint.autoScale(1000, name: TABLET)
+        ],
+      ),
+      title: 'Demo Package UI Semantic',
+      theme: ThemeData(
+        primarySwatch: Colors.blue,
+      ),
+      initialRoute: '/main_page',
+      onGenerateRoute: RouteGenerator.generateRoute,
+      debugShowCheckedModeBanner: false,
+    );
+  }
+}
\ No newline at end of file

example/lib/route_generator.dart

+import 'package:flutter/material.dart';
+import 'package:llswidget/llswidget.dart';
+import 'ui/pages/pages.dart';
+
+class RouteGenerator {
+  static Route<dynamic> generateRoute(RouteSettings settings) {
+    //final args = settings.arguments;
+
+    switch (settings.name) {
+      case MainPage.routeName:
+        return MaterialPageRoute(builder: (_) => MainPage());
+      case ButtonsPage.routeName:
+        return MaterialPageRoute(builder: (_) => ButtonsPage());
+      case StandardsButtonPage.routeName:
+        return MaterialPageRoute(builder: (_) => StandardsButtonPage());
+      case LabelPage.routeName:
+        return MaterialPageRoute(builder: (_) => LabelPage());
+      case ListTilePage.routeName:
+        return MaterialPageRoute(builder: (_) => ListTilePage());
+      case RoundedButtonPage.routeName:
+        return MaterialPageRoute(builder: (_) => RoundedButtonPage());
+      case SquareButtonPage.routeName:
+        return MaterialPageRoute(builder: (_) => SquareButtonPage());
+      default:
+        // If there is no such named route in the switch statement
+        return MaterialPageRoute(builder: (context) {
+          return Scaffold(
+            body: Center(
+              child: Column(
+                mainAxisAlignment: MainAxisAlignment.center,
+                crossAxisAlignment: CrossAxisAlignment.center,
+                children: <Widget>[
+                  Text(
+                    'In Progress.',
+                    style: TextStyle(fontSize: 20),
+                  ),
+                  const SizedBox(
+                    height: 15
+                  ),
+                  LLSButton(
+                    onPressed: () {
+                      Navigator.of(context).pop();
+                    },
+                    child: const Text(
+                      'Back',
+                      style: TextStyle(fontSize: 16),
+                    ),
+                    type: LLSButtonType.outline,
+                    color: LLSColors.SUCCESS,
+                  ),
+                ]
+              ),
+            )
+          );
+        });
+    }
+  }
+}

example/lib/ui/pages/buttons_page/buttons_page.dart

+part of '../pages.dart';
+
+class ButtonsPage extends StatefulWidget {
+  static const routeName = '/buttons_page/buttons_page';
+
+  @override
+  _ButtonsPageState createState() => _ButtonsPageState();
+}
+
+class _ButtonsPageState extends State<ButtonsPage> {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: LLSColors.PRIMARY,
+        leading: InkWell(
+          onTap: () {
+            Navigator.of(context).pop();
+          },
+          child: Container(
+            child: Icon(
+              CupertinoIcons.back,
+              color: LLSColors.WHITE,
+            ),
+          ),
+        ),
+        title: const Text(
+          'Buttons',
+          style: TextStyle(fontSize: 17),
+        ),
+        centerTitle: true,
+      ),
+      body: ListView(
+        children: <Widget>[
+          const SizedBox(
+            height: 20,
+          ),
+          GestureDetector(
+            onTap: () {
+              Navigator.of(context).pushNamed(
+                StandardsButtonPage.routeName
+              );
+            },
+            child: Container(
+              margin: const EdgeInsets.only(left: 15, right: 15, top: 20),
+              padding: const EdgeInsets.all(5),
+              decoration: BoxDecoration(
+                borderRadius: const BorderRadius.all(Radius.circular(7)),
+                color: LLSColors.SECONDARY,
+                boxShadow: [
+                  BoxShadow(
+                    color: Colors.black.withOpacity(0.40),
+                    blurRadius: 5
+                  )
+                ]
+              ),
+              child: LLSListTile(
+                color: LLSColors.SECONDARY,
+                title: const Text(
+                  'Standards Buttons',
+                  style: TextStyle(color: LLSColors.WHITE),
+                ),
+                icon: Icon(
+                  CupertinoIcons.forward,
+                  color: LLSColors.WHITE,
+                )
+              ),
+            )
+          ),
+          GestureDetector(
+            onTap: () {
+              Navigator.of(context).pushNamed(
+                RoundedButtonPage.routeName
+              );
+            },
+            child: Container(
+              margin: const EdgeInsets.only(left: 15, right: 15, top: 20),
+              padding: const EdgeInsets.all(5),
+              decoration: BoxDecoration(
+                borderRadius: const BorderRadius.all(Radius.circular(7)),
+                color: LLSColors.SECONDARY,
+                boxShadow: [
+                  BoxShadow(
+                    color: Colors.black.withOpacity(0.40),
+                    blurRadius: 5
+                  )
+                ]
+              ),
+              child: LLSListTile(
+                color: LLSColors.SECONDARY,
+                title: const Text(
+                  'Rounded Buttons',
+                  style: TextStyle(color: LLSColors.WHITE),
+                ),
+                icon: Icon(
+                  CupertinoIcons.forward,
+                  color: LLSColors.WHITE,
+                )
+              ),
+            )
+          ),
+          GestureDetector(
+            onTap: () {
+              Navigator.of(context).pushNamed(
+                SquareButtonPage.routeName
+              );
+            },
+            child: Container(
+              margin: const EdgeInsets.only(left: 15, right: 15, top: 20),
+              padding: const EdgeInsets.all(5),
+              decoration: BoxDecoration(
+                borderRadius: const BorderRadius.all(Radius.circular(7)),
+                color: LLSColors.SECONDARY,
+                boxShadow: [
+                  BoxShadow(
+                    color: Colors.black.withOpacity(0.40),
+                    blurRadius: 5
+                  )
+                ]
+              ),
+              child: LLSListTile(
+                color: LLSColors.SECONDARY,
+                title: const Text(
+                  'Square Buttons',
+                  style: TextStyle(color: LLSColors.WHITE),
+                ),
+                icon: Icon(
+                  CupertinoIcons.forward,
+                  color: LLSColors.WHITE,
+                )
+              ),
+            )
+          )
+        ]
+      )
+    );
+  }
+}
\ No newline at end of file

example/lib/ui/pages/buttons_page/buttons_page_dynamic.dart

+part of '../pages.dart';
+
+class ButtonsPageDynamic extends StatefulWidget {
+  static const routeName = '/buttons_page/buttons_page_dynamic';
+
+  @override
+  _ButtonsPageDynamicState createState() => _ButtonsPageDynamicState();
+}
+
+class _ButtonsPageDynamicState extends State<ButtonsPage> {
+  final buttonJsonFormat = '';
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: LLSColors.PRIMARY,
+        leading: InkWell(
+          onTap: () {
+            Navigator.of(context).pop();
+          },
+          child: Container(
+            child: Icon(
+              CupertinoIcons.back,
+              color: LLSColors.WHITE,
+            ),
+          ),
+        ),
+        title: const Text(
+          'Buttons (dynamic from json)',
+          style: TextStyle(fontSize: 17),
+        ),
+        centerTitle: true,
+      ),
+      body: ListView(
+        children: <Widget>[
+          const SizedBox(
+            height: 20,
+          ),
+          GestureDetector(
+            onTap: () {
+              Navigator.of(context).pushNamed(
+                StandardsButtonPage.routeName
+              );
+            },
+            child: Container(
+              margin: const EdgeInsets.only(left: 15, right: 15, top: 20),
+              padding: const EdgeInsets.all(5),
+              decoration: BoxDecoration(
+                borderRadius: const BorderRadius.all(Radius.circular(7)),
+                color: LLSColors.SECONDARY,
+                boxShadow: [
+                  BoxShadow(
+                    color: Colors.black.withOpacity(0.40),
+                    blurRadius: 5
+                  )
+                ]
+              ),
+              child: LLSListTile(
+                color: LLSColors.SECONDARY,
+                title: const Text(
+                  'Standards Buttons',
+                  style: TextStyle(color: LLSColors.WHITE),
+                ),
+                icon: Icon(
+                  CupertinoIcons.forward,
+                  color: LLSColors.WHITE,
+                )
+              ),
+            )
+          ),
+          GestureDetector(
+            onTap: () {
+              Navigator.of(context).pushNamed(
+                RoundedButtonPage.routeName
+              );
+            },
+            child: Container(
+              margin: const EdgeInsets.only(left: 15, right: 15, top: 20),
+              padding: const EdgeInsets.all(5),
+              decoration: BoxDecoration(
+                borderRadius: const BorderRadius.all(Radius.circular(7)),
+                color: LLSColors.SECONDARY,
+                boxShadow: [
+                  BoxShadow(
+                    color: Colors.black.withOpacity(0.40),
+                    blurRadius: 5
+                  )
+                ]
+              ),
+              child: LLSListTile(
+                color: LLSColors.SECONDARY,
+                title: const Text(
+                  'Rounded Buttons',
+                  style: TextStyle(color: LLSColors.WHITE),
+                ),
+                icon: Icon(
+                  CupertinoIcons.forward,
+                  color: LLSColors.WHITE,
+                )
+              ),
+            )
+          ),
+          GestureDetector(
+            onTap: () {
+              Navigator.of(context).pushNamed(
+                SquareButtonPage.routeName
+              );
+            },
+            child: Container(
+              margin: const EdgeInsets.only(left: 15, right: 15, top: 20),
+              padding: const EdgeInsets.all(5),
+              decoration: BoxDecoration(
+                borderRadius: const BorderRadius.all(Radius.circular(7)),
+                color: LLSColors.SECONDARY,
+                boxShadow: [
+                  BoxShadow(
+                    color: Colors.black.withOpacity(0.40),
+                    blurRadius: 5
+                  )
+                ]
+              ),
+              child: LLSListTile(
+                color: LLSColors.SECONDARY,
+                title: const Text(
+                  'Square Buttons',
+                  style: TextStyle(color: LLSColors.WHITE),
+                ),
+                icon: Icon(
+                  CupertinoIcons.forward,
+                  color: LLSColors.WHITE,
+                )
+              ),
+            )
+          )
+        ]
+      )
+    );
+  }
+}
\ No newline at end of file

example/lib/ui/pages/buttons_page/rounded_button_page.dart

+part of '../pages.dart';
+
+class RoundedButtonPage extends StatefulWidget {
+  static const routeName = '/buttons_page/rounded_button_page';
+
+  @override
+  _RoundedButtonPageState createState() => _RoundedButtonPageState();
+}
+
+class _RoundedButtonPageState extends State<RoundedButtonPage> with SingleTickerProviderStateMixin {
+  TabController? tabController;
+  
+  @override
+  void initState() {
+    super.initState();
+    tabController = TabController(length: 2, vsync: this);
+  }
+
+  @override
+  void dispose() {
+    tabController!.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: LLSColors.PRIMARY,
+        leading: InkWell(
+          onTap: () {
+            Navigator.of(context).pop();
+          },
+          child: Container(
+            child: Icon(
+              CupertinoIcons.back,
+              color: LLSColors.WHITE,
+            ),
+          ),
+        ),
+        title: const Text(
+          'Rounded Buttons',
+          style: TextStyle(fontSize: 17),
+        ),
+        centerTitle: true,
+      ),
+      body: ListView(
+        children: [
+          Container(
+            width: double.infinity,
+            height: 45,
+            margin: EdgeInsets.only(top: 20, left: 25, right: 25),
+            padding: EdgeInsets.zero,
+            child: LLSSegmentTabs(
+              tabController: tabController,
+              width: double.infinity,
+              length: 2,
+              tabs: <Widget>[
+                Tab(
+                  child: Text(
+                    'Solid',
+                    style: TextStyle(fontSize: 15),
+                  ),
+                ),
+                Tab(
+                  child: Text(
+                    'Outline',
+                    style: TextStyle(fontSize: 15),
+                  ),
+                ),
+              ],
+              tabBarColor: LLSColors.LIGHT,
+              indicatorSize: TabBarIndicatorSize.tab,
+              labelColor: LLSColors.WHITE,
+              unselectedLabelColor: LLSColors.DARK,
+              indicator: BoxDecoration(
+                color: LLSColors.SECONDARY,
+                border: Border(
+                  bottom: BorderSide(
+                    color: LLSColors.SUCCESS,
+                    width: 4,
+                  ),
+                ),
+              ),
+              indicatorWeight: 2,
+              border: Border.all(color: Colors.white, width: 2),
+            ),
+          ),
+          Container(
+            height: MediaQuery.of(context).size.height - 140,
+            child: LLSTabBarView(
+              controller: tabController,
+              physics: BouncingScrollPhysics(),
+              children: <Widget>[
+                Container(
+                  child: ListView(
+                    children: <Widget>[
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 30),
+                        child: LLSLabel(
+                          text: 'Default',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  shape: LLSButtonShape.rounded,
+                                  child: const Text(
+                                    'Primary',
+                                  ),
+                                  color: LLSColors.PRIMARY,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  text: 'Secondary',
+                                  color: LLSColors.SECONDARY,
+                                  shape: LLSButtonShape.rounded,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Success'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.SUCCESS,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Warning'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.WARNING,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Danger'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.DANGER,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Info'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.INFO,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Light'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.LIGHT,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Dark'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.DARK,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.TRANSPARENT,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  shape: LLSButtonShape.rounded
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Disabled State',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: const <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  shape: LLSButtonShape.rounded,
+                                  child: Text(
+                                    'Primary',
+                                  ),
+                                  color: LLSColors.PRIMARY,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text(
+                                    'Secondary',
+                                  ),
+                                  color: LLSColors.SECONDARY,
+                                  shape: LLSButtonShape.rounded,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Success'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.SUCCESS,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: const <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Warning'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.WARNING,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Danger'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.DANGER,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Info'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.INFO,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text('Light'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.LIGHT,
+                                ),
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text('Dark'),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.DARK,
+                                ),
+                                LLSButton(
+                                  type: LLSButtonType.transparent,
+                                  onPressed: null,
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.TRANSPARENT,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  shape: LLSButtonShape.rounded
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Button Sizes',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Large',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.LARGE,
+                                  shape: LLSButtonShape.rounded,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Normal',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.MEDIUM,
+                                  shape: LLSButtonShape.rounded,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Small',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.SMALL,
+                                  shape: LLSButtonShape.rounded,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Block Buttons',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text('Large',
+                                  style: TextStyle(color: LLSColors.WHITE)),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.LARGE,
+                              shape: LLSButtonShape.rounded,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text('Normal',
+                                  style: TextStyle(color: LLSColors.WHITE)),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.MEDIUM,
+                              shape: LLSButtonShape.rounded,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text('Small',
+                                  style: TextStyle(color: LLSColors.WHITE)),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.SMALL,
+                              shape: LLSButtonShape.rounded,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+                Container(
+                  child: ListView(
+                    children: <Widget>[
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 30),
+                        child: LLSLabel(
+                          text: 'Default',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  shape: LLSButtonShape.rounded,
+                                  child: const Text(
+                                    'Primary',
+                                  ),
+                                  type: LLSButtonType.outline,
+                                  color: LLSColors.PRIMARY,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Secondary',
+                                  ),
+                                  color: LLSColors.SECONDARY,
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Success'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.SUCCESS,
+                                  widthBorderOutline: 2.0
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Warning'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.WARNING,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Danger'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.DANGER,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Info'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.INFO,
+                                  widthBorderOutline: 2.0
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Light'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.LIGHT,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Dark'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.DARK,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  color: LLSColors.TRANSPARENT,
+                                  shape: LLSButtonShape.rounded,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  shape: LLSButtonShape.rounded,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Disabled State',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: const <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  shape: LLSButtonShape.rounded,
+                                  child: Text(
+                                    'Primary',
+                                  ),
+                                  type: LLSButtonType.outline,
+                                  color: LLSColors.PRIMARY,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text(
+                                    'Secondary',
+                                  ),
+                                  color: LLSColors.SECONDARY,
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Success'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.SUCCESS,
+                                  widthBorderOutline: 2.0
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: const <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Warning'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.WARNING,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Danger'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.DANGER,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Info'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.INFO,
+                                  widthBorderOutline: 2.0
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text('Light'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.LIGHT,
+                                  widthBorderOutline: 2.0
+                                ),
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text('Dark'),
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.DARK,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  type: LLSButtonType.transparent,
+                                  onPressed: null,
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  shape: LLSButtonShape.rounded,
+                                  color: LLSColors.TRANSPARENT,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  shape: LLSButtonShape.rounded,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Button Sizes',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Large',
+                                  ),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.LARGE,
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Normal',
+                                  ),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.MEDIUM,
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Small',
+                                  ),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.SMALL,
+                                  type: LLSButtonType.outline,
+                                  shape: LLSButtonShape.rounded,
+                                  widthBorderOutline: 2.0
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 20),
+                        child: LLSLabel(
+                          text: 'Block Buttons',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text(
+                                'Large',
+                              ),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.LARGE,
+                              type: LLSButtonType.outline,
+                              shape: LLSButtonShape.rounded,
+                              widthBorderOutline: 2.0
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text(
+                                'Normal',
+                              ),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.MEDIUM,
+                              type: LLSButtonType.outline,
+                              shape: LLSButtonShape.rounded,
+                              widthBorderOutline: 2.0
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text(
+                                'Small',
+                              ),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.SMALL,
+                              type: LLSButtonType.outline,
+                              shape: LLSButtonShape.rounded,
+                              widthBorderOutline: 2.0
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+              ]
+            ),
+          )
+        ]
+      )
+    );
+  }
+}
\ No newline at end of file

example/lib/ui/pages/buttons_page/square_button_page.dart

+part of '../pages.dart';
+
+class SquareButtonPage extends StatefulWidget {
+  static const routeName = 'buttons_page/square_button_page';
+
+  @override
+  _SquareButtonPageState createState() => _SquareButtonPageState();
+}
+
+class _SquareButtonPageState extends State<SquareButtonPage> with SingleTickerProviderStateMixin  {
+  TabController? tabController;
+  
+  @override
+  void initState() {
+    super.initState();
+    tabController = TabController(length: 2, vsync: this);
+  }
+
+  @override
+  void dispose() {
+    tabController!.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: LLSColors.PRIMARY,
+        leading: InkWell(
+          onTap: () {
+            Navigator.of(context).pop();
+          },
+          child: Container(
+            child: Icon(
+              CupertinoIcons.back,
+              color: LLSColors.WHITE,
+            ),
+          ),
+        ),
+        title: const Text(
+          'Square Buttons',
+          style: TextStyle(fontSize: 17),
+        ),
+        centerTitle: true,
+      ),
+      body: ListView(
+        children: [
+          Container(
+            width: double.infinity,
+            height: 45,
+            margin: EdgeInsets.only(top: 20, left: 25, right: 25),
+            padding: EdgeInsets.zero,
+            child: LLSSegmentTabs(
+              tabController: tabController,
+              width: double.infinity,
+              length: 2,
+              tabs: <Widget>[
+                Tab(
+                  child: Text(
+                    'Solid',
+                    style: TextStyle(fontSize: 15),
+                  ),
+                ),
+                Tab(
+                  child: Text(
+                    'Outline',
+                    style: TextStyle(fontSize: 15),
+                  ),
+                ),
+              ],
+              tabBarColor: LLSColors.LIGHT,
+              indicatorSize: TabBarIndicatorSize.tab,
+              labelColor: LLSColors.WHITE,
+              unselectedLabelColor: LLSColors.DARK,
+              indicator: BoxDecoration(
+                color: LLSColors.SECONDARY,
+                border: Border(
+                  bottom: BorderSide(
+                    color: LLSColors.SUCCESS,
+                    width: 4,
+                  ),
+                ),
+              ),
+              indicatorWeight: 2,
+              border: Border.all(color: Colors.white, width: 2),
+            ),
+          ),
+          Container(
+            height: MediaQuery.of(context).size.height - 140,
+            child: LLSTabBarView(
+              controller: tabController,
+              physics: BouncingScrollPhysics(),
+              children: <Widget>[
+                Container(
+                  child: ListView(
+                    children: <Widget>[
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 30),
+                        child: LLSLabel(
+                          text: 'Default',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  shape: LLSButtonShape.square,
+                                  child: const Text('Primary'),
+                                  color: LLSColors.PRIMARY,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Secondary'),
+                                  color: LLSColors.SECONDARY,
+                                  shape: LLSButtonShape.square,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Success'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.SUCCESS,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Warning'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.WARNING,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Danger',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.DANGER,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Info',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.INFO,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Light',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.LIGHT,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Dark'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.DARK,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.TRANSPARENT,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  shape: LLSButtonShape.square,
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 30),
+                        child: LLSLabel(
+                          text: 'Disabled State',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  shape: LLSButtonShape.square,
+                                  child: const Text('Primary'),
+                                  color: LLSColors.PRIMARY,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Secondary'),
+                                  color: LLSColors.SECONDARY,
+                                  shape: LLSButtonShape.square,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Success'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.SUCCESS,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Warning'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.WARNING,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text(
+                                    'Danger',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.DANGER,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text(
+                                    'Info',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.INFO,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text(
+                                    'Light',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.LIGHT,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Dark'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.DARK,
+                                ),
+                                LLSButton(
+                                  type: LLSButtonType.transparent,
+                                  onPressed: null,
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  shape: LLSButtonShape.square
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  shape: LLSButtonShape.square,
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 20),
+                        child: LLSLabel(
+                          text: 'Button Sizes',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Large',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.LARGE,
+                                  shape: LLSButtonShape.square,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Normal',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.MEDIUM,
+                                  shape: LLSButtonShape.square,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Small',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.SMALL,
+                                  shape: LLSButtonShape.square,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 20),
+                        child: LLSLabel(
+                          text: 'Block Buttons',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text(
+                                'Large',
+                                style: TextStyle(
+                                  color: LLSColors.WHITE,
+                                ),
+                              ),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.LARGE,
+                              shape: LLSButtonShape.square,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text(
+                                'Normal',
+                                style: TextStyle(
+                                  color: LLSColors.WHITE,
+                                ),
+                              ),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.MEDIUM,
+                              shape: LLSButtonShape.square,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text(
+                                'Small',
+                                style: TextStyle(
+                                  color: LLSColors.WHITE,
+                                ),
+                              ),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.SMALL,
+                              shape: LLSButtonShape.square,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                    ]
+                  )
+                ),
+                Container(
+                  child: ListView(
+                    children: <Widget>[
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 30),
+                        child: LLSLabel(
+                          text: 'Default',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  shape: LLSButtonShape.square,
+                                  child: const Text('Primary'),
+                                  color: LLSColors.PRIMARY
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Secondary'),
+                                  color: LLSColors.SECONDARY,
+                                  shape: LLSButtonShape.square,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Success'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.SUCCESS,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Warning'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.WARNING,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Danger',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.DANGER,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Info',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.INFO,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Light',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.LIGHT,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Dark'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.DARK,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.TRANSPARENT
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  shape: LLSButtonShape.square,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 30),
+                        child: LLSLabel(
+                          text: 'Disabled State',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  shape: LLSButtonShape.square,
+                                  child: const Text('Primary'),
+                                  color: LLSColors.PRIMARY,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Secondary'),
+                                  color: LLSColors.SECONDARY,
+                                  shape: LLSButtonShape.square,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Success'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.SUCCESS,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Warning'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.WARNING,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text(
+                                    'Danger',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.DANGER,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text(
+                                    'Info',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.INFO,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text(
+                                    'Light',
+                                  ),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.LIGHT,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Dark'),
+                                  shape: LLSButtonShape.square,
+                                  color: LLSColors.DARK,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  type: LLSButtonType.transparent,
+                                  onPressed: null,
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  shape: LLSButtonShape.square
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  shape: LLSButtonShape.square,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 20),
+                        child: LLSLabel(
+                          text: 'Button Sizes',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Large'),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.LARGE,
+                                  shape: LLSButtonShape.square,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Normal'),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.MEDIUM,
+                                  shape: LLSButtonShape.square,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Small'),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.SMALL,
+                                  shape: LLSButtonShape.square,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 20),
+                        child: LLSLabel(
+                          text: 'Block Buttons',
+                          type: LLSLabelType.typo5,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text(
+                                'Large',
+                              ),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.LARGE,
+                              shape: LLSButtonShape.square,
+                              type: LLSButtonType.outline,
+                              widthBorderOutline: 2.0,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text(
+                                'Normal',
+                              ),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.MEDIUM,
+                              shape: LLSButtonShape.square,
+                              type: LLSButtonType.outline,
+                              widthBorderOutline: 2.0,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text(
+                                'Small',
+                              ),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.SMALL,
+                              shape: LLSButtonShape.square,
+                              type: LLSButtonType.outline,
+                              widthBorderOutline: 2.0,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                    ]
+                  )
+                )
+              ]
+            )
+          )
+        ]
+      )
+    );
+  }
+}
\ No newline at end of file

example/lib/ui/pages/buttons_page/standards_button_page.dart

+part of '../pages.dart';
+
+class StandardsButtonPage extends StatefulWidget {
+  static const routeName = '/buttons_page/standards_button_page';
+
+  @override
+  _StandardsButtonPageState createState() => _StandardsButtonPageState();
+}
+
+class _StandardsButtonPageState extends State<StandardsButtonPage> with SingleTickerProviderStateMixin {
+  TabController? tabController;
+
+  @override
+  void initState() {
+    super.initState();
+    tabController = TabController(length: 2, vsync: this);
+  }
+
+  @override
+  void dispose() {
+    tabController!.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: LLSColors.PRIMARY,
+        leading: InkWell(
+          onTap: () {
+            Navigator.of(context).pop();
+          },
+          child: Container(
+            child: Icon(
+              CupertinoIcons.back,
+              color: LLSColors.WHITE,
+            ),
+          ),
+        ),
+        title: const Text(
+          'Standard Buttons',
+          style: TextStyle(fontSize: 17),
+        ),
+        centerTitle: true,
+      ),
+      body: ListView(
+        children: [
+          Container(
+            width: double.infinity,
+            height: 45,
+            margin: EdgeInsets.only(top: 20, left: 25, right: 25),
+            padding: EdgeInsets.zero,
+            child: LLSSegmentTabs(
+              tabController: tabController,
+              width: double.infinity,
+              length: 3,
+              tabs: <Widget>[
+                Tab(
+                  child: Text(
+                    'Solid',
+                    style: TextStyle(fontSize: 15),
+                  )
+                ),
+                Tab(
+                  child: Text(
+                    'Outline',
+                    style: TextStyle(fontSize: 15),
+                  ),
+                ),
+              ],
+              tabBarColor: LLSColors.LIGHT,
+              indicatorSize: TabBarIndicatorSize.tab,
+              labelColor: LLSColors.WHITE,
+              unselectedLabelColor: LLSColors.DARK,
+              indicator: BoxDecoration(
+                color: LLSColors.SECONDARY,
+                border: Border(
+                  bottom: BorderSide(
+                    color: LLSColors.SUCCESS,
+                    width: 4,
+                  ),
+                ),
+              ),
+              indicatorWeight: 2,
+              border: Border.all(color: Colors.white, width: 2)
+            ),
+          ),
+          Container(
+            height: MediaQuery.of(context).size.height - 140,
+            child: LLSTabBarView(
+              controller: tabController,
+              physics: BouncingScrollPhysics(),
+              children: <Widget>[
+                Container(
+                  child: ListView(
+                    children: <Widget>[
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 30),
+                        child: LLSLabel(
+                          text: 'Default',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        key: UniqueKey(),
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  shape: LLSButtonShape.standard,
+                                  child: const Text(
+                                    'Primary',
+                                    style: TextStyle(color: LLSColors.WHITE)
+                                  ),
+                                  color: LLSColors.PRIMARY,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Secondary',
+                                    style: TextStyle(color: LLSColors.WHITE)
+                                  ),
+                                  color: LLSColors.SECONDARY,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Success'),
+                                  color: LLSColors.SUCCESS,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Warning'),
+                                  color: LLSColors.WARNING,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Danger',
+                                    style: TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.DANGER,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Info'),
+                                  color: LLSColors.INFO,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Light'),
+                                  color: LLSColors.LIGHT,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text(
+                                    'Dark',
+                                    style: TextStyle(color: LLSColors.WHITE),
+                                  ),
+                                  color: LLSColors.DARK,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  type: LLSButtonType.solid,
+                                  color: LLSColors.TRANSPARENT,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Disabled State',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        key: UniqueKey(),
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: const <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  shape: LLSButtonShape.standard,
+                                  child: Text('Primary',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Secondary',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.SECONDARY,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Success'),
+                                  color: LLSColors.SUCCESS,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: const <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Warning'),
+                                  color: LLSColors.WARNING,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Danger',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.DANGER,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Info'),
+                                  color: LLSColors.INFO,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text('Light'),
+                                  color: LLSColors.LIGHT,
+                                ),
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text(
+                                    'Dark',
+                                    style: TextStyle(color: LLSColors.WHITE),
+                                  ),
+                                  color: LLSColors.DARK,
+                                ),
+                                LLSButton(
+                                  type: LLSButtonType.transparent,
+                                  onPressed: null,
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  color: LLSColors.TRANSPARENT,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                ),
+                              ]
+                            )
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Transparent Buttons',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        key: UniqueKey(),
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Primary'),
+                                  type: LLSButtonType.transparent,
+                                  textColor: LLSColors.PRIMARY,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Secondary'),
+                                  type: LLSButtonType.transparent,
+                                  textColor: LLSColors.SECONDARY,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Success'),
+                                  type: LLSButtonType.transparent,
+                                  textColor: LLSColors.SUCCESS,
+                                ),
+                              ],
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Warning'),
+                                  type: LLSButtonType.transparent,
+                                  textColor: LLSColors.WARNING,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Danger'),
+                                  type: LLSButtonType.transparent,
+                                  textColor: LLSColors.DANGER,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Info'),
+                                  type: LLSButtonType.transparent,
+                                  textColor: LLSColors.INFO,
+                                ),
+                              ],
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Light'),
+                                  type: LLSButtonType.transparent,
+                                  textColor: LLSColors.LIGHT,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Dark'),
+                                  type: LLSButtonType.transparent,
+                                  textColor: LLSColors.DARK,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  type: LLSButtonType.transparent,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  type: LLSButtonType.transparent,
+                                ),
+                              ]
+                            )
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Button Sizes',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        key: UniqueKey(),
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Large',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.LARGE,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Normal',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.MEDIUM,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Small',
+                                      style:
+                                          TextStyle(color: LLSColors.WHITE)),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.SMALL,
+                                ),
+                                const SizedBox(
+                                  height: 10,
+                                ),
+                              ],
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Block Buttons',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        key: UniqueKey(),
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text('Large',
+                                  style: TextStyle(color: LLSColors.WHITE)),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.LARGE,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text('Normal',
+                                  style: TextStyle(color: LLSColors.WHITE)),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.MEDIUM,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text('Small',
+                                  style: TextStyle(color: LLSColors.WHITE)),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.SMALL,
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Full Width Buttons',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      Column(
+                        mainAxisAlignment: MainAxisAlignment.start,
+                        crossAxisAlignment: CrossAxisAlignment.start,
+                        children: <Widget>[
+                          const SizedBox(
+                            height: 10,
+                          ),
+                          LLSButton(
+                            onPressed: () {},
+                            child: const Text('Large',
+                                style: TextStyle(color: LLSColors.WHITE)),
+                            color: LLSColors.PRIMARY,
+                            size: LLSSize.LARGE,
+                            fullWidthButton: true,
+                          ),
+                          const SizedBox(
+                            height: 10,
+                          ),
+                          LLSButton(
+                            onPressed: () {},
+                            child: const Text('Normal',
+                                style: TextStyle(color: LLSColors.WHITE)),
+                            color: LLSColors.PRIMARY,
+                            size: LLSSize.MEDIUM,
+                            fullWidthButton: true,
+                          ),
+                          const SizedBox(
+                            height: 10,
+                          ),
+                          LLSButton(
+                            onPressed: () {},
+                            child: const Text('Small',
+                                style: TextStyle(color: LLSColors.WHITE)),
+                            color: LLSColors.PRIMARY,
+                            size: LLSSize.SMALL,
+                            fullWidthButton: true,
+                          ),
+                          const SizedBox(
+                            height: 10,
+                          ),
+                        ],
+                      ),
+                    ],
+                  ),
+                ),
+                Container(
+                  child: ListView(
+                    children: <Widget>[
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 30),
+                        child: LLSLabel(
+                          text: 'Default',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        key: UniqueKey(),
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Primary'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Secondary'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.SECONDARY,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Success'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.SUCCESS,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Warning'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.WARNING,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Danger'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.DANGER,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Info'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.INFO,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Light'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.LIGHT,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Dark'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.DARK,
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  type: LLSButtonType.transparent,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Disabled State',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        key: UniqueKey(),
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: const <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Primary'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Secondary'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.SECONDARY,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text('Success'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.SUCCESS,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Warning'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.WARNING,
+                                ),
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text('Danger'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.DANGER,
+                                ),
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text('Info'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.INFO,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text('Light'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.LIGHT,
+                                ),
+                                const LLSButton(
+                                  onPressed: null,
+                                  child: Text('Dark'),
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                  color: LLSColors.DARK,
+                                ),
+                                LLSButton(
+                                  onPressed: null,
+                                  child: Text(
+                                    'Link',
+                                    style: TextStyle(
+                                      color: LLSColors.SECONDARY
+                                    )
+                                  ),
+                                  type: LLSButtonType.transparent,
+                                ),
+                              ],
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: null,
+                                  child: const Text('Orange'),
+                                  color: LLSColors.TERTIARY,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0,
+                                ),
+                              ]
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Button Sizes',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        key: UniqueKey(),
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            Row(
+                              mainAxisAlignment:
+                                  MainAxisAlignment.spaceBetween,
+                              children: <Widget>[
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Large'),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.LARGE,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Normal'),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.MEDIUM,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0
+                                ),
+                                LLSButton(
+                                  onPressed: () {},
+                                  child: const Text('Small'),
+                                  color: LLSColors.PRIMARY,
+                                  size: LLSSize.SMALL,
+                                  type: LLSButtonType.outline,
+                                  widthBorderOutline: 2.0
+                                ),
+                                const SizedBox(
+                                  height: 10,
+                                ),
+                              ],
+                            ),
+                          ],
+                        ),
+                      ),
+                      const Padding(
+                        padding: EdgeInsets.only(left: 15, top: 10),
+                        child: LLSLabel(
+                          text: 'Block Buttons',
+                          type: LLSLabelType.typo4,
+                          dividerWidth: 25,
+                          dividerColor: LLSColors.SECONDARY,
+                        ),
+                      ),
+                      LLSCard(
+                        key: UniqueKey(),
+                        content: Column(
+                          mainAxisAlignment: MainAxisAlignment.start,
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: <Widget>[
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text('Large'),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.LARGE,
+                              type: LLSButtonType.outline,
+                              widthBorderOutline: 2.0
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text('Normal'),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.MEDIUM,
+                              type: LLSButtonType.outline,
+                              widthBorderOutline: 2.0
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                            LLSButton(
+                              onPressed: () {},
+                              blockButton: true,
+                              child: const Text('Small'),
+                              color: LLSColors.PRIMARY,
+                              size: LLSSize.SMALL,
+                              type: LLSButtonType.outline,
+                              widthBorderOutline: 2.0
+                            ),
+                            const SizedBox(
+                              height: 10,
+                            ),
+                          ],
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+              ]
+            ),
+          )
+        ],
+      )
+    );
+  }
+}
\ No newline at end of file

example/lib/ui/pages/label_page/label_page.dart

+part of '../pages.dart';
+
+class LabelPage extends StatefulWidget {
+  static const routeName = '/label_page/label_page';
+
+  @override
+  _LabelPageState createState() => _LabelPageState();
+}
+
+class _LabelPageState extends State<LabelPage> {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: LLSColors.PRIMARY,
+        leading: InkWell(
+          onTap: () {
+            Navigator.of(context).pop();
+          },
+          child: Container(
+            child: Icon(
+              CupertinoIcons.back,
+              color: LLSColors.WHITE,
+            ),
+          ),
+        ),
+        title: const Text(
+          'Label',
+          style: TextStyle(fontSize: 17),
+        ),
+        centerTitle: true,
+      ),
+      body: const Padding(
+        padding: EdgeInsets.only(left: 15, top: 30),
+        child: LLSLabel(
+          text: 'Label',
+          type: LLSLabelType.typo4,
+          dividerWidth: 25,
+          dividerColor: LLSColors.SECONDARY,
+        ),
+      )
+    );
+  }
+}
\ No newline at end of file

example/lib/ui/pages/list_tile_page/list_tile_page.dart

+part of '../pages.dart';
+
+class ListTilePage extends StatefulWidget {
+  static const routeName = '/list_tile_page/list_tile_page';
+
+  @override
+  _ListTilePageState createState() => _ListTilePageState();
+}
+
+class _ListTilePageState extends State<ListTilePage> {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: LLSColors.PRIMARY,
+        leading: InkWell(
+          onTap: () {
+            Navigator.of(context).pop();
+          },
+          child: Container(
+            child: Icon(
+              CupertinoIcons.back,
+              color: LLSColors.WHITE,
+            ),
+          ),
+        ),
+        title: const Text(
+          'List Tile',
+          style: TextStyle(fontSize: 17),
+        ),
+        centerTitle: true,
+      ),
+      body: ListView(
+        children: <Widget>[
+          const SizedBox(
+            height: 20,
+          ),
+          GestureDetector(
+            onTap: () {
+              Navigator.of(context).pushNamed(
+                StandardsButtonPage.routeName
+              );
+            },
+            child: Container(
+              margin: const EdgeInsets.only(left: 15, right: 15, top: 20),
+              padding: const EdgeInsets.all(5),
+              decoration: BoxDecoration(
+                borderRadius: const BorderRadius.all(Radius.circular(7)),
+                color: LLSColors.SECONDARY,
+                boxShadow: [
+                  BoxShadow(
+                    color: Colors.black.withOpacity(0.40),
+                    blurRadius: 5
+                  )
+                ]
+              ),
+              child: LLSListTile(
+                color: LLSColors.SECONDARY,
+                title: const Text(
+                  'Standards Buttons',
+                  style: TextStyle(color: LLSColors.WHITE),
+                ),
+                icon: Icon(
+                  CupertinoIcons.forward,
+                  color: LLSColors.WHITE,
+                )
+              ),
+            )
+          )
+        ]
+      )
+    );
+  }
+}
\ No newline at end of file

example/lib/ui/pages/main_page.dart

+part of 'pages.dart';
+
+class MainPage extends StatefulWidget {
+  static const routeName = '/main_page';
+
+  @override
+  _MainPageState createState() => _MainPageState();
+}
+
+class _MainPageState extends State<MainPage> {
+  final uri = Uri.dataFromString(
+    '''
+    void main() {
+      print("Hellooooooo from the other side!");
+    }
+    ''',
+    mimeType: 'application/dart',
+  );
+
+  List components = [
+    {
+      'icon': Icons.smart_button,
+      'title': 'Buttons',
+      'route': '/buttons_page/buttons_page',
+      'route_dynamic': '/buttons_page/buttons_page_dynamic'
+    },
+    {
+      'icon': Icons.label,
+      'title': 'Label',
+      'route': '/label_page/label_page',
+      'route_dynamic': '/label_page/label_page_dynamic'
+    }
+  ];
+
+  Widget buildSquareTile(String title, IconData icon, String route, String routeDynamic) => InkWell(
+    onTap: () {
+      ActionSheet.material(
+        context,
+        "Choose how the widget will be rendered",
+        () {
+          Navigator.of(context).pop();
+          Navigator.of(context).pushNamed(
+            route
+          );
+        },
+        () async {
+          Navigator.of(context).pop();
+          // Navigator.of(context).pushNamed(
+          //   routeDynamic
+          // );
+          await Isolate.spawnUri(uri, [], null);
+        },
+        "Static",
+        "Dynamic from JSON",
+        17,
+        Icons.format_list_numbered,
+        Icons.dynamic_form
+      );
+    },
+    child: Container(
+      decoration: BoxDecoration(
+        color: LLSColors.SECONDARY,
+        borderRadius: const BorderRadius.all(Radius.circular(7)),
+        boxShadow: [
+          BoxShadow(
+            color: Colors.black.withOpacity(0.61),
+            blurRadius: 6,
+            spreadRadius: 0
+          ),
+        ],
+      ),
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+        children: <Widget>[
+          Icon(
+            icon,
+            color: LLSColors.LIGHT,
+            size: 50,
+          ),
+          Text(
+            title,
+            style: const TextStyle(color: LLSColors.WHITE, fontSize: 18),
+          )
+        ],
+      ),
+    ),
+  );
+
+  @override
+  Widget build(BuildContext context) {
+
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: LLSColors.PRIMARY,
+        leading: null,
+        title: Text(
+          'LLS Widget',
+          style: TextStyle(fontSize: 17),
+        ),
+        centerTitle: true,
+        automaticallyImplyLeading: false,
+      ),
+      body: ListView(
+        physics: const ScrollPhysics(),
+        scrollDirection: Axis.vertical,
+        shrinkWrap: true,
+        children: <Widget>[
+          Container(
+            margin: const EdgeInsets.only(
+                left: 15, bottom: 20, top: 20, right: 15),
+            child: GridView.builder(
+              scrollDirection: Axis.vertical,
+              shrinkWrap: true,
+              physics: const ScrollPhysics(),
+              itemCount: components.length,
+              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+                crossAxisCount: 2,
+                crossAxisSpacing: 20,
+                mainAxisSpacing: 20
+              ),
+              itemBuilder: (BuildContext context, int index) =>
+                GestureDetector(
+                  onTap: () {
+                    ActionSheet.material(
+                      context,
+                      "Choose how the widget will be rendered",
+                      () {
+                        Navigator.of(context).pop();
+                        Navigator.of(context).pushNamed(
+                          components[index]['route']
+                        );
+                      },
+                      () async {
+                        Navigator.of(context).pop();
+                        // Navigator.of(context).pushNamed(
+                        //   components[index]['route_dynamic']
+                        // );
+                        await Isolate.spawnUri(uri, [], null);
+                      },
+                      "Static",
+                      "Dynamic from JSON",
+                      17,
+                      Icons.format_list_numbered,
+                      Icons.dynamic_form
+                    );
+                  },
+                  child: buildSquareTile(
+                    components[index]['title'],
+                    components[index]['icon'],
+                    components[index]['route'],
+                    components[index]['route_dynamic']
+                  )
+                )
+            ),
+          ),
+        ]
+      )
+    );
+  }
+}
+
+// return Scaffold(
+//   appBar: AppBar(
+//     backgroundColor: LLSColors.DARK,
+//     leading: InkWell(
+//       onTap: () {
+//         Navigator.of(context).pop();
+//       },
+//       child: Icon(
+//         Icons.arrow_back_ios,
+//         color: LLSColors.SUCCESS,
+//       ),
+//     ),
+//     title: const Text(
+//       'Standard Buttons',
+//       style: TextStyle(fontSize: 17),
+//     ),
+//     centerTitle: true,
+//   ),
+//   body: LLSButton(
+//     onPressed: () {},
+//     shape: LLSButtonShape.standard,
+//     child: const Text('Primary',
+//       style: TextStyle(color: LLSColors.WHITE)
+//     ),
+//     color: LLSColors.PRIMARY,
+//   ),
+// );
\ No newline at end of file

example/lib/ui/pages/pages.dart

+import 'dart:isolate';
+
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:llswidget/llswidget.dart';
+import 'package:flutter/widgets.dart';
+
+import 'package:demo_package_ui_semantic/ui/widgets/widgets.dart';
+
+part 'main_page.dart';
+part 'buttons_page/buttons_page.dart';
+part 'buttons_page/buttons_page_dynamic.dart';
+part 'buttons_page/standards_button_page.dart';
+part 'label_page/label_page.dart';
+part 'list_tile_page/list_tile_page.dart';
+part 'buttons_page/rounded_button_page.dart';
+part 'buttons_page/square_button_page.dart';
\ No newline at end of file

example/lib/ui/widgets/action_sheet.dart

+part of 'widgets.dart';
+
+class ActionSheet {
+  static cupertino(
+    BuildContext sheetContext,
+    String title,
+    Function options1,
+    Function options2,
+    String textOptions1,
+    String textOptions2,
+    double fontSizeTextOptions
+  ) {
+    showCupertinoModalPopup(
+      context: sheetContext,
+      builder: (BuildContext sheetContext) {
+        return CupertinoActionSheet(
+          title: Text(title),
+          cancelButton: CupertinoActionSheetAction(
+            onPressed: () {
+              Navigator.of(sheetContext).pop();
+            },
+            child: Text(
+              'Close',
+              style: TextStyle(
+                fontSize: fontSizeTextOptions
+              )
+            )
+          ),
+          actions: <Widget>[
+            CupertinoActionSheetAction(
+              onPressed: () {
+                options1();
+              },
+              child: Text(
+                textOptions1,
+                style: TextStyle(
+                  fontSize: fontSizeTextOptions
+                )
+              )
+            ),
+            CupertinoActionSheetAction(
+              onPressed: () {
+                options2();
+              },
+              child: Text(
+                textOptions2,
+                style: TextStyle(
+                  fontSize: fontSizeTextOptions
+                )
+              )
+            ),
+          ],
+        );
+      }
+    );
+  }
+
+  static material(
+    BuildContext sheetContext,
+    String title,
+    Function options1,
+    Function options2,
+    String textOptions1,
+    String textOptions2,
+    double fontSizeTextOptions,
+    IconData icon1,
+    IconData icon2
+  ) {
+    showModalBottomSheet(
+      context: sheetContext,
+      builder: (BuildContext sheetContext) {
+        return Container(
+          child: Wrap(
+            children: <Widget>[
+              ListTile(
+                title: Center(
+                  child: Text(
+                    title,
+                    style: TextStyle(
+                      fontSize: fontSizeTextOptions
+                    )
+                  )
+                )         
+              ),
+              ListTile(
+                leading: Icon(icon1),
+                title: Text(
+                  textOptions1,
+                  style: TextStyle(
+                    fontSize: fontSizeTextOptions
+                  )
+                ),
+                onTap: () => options1()          
+              ),
+              ListTile(
+                leading: Icon(icon2),
+                title: Text(
+                  textOptions2,
+                  style: TextStyle(
+                    fontSize: fontSizeTextOptions
+                  )
+                ),
+                onTap: () => options2(),          
+              ),
+              ListTile(
+                leading: Icon(Icons.close),
+                title: Text(
+                  'Close',
+                  style: TextStyle(
+                    fontSize: fontSizeTextOptions
+                  )
+                ),
+                onTap: () => Navigator.of(sheetContext).pop(),          
+              ),
+            ],
+          ),
+        );
+      }
+    );
+  }
+}
\ No newline at end of file

example/lib/ui/widgets/widgets.dart

+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+part 'action_sheet.dart';
\ No newline at end of file

example/pubspec.lock

+# Generated by pub
+# See https://dart.dev/tools/pub/glossary#lockfile
+packages:
+  async:
+    dependency: transitive
+    description:
+      name: async
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.5.0"
+  boolean_selector:
+    dependency: transitive
+    description:
+      name: boolean_selector
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.1.0"
+  characters:
+    dependency: transitive
+    description:
+      name: characters
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.1.0"
+  charcode:
+    dependency: transitive
+    description:
+      name: charcode
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.2.0"
+  clock:
+    dependency: transitive
+    description:
+      name: clock
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.1.0"
+  collection:
+    dependency: transitive
+    description:
+      name: collection
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.15.0"
+  cupertino_icons:
+    dependency: "direct main"
+    description:
+      name: cupertino_icons
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.0.2"
+  fake_async:
+    dependency: transitive
+    description:
+      name: fake_async
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.2.0"
+  flutter:
+    dependency: "direct main"
+    description: flutter
+    source: sdk
+    version: "0.0.0"
+  flutter_test:
+    dependency: "direct dev"
+    description: flutter
+    source: sdk
+    version: "0.0.0"
+  font_awesome_flutter:
+    dependency: transitive
+    description:
+      name: font_awesome_flutter
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "9.0.0"
+  http:
+    dependency: transitive
+    description:
+      name: http
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.13.1"
+  http_parser:
+    dependency: transitive
+    description:
+      name: http_parser
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "4.0.0"
+  llswidget:
+    dependency: "direct main"
+    description:
+      path: ".."
+      relative: true
+    source: path
+    version: "0.0.1"
+  logging:
+    dependency: transitive
+    description:
+      name: logging
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.0.1"
+  matcher:
+    dependency: transitive
+    description:
+      name: matcher
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.12.10"
+  meta:
+    dependency: transitive
+    description:
+      name: meta
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.3.0"
+  path:
+    dependency: transitive
+    description:
+      name: path
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.8.0"
+  pedantic:
+    dependency: transitive
+    description:
+      name: pedantic
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.11.0"
+  responsive_framework:
+    dependency: "direct main"
+    description:
+      name: responsive_framework
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.1.0"
+  sky_engine:
+    dependency: transitive
+    description: flutter
+    source: sdk
+    version: "0.0.99"
+  source_span:
+    dependency: transitive
+    description:
+      name: source_span
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.8.0"
+  stack_trace:
+    dependency: transitive
+    description:
+      name: stack_trace
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.10.0"
+  stream_channel:
+    dependency: transitive
+    description:
+      name: stream_channel
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.1.0"
+  string_scanner:
+    dependency: transitive
+    description:
+      name: string_scanner
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.1.0"
+  term_glyph:
+    dependency: transitive
+    description:
+      name: term_glyph
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.2.0"
+  test_api:
+    dependency: transitive
+    description:
+      name: test_api
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.2.19"
+  typed_data:
+    dependency: transitive
+    description:
+      name: typed_data
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.3.0"
+  vector_math:
+    dependency: transitive
+    description:
+      name: vector_math
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.1.0"
+  widgetparser:
+    dependency: "direct main"
+    description:
+      path: "../../widgetparser"
+      relative: true
+    source: path
+    version: "0.1.0"
+sdks:
+  dart: ">=2.12.0 <3.0.0"
+  flutter: ">=1.17.0"

example/pubspec.yaml

+name: demo_package_ui_semantic
+description: A new Flutter project.
+
+# The following line prevents the package from being accidentally published to
+# pub.dev using `pub publish`. This is preferred for private packages.
+publish_to: 'none' # Remove this line if you wish to publish to pub.dev
+
+# The following defines the version and build number for your application.
+# A version number is three numbers separated by dots, like 1.2.43
+# followed by an optional build number separated by a +.
+# Both the version and the builder number may be overridden in flutter
+# build by specifying --build-name and --build-number, respectively.
+# In Android, build-name is used as versionName while build-number used as versionCode.
+# Read more about Android versioning at https://developer.android.com/studio/publish/versioning
+# In iOS, build-name is used as CFBundleShortVersionString while build-number used as CFBundleVersion.
+# Read more about iOS versioning at
+# https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
+version: 0.1.0+1
+
+environment:
+  sdk: ">=2.12.0 <3.0.0"
+
+dependencies:
+  flutter:
+    sdk: flutter
+  llswidget:
+    path: ../
+  responsive_framework: ^0.1.0
+  widgetparser:
+    path: ../../widgetparser
+
+
+  # The following adds the Cupertino Icons font to your application.
+  # Use with the CupertinoIcons class for iOS style icons.
+  cupertino_icons: ^1.0.2
+
+dev_dependencies:
+  flutter_test:
+    sdk: flutter
+
+# For information on the generic Dart part of this file, see the
+# following page: https://dart.dev/tools/pub/pubspec
+
+# The following section is specific to Flutter.
+flutter:
+
+  # The following line ensures that the Material Icons font is
+  # included with your application, so that you can use the icons in
+  # the material Icons class.
+  uses-material-design: true
+
+  # To add assets to your application, add an assets section, like this:
+  assets:
+    - assets/images/0.png
+
+  # An image asset can refer to one or more resolution-specific "variants", see
+  # https://flutter.dev/assets-and-images/#resolution-aware.
+
+  # For details regarding adding assets from package dependencies, see
+  # https://flutter.dev/assets-and-images/#from-packages
+
+  # To add custom fonts to your application, add a fonts section here,
+  # in this "flutter" section. Each entry in this list should have a
+  # "family" key with the font family name, and a "fonts" key with a
+  # list giving the asset and other descriptors for the font. For
+  # example:
+  # fonts:
+  #   - family: Schyler
+  #     fonts:
+  #       - asset: fonts/Schyler-Regular.ttf
+  #       - asset: fonts/Schyler-Italic.ttf
+  #         style: italic
+  #   - family: Trajan Pro
+  #     fonts:
+  #       - asset: fonts/TrajanPro.ttf
+  #       - asset: fonts/TrajanPro_Bold.ttf
+  #         weight: 700
+  #
+  # For details regarding fonts from package dependencies,
+  # see https://flutter.dev/custom-fonts/#from-packages

example/test/widget_test.dart

+// This is a basic Flutter widget test.
+//
+// To perform an interaction with a widget in your test, use the WidgetTester
+// utility that Flutter provides. For example, you can send tap and scroll
+// gestures. You can also use WidgetTester to find child widgets in the widget
+// tree, read text, and verify that the values of widget properties are correct.
+
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+import 'package:demo_package_ui_semantic/main.dart';
+
+void main() {
+  testWidgets('Counter increments smoke test', (WidgetTester tester) async {
+    // Build our app and trigger a frame.
+    await tester.pumpWidget(MyApp());
+
+    // Verify that our counter starts at 0.
+    expect(find.text('0'), findsOneWidget);
+    expect(find.text('1'), findsNothing);
+
+    // Tap the '+' icon and trigger a frame.
+    await tester.tap(find.byIcon(Icons.add));
+    await tester.pump();
+
+    // Verify that our counter has incremented.
+    expect(find.text('0'), findsNothing);
+    expect(find.text('1'), findsOneWidget);
+  });
+}

lib/colors/lls_color.dart

+import 'package:flutter/material.dart';
+
+class LLSColors {
+  static const Color PRIMARY = Color(0xffff3d49);
+  static const Color SECONDARY = Color(0xff1e93ce);
+  static const Color TERTIARY = Color(0xffFE954E);
+  static const Color SUCCESS = Color(0xff10DC60);
+  static const Color INFO = Color(0xff33B5E5);
+  static const Color WARNING = Color(0xffFFBB33);
+  static const Color DANGER = Color(0xffF04141);
+  static const Color LIGHT = Color(0xffE0E0E0);
+  static const Color DARK = Color(0xff222428);
+  static const Color WHITE = Color(0xffffffff);
+  static const Color FOCUS = Color(0xff434054);
+  static const Color ALT = Color(0xff794c8a);
+  static const Color TRANSPARENT = Colors.transparent;
+}
\ No newline at end of file

lib/components/button/lls_button.dart

+import 'dart:math' as math;
+import 'package:flutter/foundation.dart';
+import 'package:flutter/gestures.dart';
+import 'package:flutter/rendering.dart';
+import 'package:flutter/widgets.dart';
+import 'package:flutter/material.dart';
+import 'package:llswidget/llswidget.dart';
+
+class LLSButton extends StatefulWidget {
+  const LLSButton({
+    Key? key,
+    required this.onPressed,
+    this.onHighlightChanged,
+    this.textStyle,
+    this.boxShadow,
+    this.buttonBoxShadow,
+    this.focusColor,
+    this.hoverColor,
+    this.highlightColor,
+    this.splashColor,
+    this.elevation = 0.0,
+    this.focusElevation = 4.0,
+    this.hoverElevation = 4.0,
+    this.highlightElevation = 1.0,
+    this.disabledElevation = 0.0,
+    this.padding = const EdgeInsets.symmetric(horizontal: 8),
+    this.constraints,
+    this.borderShape,
+    this.animationDuration = kThemeChangeDuration,
+    this.clipBehavior = Clip.none,
+    this.focusNode,
+    this.autofocus = false,
+    MaterialTapTargetSize? materialTapTargetSize,
+    this.child,
+    this.type = LLSButtonType.solid,
+    this.shape = LLSButtonShape.standard,
+    this.color = LLSColors.PRIMARY,
+    this.textColor,
+    this.position = LLSPosition.start,
+    this.size = LLSSize.MEDIUM,
+    this.borderSide,
+    this.text,
+    this.icon,
+    this.blockButton,
+    this.fullWidthButton,
+    this.colorScheme,
+    this.enableFeedback,
+    this.onLongPress,
+    this.disabledColor,
+    this.disabledTextColor,
+    this.widthBorderOutline
+  })  : materialTapTargetSize =
+            materialTapTargetSize ?? MaterialTapTargetSize.padded,
+        // assert(elevation != null && elevation >= 0.0),
+        assert(focusElevation >= 0.0),
+        assert(hoverElevation >= 0.0),
+        assert(highlightElevation >= 0.0),
+        assert(disabledElevation >= 0.0),
+        super(key: key);
+
+  final VoidCallback? onPressed;
+
+  final ValueChanged<bool>? onHighlightChanged;
+
+  final TextStyle? textStyle;
+
+  final BorderSide? borderSide;
+
+  final BoxShadow? boxShadow;
+
+  final Color? focusColor;
+
+  final Color? hoverColor;
+
+  final Color? highlightColor;
+
+  final Color? splashColor;
+
+  final double elevation;
+
+  final double hoverElevation;
+
+  final double focusElevation;
+
+  final double highlightElevation;
+
+  final double disabledElevation;
+
+  final EdgeInsetsGeometry padding;
+
+  final BoxConstraints? constraints;
+
+  final ShapeBorder? borderShape;
+
+  final Duration animationDuration;
+
+  final Widget? child;
+
+  bool get enabled => onPressed != null;
+
+  final MaterialTapTargetSize materialTapTargetSize;
+
+  final FocusNode? focusNode;
+
+  final bool autofocus;
+
+  final Clip clipBehavior;
+
+  final LLSButtonType type;
+
+  final LLSButtonShape shape;
+
+  final Color color;
+
+  final Color? disabledColor;
+
+  final Color? textColor;
+
+  final Color? disabledTextColor;
+
+  final double size;
+
+  final String? text;
+
+  final Widget? icon;
+
+  final LLSPosition position;
+
+  final bool? blockButton;
+
+  final bool? fullWidthButton;
+
+  final bool? buttonBoxShadow;
+
+  final ColorScheme? colorScheme;
+
+  final bool? enableFeedback;
+
+  final VoidCallback? onLongPress;
+
+  final double? widthBorderOutline;
+
+  @override
+  _LLSButtonState createState() => _LLSButtonState();
+}
+
+class _LLSButtonState extends State<LLSButton> {
+  late Color color;
+  Color? textColor;
+  Color? disabledColor;
+  Color? disabledTextColor;
+  Widget? child;
+  Widget? icon;
+  Function? onPressed;
+  late LLSButtonType type;
+  late LLSButtonShape shape;
+  late double size;
+  late LLSPosition position;
+  late BoxShadow boxShadow;
+
+  final Set<MaterialState> _states = <MaterialState>{};
+
+  @override
+  void initState() {
+    color = widget.color;
+    textColor = widget.textColor;
+    child = widget.text != null ? Text(widget.text!) : widget.child;
+    icon = widget.icon;
+    onPressed = widget.onPressed;
+    type = widget.type;
+    shape = widget.shape;
+    size = widget.size;
+    position = widget.position;
+    disabledColor = widget.disabledColor;
+    disabledTextColor = widget.disabledTextColor;
+    _updateState(
+      MaterialState.disabled,
+      !widget.enabled,
+    );
+    super.initState();
+  }
+
+  bool get _hovered => _states.contains(MaterialState.hovered);
+  bool get _focused => _states.contains(MaterialState.focused);
+  bool get _pressed => _states.contains(MaterialState.pressed);
+  bool get _disabled => _states.contains(MaterialState.disabled);
+
+  double? buttonWidth() {
+    double? buttonWidth = 0;
+    if (widget.blockButton == true) {
+      buttonWidth = MediaQuery.of(context).size.width * 0.88;
+    } else if (widget.fullWidthButton == true) {
+      buttonWidth = MediaQuery.of(context).size.width;
+    } else {
+      buttonWidth = null;
+    }
+    return buttonWidth;
+  }
+
+  void _updateState(MaterialState state, bool value) {
+    value ? _states.add(state) : _states.remove(state);
+  }
+
+  void _handleHighlightChanged(bool value) {
+    if (_pressed != value) {
+      setState(() {
+        _updateState(MaterialState.pressed, value);
+        if (widget.onHighlightChanged != null) {
+          widget.onHighlightChanged!(value);
+        }
+      });
+    }
+  }
+
+  void _handleHoveredChanged(bool value) {
+    if (_hovered != value) {
+      setState(() {
+        _updateState(MaterialState.hovered, value);
+      });
+    }
+  }
+
+  void _handleFocusedChanged(bool value) {
+    if (_focused != value) {
+      setState(() {
+        _updateState(MaterialState.focused, value);
+      });
+    }
+  }
+
+  @override
+  void didUpdateWidget(LLSButton oldWidget) {
+    _updateState(MaterialState.disabled, !widget.enabled);
+    if (_disabled && _pressed) {
+      _handleHighlightChanged(false);
+    }
+    color = widget.color;
+    textColor = widget.textColor;
+    child = widget.text != null ? Text(widget.text!) : widget.child;
+    icon = widget.icon;
+    onPressed = widget.onPressed;
+    type = widget.type;
+    shape = widget.shape;
+    size = widget.size;
+    position = widget.position;
+    disabledColor = widget.disabledColor;
+    disabledTextColor = widget.disabledTextColor;
+    _updateState(
+      MaterialState.disabled,
+      !widget.enabled,
+    );
+    super.didUpdateWidget(oldWidget);
+  }
+
+  double get _effectiveElevation {
+    if (_disabled) {
+      return widget.disabledElevation;
+    }
+    if (_pressed) {
+      return widget.highlightElevation;
+    }
+    if (_hovered) {
+      return widget.hoverElevation;
+    }
+    if (_focused) {
+      return widget.focusElevation;
+    }
+    return widget.elevation;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    ShapeBorder shapeBorderType;
+
+    Color getBorderColor() {
+      if (widget.enabled) {
+        final Color fillColor = color;
+        return fillColor;
+      } else {
+        if (disabledColor != null) {
+          return disabledColor!;
+        } else {
+          return color.withOpacity(0.48);
+        }
+      }
+    }
+
+    Color getDisabledFillColor() {
+      if (widget.type == LLSButtonType.transparent ||
+          widget.type == LLSButtonType.outline) {
+        return Colors.transparent;
+      }
+      if (disabledColor != null) {
+        return disabledColor!;
+      } else {
+        return color.withOpacity(0.48);
+      }
+    }
+
+    Color getColor() {
+      if (widget.type == LLSButtonType.transparent ||
+          widget.type == LLSButtonType.outline) {
+        return Colors.transparent;
+      }
+      final Color fillColor = color;
+      return fillColor;
+    }
+
+    Color getDisabledTextColor() {
+      if (disabledTextColor != null) {
+        return disabledTextColor!;
+      } else if (widget.type == LLSButtonType.outline ||
+          widget.type == LLSButtonType.transparent) {
+        return color;
+      } else {
+        return LLSColors.DARK;
+      }
+    }
+
+    Color getTextColor() {
+      if (widget.type == LLSButtonType.outline ||
+          widget.type == LLSButtonType.transparent) {
+        return widget.enabled
+          ? textColor == null
+              ? color == LLSColors.TRANSPARENT
+                  ? LLSColors.DARK
+                  : color
+              : textColor!
+          : getDisabledTextColor();
+      }
+      if (textColor == null) {
+        if (color == LLSColors.TRANSPARENT) {
+          return LLSColors.DARK;
+        } else {
+          return LLSColors.WHITE;
+        }
+      } else {
+        return textColor!;
+      }
+    }
+
+    final Color? effectiveTextColor = MaterialStateProperty.resolveAs<Color?>(
+        widget.textStyle?.color, _states);
+    final Color themeColor =
+        Theme.of(context).colorScheme.onSurface.withOpacity(0.12);
+    final BorderSide outlineBorder = BorderSide(
+      color: widget.borderSide == null
+        ? getBorderColor()
+        : widget.borderSide!.color,
+      width: widget.widthBorderOutline != null ? widget.widthBorderOutline! : (widget.borderSide?.width == null
+        ? 1.0 : widget.borderSide?.width)!,
+    );
+
+    Size minSize;
+    switch (widget.materialTapTargetSize) {
+      case MaterialTapTargetSize.padded:
+        minSize = const Size(48, 48);
+        break;
+      case MaterialTapTargetSize.shrinkWrap:
+        minSize = Size.zero;
+        break;
+      default:
+        minSize = Size.zero;
+        break;
+    }
+
+    final BorderSide shapeBorder = widget.type == LLSButtonType.outline
+        ? outlineBorder
+        : widget.borderSide ??
+          BorderSide(
+            color: getBorderColor(),
+            width: 0,
+          );
+
+    if (shape == LLSButtonShape.rounded) {
+      shapeBorderType = RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(
+          50,
+        ),
+        side: shapeBorder,
+      );
+    } else if (shape == LLSButtonShape.square) {
+      shapeBorderType = RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(0),
+        side: shapeBorder,
+      );
+    } else if (shape == LLSButtonShape.standard) {
+      shapeBorderType = RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(3),
+        side: shapeBorder,
+      );
+    } else {
+      shapeBorderType = RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(50),
+        side: shapeBorder,
+      );
+    }
+
+    BoxDecoration? getBoxShadow() {
+      if (widget.type != LLSButtonType.transparent) {
+        if (widget.boxShadow == null && widget.buttonBoxShadow != true) {
+          return null;
+        } else {
+          return BoxDecoration(
+            color: widget.type == LLSButtonType.transparent ||
+                  widget.type == LLSButtonType.outline
+              ? Colors.transparent
+              : color,
+            borderRadius: widget.shape == LLSButtonShape.rounded
+              ? BorderRadius.circular(50)
+              : widget.shape == LLSButtonShape.standard
+                  ? BorderRadius.circular(5)
+                  : BorderRadius.zero,
+            boxShadow: [
+              widget.boxShadow == null && widget.buttonBoxShadow == true
+                ? BoxShadow(
+                    color: themeColor,
+                    blurRadius: 1.5,
+                    spreadRadius: 2,
+                    offset: Offset.zero,
+                  )
+                : widget.boxShadow != null
+                    ? widget.boxShadow!
+                    : BoxShadow(
+                        color: Theme.of(context).canvasColor,
+                        blurRadius: 0,
+                        spreadRadius: 0,
+                        offset: Offset.zero,
+                      ),
+            ],
+          );
+        }
+      }
+      return null;
+    }
+
+    TextStyle getTextStyle() {
+      if (widget.size == LLSSize.SMALL) {
+        return TextStyle(
+          color: widget.enabled ? getTextColor() : getDisabledTextColor(),
+          fontSize: 12,
+        );
+      } else if (widget.size == LLSSize.MEDIUM) {
+        return TextStyle(
+          color: widget.enabled ? getTextColor() : getDisabledTextColor(),
+          fontSize: 13,
+          fontWeight: FontWeight.w400,
+        );
+      } else if (widget.size == LLSSize.LARGE) {
+        return TextStyle(
+          color: widget.enabled ? getTextColor() : getDisabledTextColor(),
+          fontSize: 14,
+          fontWeight: FontWeight.w500,
+        );
+      }
+      return TextStyle(
+        color: widget.enabled ? getTextColor() : getDisabledTextColor(),
+        fontSize: 13,
+        fontWeight: FontWeight.w400,
+      );
+    }
+
+    final Widget result = Container(
+      constraints: icon == null
+        ? const BoxConstraints(minWidth: 80)
+        : const BoxConstraints(minWidth: 90),
+      decoration: widget.type == LLSButtonType.solid ? getBoxShadow() : null,
+      child: Material(
+        elevation: _effectiveElevation,
+        textStyle: widget.textStyle == null ? getTextStyle() : widget.textStyle,
+        shape: widget.type == LLSButtonType.transparent
+          ? null
+          : widget.borderShape ?? shapeBorderType,
+        color: widget.enabled ? getColor() : getDisabledFillColor(),
+        type: MaterialType.button,
+        animationDuration: widget.animationDuration,
+        clipBehavior: widget.clipBehavior,
+        child: InkWell(
+          focusNode: widget.focusNode,
+          canRequestFocus: widget.enabled,
+          onFocusChange: _handleFocusedChanged,
+          autofocus: widget.autofocus,
+          onHighlightChanged: _handleHighlightChanged,
+          onHover: _handleHoveredChanged,
+          onTap: widget.onPressed,
+          onLongPress: widget.onLongPress,
+          enableFeedback: widget.enableFeedback,
+          splashColor: widget.splashColor,
+          highlightColor: widget.highlightColor,
+          focusColor: widget.focusColor,
+          hoverColor: widget.hoverColor,
+          customBorder: widget.type == LLSButtonType.transparent
+            ? null
+            : widget.borderShape ?? shapeBorderType,
+          child: IconTheme.merge(
+            data: IconThemeData(color: effectiveTextColor),
+            child: Container(
+              height: size,
+              width: buttonWidth(),
+              padding: widget.padding,
+              child: Center(
+                widthFactor: 1,
+                heightFactor: 1,
+                child: icon != null &&
+                      child != null &&
+                      (position == LLSPosition.start)
+                  ? Row(
+                      mainAxisSize: MainAxisSize.min,
+                      children: <Widget>[
+                        icon!,
+                        const SizedBox(width: 8),
+                        child!
+                      ],
+                    )
+                  : icon != null &&
+                        child != null &&
+                        (position == LLSPosition.end)
+                      ? Row(
+                          mainAxisSize: MainAxisSize.min,
+                          children: <Widget>[
+                            child!,
+                            const SizedBox(width: 8),
+                            icon!
+                          ],
+                        )
+                      : child,
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+
+    return Semantics(
+      container: true,
+      button: true,
+      enabled: widget.enabled,
+      child: _InputPadding(
+        minSize: minSize,
+        child: Focus(
+          focusNode: widget.focusNode,
+          onFocusChange: _handleFocusedChanged,
+          autofocus: widget.autofocus,
+          child: result,
+        ),
+      ),
+    );
+  }
+}
+
+class _InputPadding extends SingleChildRenderObjectWidget {
+  const _InputPadding({
+    Key? key,
+    Widget? child,
+    this.minSize,
+  }) : super(
+          key: key,
+          child: child,
+        );
+
+  final Size? minSize;
+
+  @override
+  RenderObject createRenderObject(BuildContext context) =>
+      _RenderInputPadding(minSize);
+
+  @override
+  void updateRenderObject(
+      BuildContext context, covariant _RenderInputPadding renderObject) {
+    renderObject.minSize = minSize;
+  }
+}
+
+class _RenderInputPadding extends RenderShiftedBox {
+  _RenderInputPadding(this._minSize, [RenderBox? child]) : super(child);
+
+  Size? get minSize => _minSize;
+  Size? _minSize;
+
+  set minSize(Size? value) {
+    _minSize = value;
+    markNeedsLayout();
+  }
+
+  @override
+  double computeMinIntrinsicWidth(double height) {
+    if (child != null && minSize != null) {
+      return math.max(child!.getMinIntrinsicWidth(height), minSize!.width);
+    }
+    return 0;
+  }
+
+  @override
+  double computeMinIntrinsicHeight(double width) {
+    if (child != null && minSize != null) {
+      return math.max(child!.getMinIntrinsicHeight(width), minSize!.height);
+    }
+    return 0;
+  }
+
+  @override
+  double computeMaxIntrinsicWidth(double height) {
+    if (child != null && minSize != null) {
+      return math.max(child!.getMaxIntrinsicWidth(height), minSize!.width);
+    }
+    return 0;
+  }
+
+  @override
+  double computeMaxIntrinsicHeight(double width) {
+    if (child != null && minSize != null) {
+      return math.max(child!.getMaxIntrinsicHeight(width), minSize!.height);
+    }
+    return 0;
+  }
+
+  @override
+  void performLayout() {
+    if (child != null && minSize != null) {
+      child!.layout(constraints, parentUsesSize: true);
+      // ignore: avoid_as
+      final BoxParentData childParentData = child!.parentData as BoxParentData;
+      final double height = math.max(child!.size.width, minSize!.width);
+      final double width = math.max(child!.size.height, minSize!.height);
+      size = constraints.constrain(Size(height, width));
+      childParentData.offset =
+          // ignore: avoid_as
+          Alignment.center.alongOffset(size - child!.size as Offset);
+    } else {
+      size = Size.zero;
+    }
+  }
+
+  @override
+  bool hitTest(BoxHitTestResult result, {required Offset position}) {
+    if (super.hitTest(result, position: position)) {
+      return true;
+    }
+
+    if (child != null) {
+      final Offset center = child!.size.center(Offset.zero);
+      return result.addWithRawTransform(
+        transform: MatrixUtils.forceToPoint(center),
+        position: center,
+        hitTest: (BoxHitTestResult result, Offset position) {
+          assert(position == center);
+          return child!.hitTest(
+            result,
+            position: center,
+          );
+        },
+      );
+    }
+
+    throw Exception('child property cannot be null');
+  }
+}

lib/components/button/lls_button_bar.dart

+import 'package:flutter/material.dart';
+import 'package:flutter/rendering.dart';
+
+class LLSButtonBar extends StatelessWidget {
+  const LLSButtonBar({
+    Key? key,
+    this.direction = Axis.horizontal,
+    this.alignment = WrapAlignment.center,
+    this.spacing = 8.0,
+    this.runAlignment = WrapAlignment.start,
+    this.runSpacing = 0.0,
+    this.crossAxisAlignment = WrapCrossAlignment.start,
+    this.textDirection,
+    this.verticalDirection = VerticalDirection.down,
+    required this.children,
+    this.padding = const EdgeInsets.all(0),
+  }) : super(key: key);
+
+  final EdgeInsetsGeometry padding;
+
+  final Axis direction;
+
+  final WrapAlignment alignment;
+
+  final double spacing;
+
+  final WrapAlignment runAlignment;
+
+  final double runSpacing;
+
+  final List<Widget> children;
+
+  final WrapCrossAlignment crossAxisAlignment;
+
+  final TextDirection? textDirection;
+
+  final VerticalDirection verticalDirection;
+
+  @override
+  Widget build(BuildContext context) => Padding(
+    padding: padding,
+    child: Wrap(
+      direction: direction,
+      alignment: alignment,
+      spacing: spacing,
+      runAlignment: runAlignment,
+      runSpacing: runSpacing,
+      crossAxisAlignment: crossAxisAlignment,
+      textDirection: textDirection,
+      verticalDirection: verticalDirection,
+      children: children.map<Widget>((Widget child) => child).toList(),
+    ),
+  );
+}

lib/components/button/lls_icon_button.dart

+import 'dart:math' as math;
+import 'package:flutter/foundation.dart';
+import 'package:flutter/widgets.dart';
+import 'package:flutter/material.dart';
+import 'package:llswidget/llswidget.dart';
+
+class LLSIconButton extends StatefulWidget {
+  const LLSIconButton({
+    Key? key,
+    this.iconSize = 0.0,
+    this.padding = const EdgeInsets.all(8),
+    this.alignment = Alignment.center,
+    required this.icon,
+    this.focusColor,
+    this.hoverColor,
+    this.highlightColor,
+    this.splashColor,
+    this.disabledColor,
+    required this.onPressed,
+    this.focusNode,
+    this.autofocus = false,
+    this.tooltip,
+    this.type = LLSButtonType.solid,
+    this.shape = LLSIconButtonShape.standard,
+    this.color = LLSColors.PRIMARY,
+    this.borderShape,
+    this.boxShadow,
+    this.size = LLSSize.MEDIUM,
+    this.buttonBoxShadow,
+    this.borderSide,
+  }) : super(key: key);
+
+  final double iconSize;
+
+  final EdgeInsetsGeometry padding;
+
+  final AlignmentGeometry alignment;
+
+  final Widget icon;
+
+  final Color? focusColor;
+
+  final Color? hoverColor;
+
+  final LLSButtonType type;
+
+  final LLSIconButtonShape shape;
+
+  final Color color;
+
+  final Color? splashColor;
+
+  final Color? highlightColor;
+
+  final Color? disabledColor;
+
+  final VoidCallback? onPressed;
+
+  final FocusNode? focusNode;
+
+  final bool autofocus;
+
+  final String? tooltip;
+
+  final BoxShadow? boxShadow;
+
+  final ShapeBorder? borderShape;
+
+  final double size;
+
+  final bool? buttonBoxShadow;
+
+  final BorderSide? borderSide;
+
+  @override
+  _LLSIconButtonState createState() => _LLSIconButtonState();
+}
+
+class _LLSIconButtonState extends State<LLSIconButton> {
+  late Color color;
+  Function? onPressed;
+  late LLSButtonType type;
+  late LLSIconButtonShape shape;
+  BoxShadow? boxShadow;
+  double? height;
+  double? width;
+  double iconPixel = 18;
+
+  @override
+  void initState() {
+    color = widget.color;
+    onPressed = widget.onPressed;
+    type = widget.type;
+    shape = widget.shape;
+    super.initState();
+  }
+
+  Color getBorderColor() {
+    if (widget.onPressed != null) {
+      return color;
+    } else {
+      if (widget.disabledColor != null) {
+        return widget.disabledColor!;
+      } else {
+        return color.withOpacity(0.48);
+      }
+    }
+  }
+
+  Color? getDisabledFillColor() {
+    if (widget.type == LLSButtonType.transparent ||
+        widget.type == LLSButtonType.outline) {
+      return Colors.transparent;
+    }
+    if (widget.disabledColor != null) {
+      return widget.disabledColor;
+    } else {
+      return color.withOpacity(0.48);
+    }
+  }
+
+  Color? getColor() {
+    if (widget.type == LLSButtonType.transparent ||
+        widget.type == LLSButtonType.outline) {
+      return Colors.transparent;
+    } else {
+      return color;
+    }
+  }
+
+  Color? getIconColor() {
+    if (widget.type == LLSButtonType.transparent ||
+        widget.type == LLSButtonType.outline) {
+      return widget.onPressed != null
+        ? color == LLSColors.TRANSPARENT
+            ? LLSColors.DARK
+            : color
+        : color.withOpacity(0.48);
+    } else if (color == LLSColors.TRANSPARENT) {
+      return widget.onPressed != null ? LLSColors.DARK : LLSColors.WHITE;
+    } else {
+      return LLSColors.WHITE;
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    assert(debugCheckHasMaterial(context));
+
+    final Color themeColor =
+        Theme.of(context).colorScheme.onSurface.withOpacity(0.12);
+    final BorderSide outlineBorder = BorderSide(
+      color: widget.borderSide == null
+        ? getBorderColor()
+        : widget.borderSide!.color,
+      width: (widget.borderSide?.width == null
+        ? 1.0 : widget.borderSide?.width)!,
+    );
+
+    final BorderSide shapeBorder = widget.type == LLSButtonType.outline
+        ? outlineBorder
+        : widget.borderSide ??
+            BorderSide(
+              color: color,
+              width: 0,
+            );
+
+    ShapeBorder? shapeBorderType;
+
+    if (shape == LLSIconButtonShape.pills) {
+      shapeBorderType = RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(20),
+        side: shapeBorder,
+      );
+    } else if (shape == LLSIconButtonShape.square) {
+      shapeBorderType = RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(0),
+        side: shapeBorder,
+      );
+    } else if (shape == LLSIconButtonShape.standard) {
+      shapeBorderType = RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(3),
+        side: shapeBorder,
+      );
+    } else if (shape == LLSIconButtonShape.circle) {
+      shapeBorderType = RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(50),
+        side: shapeBorder,
+      );
+    }
+
+    if (widget.size == LLSSize.SMALL) {
+      height = 30.0;
+      width = 30.0;
+      iconPixel = 18.0;
+    } else if (widget.size == LLSSize.MEDIUM) {
+      height = 35.0;
+      width = 35.0;
+      iconPixel = 28.0;
+    } else if (widget.size == LLSSize.LARGE) {
+      height = 40.0;
+      width = 40.0;
+      iconPixel = 38.0;
+    }
+
+    Widget result = Container(
+      // height: widget.shape == LLSIconButtonShape.circle ? height + 6.0 : height,
+      // width: widget.shape == LLSIconButtonShape.pills
+      //     ? width + 10
+      //     : widget.shape == LLSIconButtonShape.circle
+      //         ? height + 6
+      //         : width,
+      padding: widget.padding,
+      child: SizedBox(
+        height: widget.iconSize != 0 ? widget.iconSize : iconPixel,
+        width: widget.iconSize != 0 ? widget.iconSize : iconPixel,
+        child: Align(
+          alignment: Alignment.center,
+          child: IconTheme.merge(
+            data: IconThemeData(
+              size: widget.iconSize > 0.0 ? widget.iconSize : iconPixel,
+              color: getIconColor(),
+            ),
+            child: widget.icon,
+          ),
+        ),
+      ),
+    );
+
+    if (widget.tooltip != null) {
+      result = Tooltip(
+        message: widget.tooltip!,
+        child: result,
+      );
+    }
+
+    BoxDecoration? getBoxShadow() {
+      if (widget.type != LLSButtonType.transparent) {
+        if (widget.boxShadow == null && widget.buttonBoxShadow != true) {
+          return null;
+        } else {
+          return BoxDecoration(
+            color: widget.onPressed != null
+              ? getColor()
+              : getDisabledFillColor(),
+            borderRadius: widget.shape == LLSIconButtonShape.circle
+              ? BorderRadius.circular(50)
+              : widget.shape == LLSIconButtonShape.standard
+                  ? BorderRadius.circular(3)
+                  : widget.shape == LLSIconButtonShape.pills
+                      ? BorderRadius.circular(20)
+                      : BorderRadius.zero,
+            boxShadow: [
+              widget.boxShadow == null && widget.buttonBoxShadow == true
+                ? BoxShadow(
+                    color: themeColor,
+                    blurRadius: 1.5,
+                    spreadRadius: 2,
+                    offset: Offset.zero,
+                  )
+                : widget.boxShadow ??
+                    BoxShadow(
+                      color: Theme.of(context).canvasColor,
+                      blurRadius: 0,
+                      spreadRadius: 0,
+                      offset: Offset.zero,
+                    )
+            ]
+          );
+        }
+      }
+      return null;
+    }
+
+    return Semantics(
+      button: true,
+      enabled: widget.onPressed != null,
+      child: Focus(
+        focusNode: widget.focusNode,
+        autofocus: widget.autofocus,
+        child: Container(
+          // height:
+          //     widget.shape == LLSIconButtonShape.circle ? height + 6 : height,
+          // width: widget.shape == LLSIconButtonShape.pills
+          //     ? width + 10
+          //     : widget.shape == LLSIconButtonShape.circle
+          //         ? height + 6
+          //         : width,
+          decoration: widget.type == LLSButtonType.solid ? getBoxShadow() : null,
+          child: Material(
+            shape: widget.type == LLSButtonType.transparent
+                ? null
+                : widget.borderShape ?? shapeBorderType,
+            color:
+                widget.onPressed != null ? getColor() : getDisabledFillColor(),
+            type: widget.type == LLSButtonType.transparent
+                ? MaterialType.transparency
+                : MaterialType.button,
+            child: InkResponse(
+              onTap: widget.onPressed,
+              child: result,
+              focusColor: widget.focusColor ?? Theme.of(context).focusColor,
+              hoverColor: widget.hoverColor ?? Theme.of(context).hoverColor,
+              highlightColor:
+                  widget.highlightColor ?? Theme.of(context).highlightColor,
+              splashColor: widget.splashColor ?? Theme.of(context).splashColor,
+              radius: math.max(
+                  Material.defaultSplashRadius,
+                  (widget.iconSize > 0.0
+                          ? widget.iconSize
+                          : iconPixel +
+                              math.min(
+                                widget.padding.horizontal,
+                                widget.padding.vertical,
+                              )) *
+                      0.7),
+            ),
+          ),
+        ),
+      ),
+    );
+  }
+}

lib/components/button/lls_social_button.dart

+import 'package:flutter/foundation.dart';
+import 'package:flutter/rendering.dart';
+import 'package:flutter/widgets.dart';
+import 'package:flutter/material.dart';
+import 'package:llswidget/llswidget.dart';
+
+class LLSSocialButton extends LLSButton {
+  const LLSSocialButton({
+    Key? key,
+    required this.onPressed,
+    this.onHighlightChanged,
+    this.textStyle,
+    this.boxShadow,
+    this.buttonBoxShadow,
+    this.focusColor,
+    this.hoverColor,
+    this.highlightColor,
+    this.splashColor,
+    this.elevation = 0.0,
+    this.focusElevation = 4.0,
+    this.hoverElevation = 4.0,
+    this.highlightElevation = 1.0,
+    this.disabledElevation = 0.0,
+    this.padding = const EdgeInsets.symmetric(horizontal: 8),
+    this.constraints,
+    this.borderShape,
+    this.animationDuration = kThemeChangeDuration,
+    this.clipBehavior = Clip.none,
+    this.focusNode,
+    this.autofocus = false,
+    MaterialTapTargetSize? materialTapTargetSize,
+    this.child,
+    this.type = LLSButtonType.solid,
+    this.shape = LLSButtonShape.standard,
+    this.color = LLSColors.PRIMARY,
+    this.textColor,
+    this.position = LLSPosition.start,
+    this.size = LLSSize.MEDIUM,
+    this.borderSide,
+    this.text,
+    this.icon,
+    this.blockButton,
+    this.fullWidthButton,
+    this.colorScheme,
+    this.enableFeedback,
+    this.onLongPress,
+    this.disabledColor,
+    this.disabledTextColor,
+  })  : materialTapTargetSize =
+            materialTapTargetSize ?? MaterialTapTargetSize.padded,
+        // assert(elevation != null && elevation >= 0.0),
+        assert(focusElevation >= 0.0),
+        assert(hoverElevation >= 0.0),
+        assert(highlightElevation >= 0.0),
+        assert(disabledElevation >= 0.0),
+        super(
+          key: key,
+          onPressed: onPressed,
+        );
+
+  @override
+  final VoidCallback? onPressed;
+
+  @override
+  final ValueChanged<bool>? onHighlightChanged;
+
+  @override
+  final TextStyle? textStyle;
+
+  @override
+  final BorderSide? borderSide;
+
+  @override
+  final BoxShadow? boxShadow;
+
+  @override
+  final Color? focusColor;
+
+  @override
+  final Color? hoverColor;
+
+  @override
+  final Color? highlightColor;
+
+  @override
+  final Color? splashColor;
+
+  @override
+  final double elevation;
+
+  @override
+  final double hoverElevation;
+
+  @override
+  final double focusElevation;
+
+  @override
+  final double highlightElevation;
+
+  @override
+  final double disabledElevation;
+
+  @override
+  final EdgeInsetsGeometry padding;
+
+  @override
+  final BoxConstraints? constraints;
+
+  @override
+  final ShapeBorder? borderShape;
+
+  @override
+  final Duration animationDuration;
+
+  @override
+  final Widget? child;
+
+  @override
+  bool get enabled => onPressed != null;
+
+  @override
+  final MaterialTapTargetSize materialTapTargetSize;
+
+  @override
+  final FocusNode? focusNode;
+
+  @override
+  final bool autofocus;
+
+  @override
+  final Clip clipBehavior;
+
+  @override
+  final LLSButtonType type;
+
+  @override
+  final LLSButtonShape shape;
+
+  @override
+  final Color color;
+
+  @override
+  final Color? disabledColor;
+
+  @override
+  final Color? textColor;
+
+  @override
+  final Color? disabledTextColor;
+
+  @override
+  final double size;
+
+  @override
+  final String? text;
+
+  @override
+  final Widget? icon;
+
+  @override
+  final LLSPosition position;
+
+  @override
+  final bool? blockButton;
+
+  @override
+  final bool? fullWidthButton;
+
+  @override
+  final bool? buttonBoxShadow;
+
+  @override
+  final ColorScheme? colorScheme;
+
+  @override
+  final bool? enableFeedback;
+
+  @override
+  final VoidCallback? onLongPress;
+
+  Widget build(BuildContext context) => LLSButton(
+    onPressed: onPressed,
+    onHighlightChanged: onHighlightChanged,
+    textStyle: textStyle,
+    boxShadow: boxShadow,
+    buttonBoxShadow: buttonBoxShadow,
+    focusColor: focusColor,
+    hoverColor: hoverColor,
+    highlightColor: highlightColor,
+    splashColor: splashColor,
+    elevation: elevation,
+    focusElevation: focusElevation,
+    hoverElevation: hoverElevation,
+    highlightElevation: highlightElevation,
+    disabledElevation: disabledElevation,
+    constraints: constraints,
+    borderShape: borderShape,
+    animationDuration: animationDuration,
+    clipBehavior: clipBehavior,
+    focusNode: focusNode,
+    autofocus: autofocus,
+    child: child,
+    type: LLSButtonType.solid,
+    shape: LLSButtonShape.standard,
+    color: LLSColors.PRIMARY,
+    textColor: textColor,
+    position: LLSPosition.start,
+    size: size,
+    borderSide: borderSide,
+    text: text,
+    icon: icon,
+    blockButton: blockButton,
+    fullWidthButton: fullWidthButton,
+    disabledColor: disabledTextColor,
+    disabledTextColor: disabledColor,
+  );
+}

lib/components/card/lls_card.dart

+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+import 'package:llswidget/llswidget.dart';
+
+class LLSCard extends StatelessWidget {
+  const LLSCard(
+      {Key? key,
+      this.color,
+      this.elevation,
+      this.shape,
+      this.borderOnForeground = true,
+      this.padding = const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
+      this.margin,
+      this.clipBehavior,
+      this.semanticContainer,
+      this.title,
+      this.content,
+      this.image,
+      this.showImage = false,
+      this.showOverlayImage = false,
+      this.buttonBar,
+      this.imageOverlay,
+      this.titlePosition,
+      this.borderRadius,
+      this.border,
+      this.boxFit,
+      this.colorFilter,
+      this.height,
+      this.gradient})
+      : assert(elevation == null || elevation >= 0.0),
+        assert(
+            color == null || gradient == null,
+            'Cannot provide both a color and a decoration\n'
+            'The color argument is just a shorthand for "decoration: new BoxDecoration(color: color)".'),
+        super(key: key);
+
+  final double? height;
+
+  final LLSPosition? titlePosition;
+
+  final Color? color;
+
+  final double? elevation;
+
+  final ShapeBorder? shape;
+
+  final bool borderOnForeground;
+
+  final Clip? clipBehavior;
+
+  final EdgeInsetsGeometry? margin;
+
+  final EdgeInsetsGeometry padding;
+
+  final bool? semanticContainer;
+
+  final LLSListTile? title;
+
+  final Widget? content;
+
+  final bool showImage;
+
+  final bool showOverlayImage;
+
+  final Image? image;
+
+  final ImageProvider? imageOverlay;
+
+  final LLSButtonBar? buttonBar;
+
+  final BoxFit? boxFit;
+
+  final ColorFilter? colorFilter;
+
+  final BorderRadiusGeometry? borderRadius;
+
+  final Border? border;
+
+  final LinearGradient? gradient;
+
+  static const double _defaultElevation = 1;
+
+  static const Clip _defaultClipBehavior = Clip.none;
+
+  @override
+  Widget build(BuildContext context) {
+    final CardTheme cardTheme = CardTheme.of(context);
+
+    final Widget cardChild = Padding(
+      padding: padding,
+      child: Column(
+        children: <Widget>[
+          titlePosition == LLSPosition.start
+            ? title ?? Container()
+            : !showImage
+                ? ClipRRect(
+                  // ignore: avoid_as
+                  borderRadius: borderRadius as BorderRadius? ??
+                      const BorderRadius.vertical(top: Radius.circular(4)),
+                  child: image,
+                )
+                : Container(),
+          titlePosition == LLSPosition.start
+              ? !showImage
+                  ? Container(child: image)
+                  : Container()
+              : title ?? Container(),
+          Padding(
+            padding: padding,
+            child: content ?? Container(),
+          ),
+          buttonBar ?? Container(),
+        ],
+      ),
+    );
+
+    final Widget overlayImage = LLSImageOverlay(
+      width: MediaQuery.of(context).size.width,
+      child: cardChild,
+      color: color ?? cardTheme.color ?? Theme.of(context).cardColor,
+      image: imageOverlay,
+      boxFit: boxFit,
+      colorFilter: colorFilter,
+      border: border,
+      borderRadius: borderRadius ?? const BorderRadius.all(Radius.circular(4)),
+    );
+
+    return Container(
+      height: height,
+      margin: margin ?? cardTheme.margin ?? const EdgeInsets.all(16),
+      decoration: gradient != null
+        ? BoxDecoration(
+            gradient: gradient,
+            borderRadius: borderRadius ?? const BorderRadius.all(Radius.circular(4)),
+          )
+        : null,
+      child: gradient == null
+        ? Material(
+            type: MaterialType.card,
+            color: color ?? cardTheme.color ?? Theme.of(context).cardColor,
+            elevation: elevation ?? cardTheme.elevation ?? _defaultElevation,
+            shape: shape ??
+              cardTheme.shape ??
+              const RoundedRectangleBorder(
+                borderRadius: BorderRadius.all(Radius.circular(4)),
+              ),
+            borderOnForeground: borderOnForeground,
+            clipBehavior: clipBehavior ??
+              cardTheme.clipBehavior ??
+              _defaultClipBehavior,
+            child: !showOverlayImage ? cardChild : overlayImage,
+          )
+        : !showOverlayImage
+            ? cardChild
+            : overlayImage,
+    );
+  }
+}

lib/components/image/lls_image_overlay.dart

+import 'dart:ui';
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+
+class LLSImageOverlay extends StatelessWidget {
+  const LLSImageOverlay({
+    Key? key,
+    this.height,
+    this.width,
+    this.color,
+    this.padding,
+    this.margin,
+    this.image,
+    this.child = const Text(''),
+    this.alignment,
+    this.borderRadius,
+    this.colorFilter =
+        const ColorFilter.mode(Colors.black26, BlendMode.colorBurn),
+    this.boxFit = BoxFit.fill,
+    this.border,
+    this.shape = BoxShape.rectangle,
+  }) : super(key: key);
+
+  final double? height;
+
+  final double? width;
+
+  final Color? color;
+
+  final EdgeInsetsGeometry? margin;
+
+  final EdgeInsetsGeometry? padding;
+
+  final ImageProvider? image;
+
+  final Widget child;
+
+  final AlignmentGeometry? alignment;
+
+  final BoxFit? boxFit;
+
+  final ColorFilter? colorFilter;
+
+  final BorderRadiusGeometry? borderRadius;
+
+  final Border? border;
+
+  final BoxShape shape;
+
+  @override
+  Widget build(BuildContext context) => Container(
+    alignment: alignment,
+    height: height,
+    width: width ?? MediaQuery.of(context).size.width,
+    margin: margin,
+    padding: padding,
+    child: child,
+    decoration: BoxDecoration(
+      shape: shape,
+      borderRadius: borderRadius,
+      border: border,
+      color: color,
+      image: image == null ? null : DecorationImage(
+        fit: boxFit,
+        colorFilter: colorFilter,
+        image: image!,
+      ),
+    ),
+  );
+}

lib/components/label/lls_label.dart

+import 'package:flutter/material.dart';
+import 'package:llswidget/llswidget.dart';
+
+class LLSLabel extends StatelessWidget {
+  const LLSLabel({
+    Key? key,
+    this.type = LLSLabelType.typo4,
+    this.child,
+    required this.text,
+    this.icon,
+    this.dividerBorderRadius,
+    this.textColor,
+    this.dividerAlignment,
+    this.dividerColor,
+    this.showDivider = true,
+    this.dividerWidth,
+    this.backgroundImage,
+    this.backgroundImagecolorFilter,
+  })  : assert(text != null || child != null),
+        super(key: key);
+
+  final Widget? child;
+
+  final String? text;
+
+  final Widget? icon;
+
+  final Color? dividerColor;
+
+  final Color? textColor;
+
+  final BorderRadius? dividerBorderRadius;
+
+  final Alignment? dividerAlignment;
+
+  final bool showDivider;
+
+  final double? dividerWidth;
+
+  final ImageProvider? backgroundImage;
+
+  final ColorFilter? backgroundImagecolorFilter;
+
+  final LLSLabelType type;
+
+  @override
+  Widget build(BuildContext context) {
+    double? fontSize;
+
+    if (type == LLSLabelType.typo1) {
+      fontSize = 25.0;
+    } else if (type == LLSLabelType.typo2) {
+      fontSize = 22.0;
+    } else if (type == LLSLabelType.typo3) {
+      fontSize = 19.0;
+    } else if (type == LLSLabelType.typo4) {
+      fontSize = 17.0;
+    } else if (type == LLSLabelType.typo5) {
+      fontSize = 15.0;
+    } else if (type == LLSLabelType.typo6) {
+      fontSize = 13.0;
+    }
+
+    return Container(
+      padding: EdgeInsets.all(backgroundImage != null ? 10 : 0),
+      decoration: BoxDecoration(
+        image: backgroundImage != null
+            ? DecorationImage(
+                image: backgroundImage!,
+                fit: BoxFit.cover,
+                colorFilter: backgroundImagecolorFilter ??
+                    const ColorFilter.mode(Colors.black54, BlendMode.darken),
+              )
+            : null,
+      ),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: <Widget>[
+          Row(
+            children: <Widget>[
+              icon ?? Container(),
+              icon != null
+                  ? const Padding(padding: EdgeInsets.only(left: 10))
+                  : Container(),
+              text != null
+                  ? Expanded(
+                      child: Text(
+                        text!,
+                        style: TextStyle(
+                            color: textColor ??
+                                (backgroundImage != null
+                                    ? Colors.white
+                                    : Colors.black),
+                            fontSize: fontSize,
+                            letterSpacing: 0.3,
+                            fontWeight: FontWeight.w500),
+                      ),
+                    )
+                  : child!
+            ],
+          ),
+          showDivider && fontSize != null
+              ? Container(
+                  margin: const EdgeInsets.only(top: 3, bottom: 3),
+                  alignment: dividerAlignment,
+                  child: Container(
+                    width: dividerWidth != null ? dividerWidth : 70,
+                    height: fontSize / 5,
+                    decoration: BoxDecoration(
+                      color: dividerColor ??
+                          (backgroundImage != null
+                              ? Colors.white
+                              : Colors.black),
+                      borderRadius: dividerBorderRadius ??
+                          const BorderRadius.all(
+                            Radius.circular(5),
+                          ),
+                    ),
+                  ),
+                )
+              : Container()
+        ],
+      ),
+    );
+  }
+}

lib/components/list_tile/lls_list_tile.dart

+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:llswidget/llswidget.dart';
+
+class LLSListTile extends StatelessWidget {
+  const LLSListTile({
+    Key? key,
+    this.titleText,
+    this.subTitleText,
+    this.color,
+    this.avatar,
+    this.title,
+    this.subTitle,
+    this.description,
+    this.icon,
+    this.padding = const EdgeInsets.all(8),
+    this.margin = const EdgeInsets.symmetric(vertical: 8, horizontal: 16),
+    this.enabled = true,
+    this.onTap,
+    this.onLongPress,
+    this.selected = false,
+    this.focusColor,
+    this.hoverColor,
+    this.focusNode,
+    this.autofocus = false,
+  }) : super(key: key);
+
+  final String? titleText;
+
+  final String? subTitleText;
+
+  final Color? color;
+
+  final Widget? avatar;
+
+  final Widget? title;
+
+  final Widget? subTitle;
+
+  final Widget? description;
+
+  final Widget? icon;
+
+  final EdgeInsets margin;
+
+  final EdgeInsets padding;
+
+  final bool enabled;
+
+  final GestureTapCallback? onTap;
+
+  final GestureLongPressCallback? onLongPress;
+
+  final bool selected;
+
+  final Color? focusColor;
+
+  final Color? hoverColor;
+
+  final FocusNode? focusNode;
+
+  final bool autofocus;
+
+  @override
+  Widget build(BuildContext context) => InkWell(
+    onTap: enabled ? onTap : null,
+    onLongPress: enabled ? onLongPress : null,
+    canRequestFocus: enabled,
+    focusNode: focusNode,
+    focusColor: focusColor,
+    hoverColor: hoverColor,
+    autofocus: autofocus,
+    child: Semantics(
+      selected: selected,
+      enabled: enabled,
+      child: Container(
+        // constraints: const BoxConstraints(minHeight: 50),
+        padding: padding,
+        margin: margin,
+        decoration: BoxDecoration(
+          color: color,
+          borderRadius: const BorderRadius.all(Radius.circular(5)),
+        ),
+        child: Row(
+          mainAxisAlignment: MainAxisAlignment.spaceBetween,
+          children: <Widget>[
+            avatar ?? Container(),
+            Expanded(
+              child: Padding(
+                padding: const EdgeInsets.symmetric(horizontal: 10),
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: <Widget>[
+                    titleText != null
+                      ? Text(
+                          titleText!,
+                          style: const TextStyle(
+                            fontSize: 17,
+                            fontWeight: FontWeight.w500,
+                            color: LLSColors.DARK
+                          ),
+                        )
+                      : title ?? Container(),
+                    subTitleText != null
+                      ? Text(
+                          subTitleText!,
+                          style: const TextStyle(
+                            fontSize: 14.5,
+                            color: Colors.black54,
+                          ),
+                        )
+                      : subTitle ?? Container(),
+                    description ?? Container()
+                  ],
+                ),
+              ),
+            ),
+            icon ?? Container(),
+          ],
+        ),
+      ),
+    ),
+  );
+}

lib/components/tabs/lls_segment_tabs.dart

+import 'package:flutter/material.dart';
+import 'package:flutter/foundation.dart';
+import 'package:flutter/rendering.dart';
+import 'package:flutter/widgets.dart';
+import 'package:llswidget/llswidget.dart';
+
+class LLSSegmentTabs extends StatefulWidget {
+  const LLSSegmentTabs({
+    Key? key,
+    required this.length,
+    required this.tabs,
+    required this.tabController,
+    this.height,
+    this.width,
+    this.border,
+    this.borderRadius,
+    this.tabBarColor,
+    this.indicatorColor,
+    this.indicatorWeight = 2.0,
+    this.indicatorPadding = EdgeInsets.zero,
+    this.indicator,
+    this.indicatorSize,
+    this.labelColor,
+    this.labelStyle,
+    this.labelPadding = EdgeInsets.zero,
+    this.unselectedLabelColor,
+    this.unselectedLabelStyle,
+  })  : assert(length != null && length >= 0),
+        super(key: key);
+
+  final int? length;
+
+  final double? height;
+
+  final Color? tabBarColor;
+
+  final Color? indicatorColor;
+
+  final double indicatorWeight;
+
+  final EdgeInsetsGeometry indicatorPadding;
+
+  final Decoration? indicator;
+
+  final TabBarIndicatorSize? indicatorSize;
+
+  final Color? labelColor;
+
+  final Color? unselectedLabelColor;
+
+  final TextStyle? labelStyle;
+
+  final EdgeInsetsGeometry labelPadding;
+
+  final TextStyle? unselectedLabelStyle;
+
+  final List<Widget> tabs;
+
+  final Border? border;
+
+  final BorderRadius? borderRadius;
+
+  final TabController? tabController;
+
+  final double? width;
+
+  @override
+  _LLSSegmentTabsState createState() => _LLSSegmentTabsState();
+}
+
+class _LLSSegmentTabsState extends State<LLSSegmentTabs> {
+  @override
+  Widget build(BuildContext context) => Container(
+    height: widget.height ?? 28,
+    width: widget.width ?? 240,
+    decoration: BoxDecoration(
+      border: widget.border ?? Border.all(color: LLSColors.PRIMARY, width: 1),
+      borderRadius: widget.borderRadius ?? BorderRadius.circular(2),
+    ),
+    child: DefaultTabController(
+      // initialIndex: widget.initialIndex,
+      length: widget.length!,
+      child: Material(
+        borderRadius: widget.borderRadius ?? BorderRadius.circular(2),
+        type: MaterialType.button,
+        color: widget.tabBarColor ?? Colors.transparent,
+        child: TabBar(
+          controller: widget.tabController,
+          labelColor: widget.labelColor ?? LLSColors.WHITE,
+          unselectedLabelColor: widget.unselectedLabelColor ?? LLSColors.PRIMARY,
+          labelStyle: widget.labelStyle ?? const TextStyle(fontSize: 12),
+          unselectedLabelStyle: widget.unselectedLabelStyle ?? const TextStyle(fontSize: 12),
+          indicatorColor: widget.indicatorColor ?? LLSColors.PRIMARY,
+          indicatorSize: widget.indicatorSize,
+          indicator: widget.indicator ??
+            BoxDecoration(
+              color: widget.indicatorColor ?? LLSColors.PRIMARY,
+              border: Border.all(color: widget.indicatorColor ?? Colors.transparent, width: 2),
+              borderRadius: widget.borderRadius == null
+                ? BorderRadius.circular(0)
+                : widget.borderRadius,
+            ),
+          indicatorPadding: widget.indicatorPadding,
+          labelPadding: widget.labelPadding,
+          indicatorWeight: widget.indicatorWeight,
+          tabs: widget.tabs,
+        ),
+      ),
+    ),
+  );
+}

lib/components/tabs/lls_tabbar.dart

+import 'package:flutter/gestures.dart';
+import 'package:flutter/rendering.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/widgets.dart';
+import 'package:llswidget/llswidget.dart';
+import 'package:flutter/foundation.dart';
+
+class LLSTabBar extends StatefulWidget {
+  const LLSTabBar({
+    Key? key,
+    required this.length,
+    required this.tabs,
+    required this.controller,
+    this.isScrollable = false,
+    this.tabBarHeight,
+    this.tabBarColor,
+    this.indicatorColor,
+    this.indicatorWeight = 2.0,
+    this.indicatorPadding = EdgeInsets.zero,
+    this.indicator,
+    this.indicatorSize,
+    this.labelColor,
+    this.labelStyle,
+    this.labelPadding,
+    this.unselectedLabelColor,
+    this.unselectedLabelStyle,
+    this.shape,
+  })  : assert(length != null && length >= 0),
+        super(key: key);
+
+  final int? length;
+
+  final double? tabBarHeight;
+
+  final Color? tabBarColor;
+
+  final Color? indicatorColor;
+
+  final double indicatorWeight;
+
+  final EdgeInsetsGeometry indicatorPadding;
+
+  final Decoration? indicator;
+
+  final TabBarIndicatorSize? indicatorSize;
+
+  final Color? labelColor;
+
+  final Color? unselectedLabelColor;
+
+  final TextStyle? labelStyle;
+
+  final EdgeInsetsGeometry? labelPadding;
+
+  final TextStyle? unselectedLabelStyle;
+
+  final List<Widget> tabs;
+
+  final bool isScrollable;
+
+  final TabController? controller;
+
+  final ShapeBorder? shape;
+
+  @override
+  _LLSTabBarState createState() => _LLSTabBarState();
+}
+
+class _LLSTabBarState extends State<LLSTabBar> {
+  ScrollController? _scrollController;
+  DragStartBehavior dragStartBehavior = DragStartBehavior.start;
+
+  @override
+  Widget build(BuildContext context) => SingleChildScrollView(
+    dragStartBehavior: dragStartBehavior,
+    scrollDirection: Axis.horizontal,
+    controller: _scrollController,
+    child: Container(
+      width: MediaQuery.of(context).size.width,
+      height:
+          widget.tabBarHeight ?? MediaQuery.of(context).size.height * 0.1,
+      child: Material(
+        shape: widget.shape,
+        type: MaterialType.button,
+        color: widget.tabBarColor ?? LLSColors.PRIMARY,
+        child: TabBar(
+          isScrollable: widget.isScrollable,
+          controller: widget.controller,
+          labelColor: widget.labelColor,
+          unselectedLabelColor: widget.unselectedLabelColor,
+          labelStyle: widget.labelStyle,
+          unselectedLabelStyle: widget.unselectedLabelStyle,
+          indicatorColor: widget.indicatorColor,
+          indicatorSize: widget.indicatorSize,
+          indicator: widget.indicator,
+          indicatorPadding: widget.indicatorPadding,
+          indicatorWeight: widget.indicatorWeight,
+          tabs: widget.tabs,
+        ),
+      ),
+    ),
+  );
+}

lib/components/tabs/lls_tabbar_view.dart

+import 'dart:async';
+import 'package:flutter/material.dart';
+import 'package:flutter/rendering.dart';
+import 'package:flutter/widgets.dart';
+import 'package:flutter/gestures.dart' show DragStartBehavior;
+
+class LLSTabBarView extends StatefulWidget {
+  const LLSTabBarView({
+    Key? key,
+    required this.children,
+    required this.controller,
+    this.physics,
+    this.height,
+    this.dragStartBehavior = DragStartBehavior.start,
+  }) : super(key: key);
+
+  final TabController? controller;
+
+  final List<Widget> children;
+
+  final ScrollPhysics? physics;
+
+  final DragStartBehavior dragStartBehavior;
+
+  final double? height;
+
+  @override
+  _LLSTabBarViewState createState() => _LLSTabBarViewState();
+}
+
+final PageScrollPhysics _kLLSTabBarViewPhysics =
+    const PageScrollPhysics().applyTo(const ClampingScrollPhysics());
+
+class _LLSTabBarViewState extends State<LLSTabBarView> {
+  TabController? _controller;
+  PageController? _pageController;
+  List<Widget>? _children;
+  List<Widget>? _childrenWithKey;
+  int? _currentIndex;
+  int _warpUnderwayCount = 0;
+
+  bool get _controllerIsValid => _controller?.animation != null;
+
+  void _updateTabController() {
+    final TabController? newController =
+        widget.controller ?? DefaultTabController.of(context);
+    assert(() {
+      if (newController == null) {
+        throw FlutterError('No TabController for ${widget.runtimeType}.\n'
+            'When creating a ${widget.runtimeType}, you must either provide an explicit '
+            'TabController using the "controller" property, or you must ensure that there '
+            'is a DefaultTabController above the ${widget.runtimeType}.\n'
+            'In this case, there was neither an explicit controller nor a default controller.');
+      }
+      return true;
+    }());
+    if (newController == _controller) {
+      return;
+    }
+    if (_controllerIsValid) {
+      _controller?.animation?.removeListener(_handleTabControllerAnimationTick);
+    }
+    _controller = newController;
+    if (_controller != null) {
+      _controller?.animation?.addListener(_handleTabControllerAnimationTick);
+    }
+  }
+
+  @override
+  void initState() {
+    super.initState();
+    _updateChildren();
+  }
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    _updateTabController();
+    _currentIndex = _controller?.index;
+    _pageController = PageController(initialPage: _currentIndex ?? 0);
+  }
+
+  @override
+  void didUpdateWidget(LLSTabBarView oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    if (widget.controller != oldWidget.controller) {
+      _updateTabController();
+    }
+    if (widget.children != oldWidget.children && _warpUnderwayCount == 0) {
+      _updateChildren();
+    }
+  }
+
+  @override
+  void dispose() {
+    if (_controllerIsValid) {
+      _controller?.animation?.removeListener(_handleTabControllerAnimationTick);
+    }
+    _controller = null;
+    // We don't own the _controller Animation, so it's not disposed here.
+    super.dispose();
+  }
+
+  void _updateChildren() {
+    _children = widget.children;
+    _childrenWithKey = KeyedSubtree.ensureUniqueKeysForList(widget.children);
+  }
+
+  void _handleTabControllerAnimationTick() {
+    if (_controller != null) {
+      if (_warpUnderwayCount > 0 || !_controller!.indexIsChanging) {
+        return;
+      } // This widget is driving the controller's animation.
+      if (_controller!.index != _currentIndex) {
+        _currentIndex = _controller!.index;
+        _warpToCurrentIndex();
+      }
+    }
+  }
+
+  Future<void> _warpToCurrentIndex() async {
+    if (!mounted || _pageController == null || _currentIndex == null) {
+      return Future<void>.value();
+    }
+
+    if (_pageController!.page == _currentIndex!.toDouble()) {
+      return Future<void>.value();
+    }
+
+    final int previousIndex = _controller!.previousIndex;
+    if ((_currentIndex! - previousIndex).abs() == 1) {
+      return _pageController?.animateToPage(_currentIndex!,
+          duration: kTabScrollDuration, curve: Curves.ease);
+    }
+
+    assert((_currentIndex! - previousIndex).abs() > 1);
+    final int initialPage = _currentIndex! > previousIndex
+        ? _currentIndex! - 1
+        : _currentIndex! + 1;
+    final List<Widget>? originalChildren = _childrenWithKey;
+    setState(() {
+      _warpUnderwayCount += 1;
+      _childrenWithKey = List<Widget>.from(_childrenWithKey!, growable: false);
+      final Widget temp = _childrenWithKey![initialPage];
+      _childrenWithKey![initialPage] = _childrenWithKey![previousIndex];
+      _childrenWithKey![previousIndex] = temp;
+    });
+    _pageController?.jumpToPage(initialPage);
+
+    await _pageController?.animateToPage(_currentIndex!,
+        duration: kTabScrollDuration, curve: Curves.ease);
+    if (!mounted) {
+      return Future<void>.value();
+    }
+    setState(() {
+      _warpUnderwayCount -= 1;
+      if (widget.children != _children) {
+        _updateChildren();
+      } else {
+        _childrenWithKey = originalChildren;
+      }
+    });
+  }
+
+  // Called when the PageView scrolls
+  bool _handleScrollNotification(ScrollNotification notification) {
+    if (_warpUnderwayCount > 0) {
+      return false;
+    }
+    if (notification.depth != 0) {
+      return false;
+    }
+    if (_controller == null ||
+        _pageController == null ||
+        _pageController?.page != null ||
+        _controller?.index == null) {
+      return false;
+    }
+
+    _warpUnderwayCount += 1;
+    if (notification is ScrollUpdateNotification &&
+        !_controller!.indexIsChanging) {
+      if ((_pageController!.page! - _controller!.index).abs() > 1.0) {
+        _controller!.index = _pageController!.page!.floor();
+        _currentIndex = _controller!.index;
+      }
+      _controller!.offset =
+          (_pageController!.page! - _controller!.index).clamp(-1.0, 1.0);
+    } else if (notification is ScrollEndNotification) {
+      _controller!.index = _pageController!.page!.round();
+      _currentIndex = _controller!.index;
+    }
+    _warpUnderwayCount -= 1;
+    return false;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    assert(() {
+      if (_controller?.length != widget.children.length) {
+        throw FlutterError(
+            'Controller\'s length property (${_controller?.length}) does not match the \n'
+            'number of tabs (${widget.children.length}) present in TabBar\'s tabs property.');
+      }
+      return true;
+    }());
+    return NotificationListener<ScrollNotification>(
+      onNotification: _handleScrollNotification,
+      child: Container(
+        height: widget.height ?? MediaQuery.of(context).size.height,
+        child: PageView(
+          dragStartBehavior: widget.dragStartBehavior,
+          controller: _pageController,
+          physics: widget.physics == null
+              ? _kLLSTabBarViewPhysics
+              : _kLLSTabBarViewPhysics.applyTo(widget.physics),
+          children: _childrenWithKey!,
+        ),
+      ),
+    );
+  }
+}

lib/components/tabs/lls_tabs.dart

+import 'package:flutter/material.dart';
+import 'package:flutter/foundation.dart';
+import 'package:flutter/rendering.dart';
+import 'package:flutter/widgets.dart';
+import 'package:llswidget/llswidget.dart';
+
+class LLSTabs extends StatefulWidget {
+  const LLSTabs({
+    Key? key,
+    this.initialIndex = 0,
+    required this.length,
+    required this.tabs,
+    required this.tabBarView,
+    required this.controller,
+    this.isScrollable = false,
+    this.height,
+    this.tabBarColor,
+    this.indicatorColor,
+    this.indicatorWeight = 2.0,
+    this.indicatorPadding = EdgeInsets.zero,
+    this.indicator,
+    this.indicatorSize,
+    this.labelColor,
+    this.labelStyle,
+    this.labelPadding,
+    this.unselectedLabelColor,
+    this.unselectedLabelStyle,
+    this.tabBarHeight,
+    this.shape,
+  })  : assert(length >= 0),
+        assert(initialIndex != null &&
+            initialIndex >= 0 &&
+            (length == 0 || initialIndex < length)),
+        super(key: key);
+
+  final int? initialIndex;
+
+  final int length;
+
+  final double? height;
+
+  final Color? tabBarColor;
+
+  final Color? indicatorColor;
+
+  final double indicatorWeight;
+
+  final EdgeInsetsGeometry indicatorPadding;
+
+  final Decoration? indicator;
+
+  final TabBarIndicatorSize? indicatorSize;
+
+  final Color? labelColor;
+
+  final Color? unselectedLabelColor;
+
+  final TextStyle? labelStyle;
+
+  final EdgeInsetsGeometry? labelPadding;
+
+  final TextStyle? unselectedLabelStyle;
+
+  final LLSTabBarView tabBarView;
+
+  final List<Widget> tabs;
+
+  final TabController controller;
+
+  final double? tabBarHeight;
+
+  final ShapeBorder? shape;
+
+  final bool isScrollable;
+
+  @override
+  _LLSTabsState createState() => _LLSTabsState();
+}
+
+class _LLSTabsState extends State<LLSTabs> {
+  @override
+  Widget build(BuildContext context) => Container(
+    child: DefaultTabController(
+      initialIndex: widget.initialIndex!,
+      length: widget.length,
+      child: Container(
+        height: widget.height ?? MediaQuery.of(context).size.height * 0.5,
+        child: Column(
+          children: <Widget>[
+            LLSTabBar(
+              isScrollable: widget.isScrollable,
+              shape: widget.shape,
+              length: widget.length,
+              tabBarHeight: widget.tabBarHeight,
+              tabBarColor: widget.tabBarColor ?? LLSColors.PRIMARY,
+              controller: widget.controller,
+              labelColor: widget.labelColor,
+              unselectedLabelColor: widget.unselectedLabelColor,
+              labelStyle: widget.labelStyle,
+              unselectedLabelStyle: widget.unselectedLabelStyle,
+              indicatorColor: widget.indicatorColor,
+              indicatorSize: widget.indicatorSize,
+              indicator: widget.indicator,
+              indicatorPadding: widget.indicatorPadding,
+              indicatorWeight: widget.indicatorWeight,
+              tabs: widget.tabs,
+            ),
+            Expanded(child: widget.tabBarView),
+          ],
+        ),
+      ),
+    ),
+  );
+}

lib/llswidget.dart

+library llswidget;
+
+// package      LLSWidget
+// author       Rizal Hermawan <rizal.hermawan@locatorlogic.com>
+// copyright    2021 https://locatorlogic.com
+
+//exports button
+export 'package:llswidget/components/button/lls_button.dart';
+export 'package:llswidget/components/button/lls_button_bar.dart';
+export 'package:llswidget/components/button/lls_icon_button.dart';
+export 'package:llswidget/components/button/lls_social_button.dart';
+//exports button type
+export 'package:llswidget/types/lls_button_type.dart';
+// exports button shape
+export 'package:llswidget/shape/lls_button_shape.dart';
+export 'package:llswidget/shape/lls_icon_button_shape.dart';
+//exports size
+export 'package:llswidget/size/lls_size.dart';
+//exports color
+export 'package:llswidget/colors/lls_color.dart';
+//exports position
+export 'package:llswidget/position/lls_position.dart';
+//exports list tile
+export 'package:llswidget/components/list_tile/lls_list_tile.dart';
+//exports tabs
+export 'package:llswidget/components/tabs/lls_segment_tabs.dart';
+export 'package:llswidget/components/tabs/lls_tabbar.dart';
+export 'package:llswidget/components/tabs/lls_tabbar_view.dart';
+export 'package:llswidget/components/tabs/lls_tabs.dart';
+//exports label
+export 'package:llswidget/components/label/lls_label.dart'; 
+//exports label type
+export 'package:llswidget/types/lls_label_type.dart';
+//exports card
+export 'package:llswidget/components/card/lls_card.dart';
+//exports image overlay
+export 'package:llswidget/components/image/lls_image_overlay.dart';
\ No newline at end of file

lib/position/lls_position.dart

+enum LLSPosition {
+  start,
+  end,
+}

lib/shape/lls_avatar_shape.dart

+enum LLSAvatarShape {
+  circle,
+  standard,
+  square,
+}

lib/shape/lls_badge_shape.dart

+enum LLSBadgeShape {
+  circle,
+  pills,
+  standard,
+  square,
+}

lib/shape/lls_button_shape.dart

+enum LLSButtonShape {
+  rounded,
+  standard,
+  square,
+}

lib/shape/lls_icon_button_shape.dart

+enum LLSIconButtonShape {
+  circle,
+  pills,
+  standard,
+  square,
+}
\ No newline at end of file

lib/size/lls_size.dart

+class LLSSize {
+  static const double SMALL = 30;
+  static const double MEDIUM = 35;
+  static const double LARGE = 40;
+}

lib/types/lls_alert_type.dart

+enum LLSAlertType {
+  basic,
+  rounded,
+  fullWidth,
+}
\ No newline at end of file

lib/types/lls_animation_type.dart

+enum LLSAnimationType {
+  align,
+  size,
+  container,
+  rotateTransition,
+  scaleTransition,
+  slideTransition,
+  textStyle,
+}
\ No newline at end of file

lib/types/lls_border_type.dart

+enum LLSBorderType {
+  circle,
+  rRect,
+  rect,
+  oval,
+}

lib/types/lls_button_type.dart

+enum LLSButtonType {
+  solid,
+  outline,
+  transparent,
+}
\ No newline at end of file

lib/types/lls_checkbox_type.dart

+enum LLSCheckboxType {
+  basic,
+  circle,
+  square,
+  custom,
+}
\ No newline at end of file

lib/types/lls_label_type.dart

+enum LLSLabelType {
+  // LLSLabelType.typo1 type used for title widget with fontSize = 25.0
+  typo1,
+
+  // LLSLabelType.typo2 type used for title widget with fontSize = 22.0
+  typo2,
+
+  // LLSLabelType.typo3 type used for title widget with fontSize = 19.0
+  typo3,
+
+  // LLSLabelType.typo4 type used for title widget with fontSize = 17.0
+  typo4,
+
+  // LLSLabelType.typo5 type used for title widget with fontSize = 15.0
+  typo5,
+
+  // LLSLabelType.typo6 type used for title widget with fontSize = 13.0
+  typo6,
+}

lib/types/lls_loader_type.dart

+enum LLSLoaderType {
+  android,
+  ios,
+  square,
+  circle,
+  custom,
+}
\ No newline at end of file

lib/types/lls_progress_type.dart

+enum LLSProgressType { circular, linear }
+
+enum LLSProgressHeadType {
+  circular,
+  square,
+}
\ No newline at end of file

lib/types/lls_radio_type.dart

+enum LLSRadioType {
+  basic,
+  square,
+  custom,
+  blunt,
+}
\ No newline at end of file

lib/types/lls_toast_type.dart

+enum LLSToastType {
+  basic,
+  rounded,
+  fullWidth,
+}
\ No newline at end of file

lib/types/lls_toggle_type.dart

+enum LLSToggleType {
+  android,
+  custom,
+  ios,
+  square,
+}
\ No newline at end of file

pubspec.lock

+# Generated by pub
+# See https://dart.dev/tools/pub/glossary#lockfile
+packages:
+  async:
+    dependency: transitive
+    description:
+      name: async
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.5.0"
+  boolean_selector:
+    dependency: transitive
+    description:
+      name: boolean_selector
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.1.0"
+  characters:
+    dependency: transitive
+    description:
+      name: characters
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.1.0"
+  charcode:
+    dependency: transitive
+    description:
+      name: charcode
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.2.0"
+  clock:
+    dependency: transitive
+    description:
+      name: clock
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.1.0"
+  collection:
+    dependency: transitive
+    description:
+      name: collection
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.15.0"
+  fake_async:
+    dependency: transitive
+    description:
+      name: fake_async
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.2.0"
+  flutter:
+    dependency: "direct main"
+    description: flutter
+    source: sdk
+    version: "0.0.0"
+  flutter_test:
+    dependency: "direct dev"
+    description: flutter
+    source: sdk
+    version: "0.0.0"
+  matcher:
+    dependency: transitive
+    description:
+      name: matcher
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.12.10"
+  meta:
+    dependency: transitive
+    description:
+      name: meta
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.3.0"
+  path:
+    dependency: transitive
+    description:
+      name: path
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.8.0"
+  sky_engine:
+    dependency: transitive
+    description: flutter
+    source: sdk
+    version: "0.0.99"
+  source_span:
+    dependency: transitive
+    description:
+      name: source_span
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.8.0"
+  stack_trace:
+    dependency: transitive
+    description:
+      name: stack_trace
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.10.0"
+  stream_channel:
+    dependency: transitive
+    description:
+      name: stream_channel
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.1.0"
+  string_scanner:
+    dependency: transitive
+    description:
+      name: string_scanner
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.1.0"
+  term_glyph:
+    dependency: transitive
+    description:
+      name: term_glyph
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.2.0"
+  test_api:
+    dependency: transitive
+    description:
+      name: test_api
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "0.2.19"
+  typed_data:
+    dependency: transitive
+    description:
+      name: typed_data
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.3.0"
+  vector_math:
+    dependency: transitive
+    description:
+      name: vector_math
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.1.0"
+sdks:
+  dart: ">=2.12.0 <3.0.0"
+  flutter: ">=1.17.0"

pubspec.yaml

+name: llswidget
+description: A Flutter UI Components package.
+version: 0.0.1
+author: Rizal Hermawan
+homepage: https://locatorlogic.com
+
+environment:
+  sdk: ">=2.12.0 <3.0.0"
+  flutter: ">=1.17.0"
+
+dependencies:
+  flutter:
+    sdk: flutter
+
+dev_dependencies:
+  flutter_test:
+    sdk: flutter
+
+flutter:
+  # assets:
+  #   - images/a_dot_burr.jpeg
+  #   - images/a_dot_ham.jpeg
+  # fonts:
+  #   - family: Schyler
+  #     fonts:
+  #       - asset: fonts/Schyler-Regular.ttf
+  #       - asset: fonts/Schyler-Italic.ttf
+  #         style: italic
+  #   - family: Trajan Pro
+  #     fonts:
+  #       - asset: fonts/TrajanPro.ttf
+  #       - asset: fonts/TrajanPro_Bold.ttf
+  #         weight: 700
\ No newline at end of file

test/button_badge_test.dart

+// import 'package:flutter/foundation.dart';
+// import 'package:flutter/material.dart';
+// import 'package:flutter_test/flutter_test.dart';
+// import 'package:llswidget/llswidget.dart';
+
+// void main() {
+//   const badge = LLSBadge(
+//     child: Text('12'),
+//   );
+//   const text = 'click me';
+//   const textStyle = TextStyle(fontSize: 14, color: Colors.black);
+//   const size = LLSSize.SMALL;
+
+//   testWidgets('Disabled LLS ButtonBadge can be constructed', (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     const LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: null,
+//       text: text,
+//       size: size,
+//       icon: badge,
+//       disabledColor: Colors.teal,
+//       disabledElevation: 3,
+//       disabledTextColor: LLSColors.LIGHT,
+//     );
+
+//     const TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.size, size);
+//     expect(app.buttonBadge.onPressed, null);
+//     expect(app.buttonBadge.disabledColor, Colors.teal);
+//     expect(app.buttonBadge.disabledElevation, 3);
+//     expect(app.buttonBadge.disabledTextColor, LLSColors.LIGHT);
+
+//     await tester.tap(find.byKey(buttonBadgeKey));
+//     await tester.pump();
+
+//     await tester.pumpWidget(app);
+//   });
+
+//   testWidgets('LLS ButtonBadge can be constructed', (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     final LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: () {},
+//       text: text,
+//       icon: badge,
+//       size: size,
+//       color: LLSColors.ALT,
+//       textStyle: textStyle,
+//     );
+
+//     final TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.textStyle, textStyle);
+//     expect(app.buttonBadge.size, size);
+//     expect(app.buttonBadge.color, LLSColors.ALT);
+
+//     await tester.tap(find.byKey(buttonBadgeKey));
+//     await tester.pump();
+
+//     await tester.pumpWidget(app);
+//   });
+
+//   testWidgets(
+//       'LLS ButtonBadge can be constructed with standard type and shape i.e default',
+//       (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     final LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: () {},
+//       text: text,
+//       icon: badge,
+//       size: size,
+//       textColor: LLSColors.DARK,
+//     );
+
+//     final TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.textColor, LLSColors.DARK);
+//     expect(app.buttonBadge.size, size);
+
+//     await tester.tap(find.byKey(buttonBadgeKey));
+//     await tester.pump();
+//     await tester.press(find.byKey(buttonBadgeKey));
+//     await tester.pump();
+//     await tester.longPress(find.byKey(buttonBadgeKey));
+//     await tester.pump();
+
+//     // await expectLater(() => tester.tap(find.byKey(buttonBadgeKey)), prints('onHighlight changed'));
+
+//     await tester.pumpWidget(app);
+//   });
+
+//   testWidgets('LLS ButtonBadge with Block Button and badge position',
+//       (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     final LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: () {},
+//       text: text,
+//       size: size,
+//       icon: badge,
+//       position: LLSPosition.start,
+//       blockButton: true,
+//     );
+
+//     final TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.size, size);
+//     expect(app.buttonBadge.position, LLSPosition.start);
+//     expect(app.buttonBadge.blockButton, isTrue);
+//   });
+
+//   testWidgets(
+//       'LLS ButtonBadge with solid type and pills shape '
+//       'and Full Width Button', (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     final LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: () {},
+//       text: text,
+//       size: size,
+//       icon: badge,
+//       position: LLSPosition.start,
+//       type: LLSButtonType.solid,
+//       shape: LLSButtonShape.pills,
+//       fullWidthButton: true,
+//     );
+
+//     final TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.size, size);
+//     expect(app.buttonBadge.position, LLSPosition.start);
+//     expect(app.buttonBadge.type, LLSButtonType.solid);
+//     expect(app.buttonBadge.shape, LLSButtonShape.pills);
+//     expect(app.buttonBadge.fullWidthButton, isTrue);
+//   });
+
+//   testWidgets('LLS ButtonBadge with type outline and square shape ',
+//       (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     final LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: () {},
+//       text: text,
+//       size: size,
+//       icon: badge,
+//       position: LLSPosition.start,
+//       type: LLSButtonType.outline,
+//       shape: LLSButtonShape.square,
+//     );
+
+//     final TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.size, size);
+//     expect(app.buttonBadge.position, LLSPosition.start);
+//     expect(app.buttonBadge.type, LLSButtonType.outline);
+//     expect(app.buttonBadge.shape, LLSButtonShape.square);
+//   });
+
+//   testWidgets('LLS ButtonBadge with custom border and shape ', (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     const border = BorderSide(
+//         color: Colors.tealAccent, width: 1, style: BorderStyle.solid);
+//     const shape = RoundedRectangleBorder(
+//         side:
+//             BorderSide(color: Colors.pink, width: 2, style: BorderStyle.solid),
+//         borderRadius: BorderRadius.zero);
+
+//     final LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: () {},
+//       text: text,
+//       icon: badge,
+//       size: size,
+//       borderShape: shape,
+//       borderSide: border,
+//     );
+
+//     final TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.size, size);
+//     expect(app.buttonBadge.borderShape, shape);
+//     expect(app.buttonBadge.borderSide, border);
+//   });
+
+//   testWidgets('LLS ButtonBadge with boxshadow ', (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     const boxshadow = BoxShadow(
+//       color: Colors.pink,
+//       blurRadius: 2,
+//       spreadRadius: 1,
+//       offset: Offset.zero,
+//     );
+
+//     final LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: () {},
+//       text: text,
+//       icon: badge,
+//       size: size,
+//       badgeBoxShadow: true,
+//       boxShadow: boxshadow,
+//     );
+
+//     final TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.size, size);
+//     expect(app.buttonBadge.badgeBoxShadow, isTrue);
+//     expect(app.buttonBadge.boxShadow, boxshadow);
+//   });
+
+//   testWidgets(
+//       'LLS ButtonBadge with hover, focus, highlight and splash color. Works only in web',
+//       (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     final LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: () {},
+//       text: text,
+//       icon: badge,
+//       size: size,
+//       hoverColor: Colors.tealAccent,
+//       focusColor: Colors.teal,
+//       highlightColor: Colors.amber,
+//       splashColor: Colors.red,
+//     );
+
+//     final TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.size, size);
+//     expect(app.buttonBadge.hoverColor, Colors.tealAccent);
+//     expect(app.buttonBadge.focusColor, Colors.teal);
+//     expect(app.buttonBadge.highlightColor, Colors.amber);
+//     expect(app.buttonBadge.splashColor, Colors.red);
+//   });
+
+//   testWidgets(
+//       'LLS ButtonBadge with hover, focus, highlight and splash color. Works only in web',
+//       (tester) async {
+//     const buttonBadgeKey = Key('header');
+
+//     final LLSButtonBadge buttonBadge = LLSButtonBadge(
+//       key: buttonBadgeKey,
+//       onPressed: () {},
+//       text: text,
+//       icon: badge,
+//       size: size,
+//       elevation: 3,
+//       focusElevation: 2,
+//       hoverElevation: 2,
+//       highlightElevation: 4,
+//     );
+
+//     final TestApp app = TestApp(buttonBadge);
+
+//     await tester.pumpWidget(app);
+
+//     expect(find.text('click me'), findsOneWidget);
+//     expect(find.text('12'), findsOneWidget);
+
+//     expect(app.buttonBadge.icon, badge);
+//     expect(app.buttonBadge.text, text);
+//     expect(app.buttonBadge.size, size);
+//     expect(app.buttonBadge.elevation, 3);
+//     expect(app.buttonBadge.focusElevation, 2);
+//     expect(app.buttonBadge.hoverElevation, 2);
+//     expect(app.buttonBadge.highlightElevation, 4);
+//   });
+// }
+
+// class TestApp extends StatefulWidget {
+//   const TestApp(this.buttonBadge);
+
+//   final LLSButtonBadge buttonBadge;
+
+//   @override
+//   _TestAppState createState() => _TestAppState();
+// }
+
+// class _TestAppState extends State<TestApp> {
+//   @override
+//   Widget build(BuildContext context) => MaterialApp(
+//         home: Scaffold(
+//           body: Column(
+//             children: [
+//               widget.buttonBadge,
+//             ],
+//           ),
+//         ),
+//       );
+// }

test/button_test.dart

+import 'dart:ui';
+
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:llswidget/llswidget.dart';
+
+void main() {
+  const text = 'click me';
+  const textStyle = TextStyle(fontSize: 14, color: Colors.black);
+  const size = LLSSize.SMALL;
+  const childWidget = Text('tap me');
+
+  testWidgets('Disabled LLS Button can be constructed', (tester) async {
+    const buttonKey = Key('header');
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: null,
+      text: text,
+      size: size,
+      disabledColor: Colors.teal.shade300,
+      disabledElevation: 3,
+      disabledTextColor: LLSColors.LIGHT,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.size, size);
+    expect(app.button.onPressed, null);
+    expect(app.button.disabledColor, Colors.teal.shade300);
+    expect(app.button.disabledElevation, 3);
+    expect(app.button.disabledTextColor, LLSColors.LIGHT);
+
+    await tester.tap(find.byKey(buttonKey));
+    await tester.pump();
+
+    await tester.pumpWidget(app);
+  });
+
+  testWidgets('LLS Button can be constructed', (tester) async {
+    const buttonKey = Key('header');
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      color: LLSColors.ALT,
+      textStyle: textStyle,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.textStyle, textStyle);
+    expect(app.button.size, size);
+    expect(app.button.color, LLSColors.ALT);
+
+    await tester.tap(find.byKey(buttonKey));
+    await tester.pump();
+
+    await tester.pumpWidget(app);
+  });
+
+  testWidgets('LLS Button can be constructed with child for custom text',
+      (tester) async {
+    const buttonKey = Key('header');
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      child: childWidget,
+      color: Colors.amber,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+    expect(app.button.child, childWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.size, size);
+    expect(app.button.color, Colors.amber);
+
+    await tester.tap(find.byKey(buttonKey));
+    await tester.pump();
+
+    await tester.pumpWidget(app);
+  });
+
+  testWidgets(
+      'LLS Button can be constructed with standard type and shape i.e default',
+      (tester) async {
+    const buttonKey = Key('header');
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      textColor: LLSColors.DARK,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.textColor, LLSColors.DARK);
+    expect(app.button.size, size);
+
+    await tester.tap(find.byKey(buttonKey));
+    await tester.pump();
+    await tester.press(find.byKey(buttonKey));
+    await tester.pump();
+    await tester.longPress(find.byKey(buttonKey));
+    await tester.pump();
+
+    // await expectLater(() => tester.tap(find.byKey(buttonKey)), prints('onHighlight changed'));
+
+    await tester.pumpWidget(app);
+  });
+
+  testWidgets(
+      'LLS Button with icon and icon position'
+      'and with Block Button', (tester) async {
+    const buttonKey = Key('header');
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      child: childWidget,
+      icon: const Icon(
+        Icons.directions_bike_sharp,
+      ),
+      position: LLSPosition.start,
+      blockButton: true,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+    expect(find.byIcon(Icons.directions_bike_sharp), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.size, size);
+    expect(app.button.position, LLSPosition.start);
+    expect(app.button.blockButton, isTrue);
+  });
+
+  testWidgets(
+      'LLS Button with solid type and pills shape '
+      'and Full Width Button', (tester) async {
+    const buttonKey = Key('header');
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      child: childWidget,
+      icon: const Icon(
+        Icons.directions_bike_sharp,
+      ),
+      position: LLSPosition.start,
+      type: LLSButtonType.solid,
+      shape: LLSButtonShape.rounded,
+      fullWidthButton: true,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+    expect(find.byIcon(Icons.directions_bike_sharp), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.size, size);
+    expect(app.button.position, LLSPosition.start);
+    expect(app.button.type, LLSButtonType.solid);
+    expect(app.button.shape, LLSButtonShape.rounded);
+    expect(app.button.fullWidthButton, isTrue);
+  });
+
+  testWidgets('LLS Button with type outline and square shape ', (tester) async {
+    const buttonKey = Key('header');
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      child: childWidget,
+      icon: const Icon(
+        Icons.directions_bike_sharp,
+      ),
+      position: LLSPosition.start,
+      type: LLSButtonType.outline,
+      shape: LLSButtonShape.square,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+    expect(find.byIcon(Icons.directions_bike_sharp), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.size, size);
+    expect(app.button.position, LLSPosition.start);
+    expect(app.button.type, LLSButtonType.outline);
+    expect(app.button.shape, LLSButtonShape.square);
+  });
+
+  testWidgets('LLS Button with custom border and shape ', (tester) async {
+    const buttonKey = Key('header');
+
+    const border = BorderSide(
+        color: Colors.tealAccent, width: 1, style: BorderStyle.solid);
+    const shape = RoundedRectangleBorder(
+        side:
+            BorderSide(color: Colors.pink, width: 2, style: BorderStyle.solid),
+        borderRadius: BorderRadius.zero);
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      borderShape: shape,
+      borderSide: border,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.size, size);
+    expect(app.button.borderShape, shape);
+    expect(app.button.borderSide, border);
+  });
+
+  testWidgets('LLS Button with boxshadow ', (tester) async {
+    const buttonKey = Key('header');
+
+    const boxshadow = BoxShadow(
+      color: Colors.pink,
+      blurRadius: 2,
+      spreadRadius: 1,
+      offset: Offset.zero,
+    );
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      buttonBoxShadow: true,
+      boxShadow: boxshadow,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.size, size);
+    expect(app.button.buttonBoxShadow, isTrue);
+    expect(app.button.boxShadow, boxshadow);
+  });
+
+  testWidgets(
+      'LLS Button with hover, focus, highlight and splash color. Works only in web',
+      (tester) async {
+    const buttonKey = Key('header');
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      hoverColor: Colors.tealAccent,
+      focusColor: Colors.teal,
+      highlightColor: Colors.amber,
+      splashColor: Colors.red,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.size, size);
+    expect(app.button.hoverColor, Colors.tealAccent);
+    expect(app.button.focusColor, Colors.teal);
+    expect(app.button.highlightColor, Colors.amber);
+    expect(app.button.splashColor, Colors.red);
+  });
+
+  testWidgets(
+      'LLS Button with hover, focus, highlight and splash color. Works only in web',
+      (tester) async {
+    const buttonKey = Key('header');
+
+    final LLSButton button = LLSButton(
+      key: buttonKey,
+      onPressed: () {},
+      text: text,
+      size: size,
+      elevation: 3,
+      focusElevation: 2,
+      hoverElevation: 2,
+      highlightElevation: 4,
+    );
+
+    final TestApp app = TestApp(button);
+
+    await tester.pumpWidget(app);
+
+    expect(find.text('click me'), findsOneWidget);
+
+    expect(app.button.text, text);
+    expect(app.button.size, size);
+    expect(app.button.elevation, 3);
+    expect(app.button.focusElevation, 2);
+    expect(app.button.hoverElevation, 2);
+    expect(app.button.highlightElevation, 4);
+  });
+}
+
+class TestApp extends StatefulWidget {
+  const TestApp(this.button);
+
+  final LLSButton button;
+
+  @override
+  _TestAppState createState() => _TestAppState();
+}
+
+class _TestAppState extends State<TestApp> {
+  @override
+  Widget build(BuildContext context) => MaterialApp(
+      home: Scaffold(
+        body: Column(
+          children: [
+            widget.button,
+          ],
+        ),
+      ),
+    );
+}

test/card_test.dart

+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:llswidget/llswidget.dart';
+import 'package:flutter/cupertino.dart';
+
+Future<void> main() async {
+  final childWidget = Container(
+    width: 100,
+    height: 100,
+  );
+
+  const color = Colors.white;
+  const elevation = 2.0;
+  const borderOnForeground = false;
+  const padding = EdgeInsets.symmetric(horizontal: 12, vertical: 8);
+  const margin = EdgeInsets.all(1);
+  const title = LLSListTile(
+    titleText: 'Card Title',
+    icon: Icon(Icons.favorite_border),
+  );
+  const content = Text('Hello');
+  final borderRadius = BorderRadius.circular(10);
+  const border = Border(top: BorderSide(color: Colors.black));
+
+  testWidgets('LLS Card can be created.', (tester) async {
+    final LLSCard card = LLSCard(
+      color: color,
+      elevation: elevation,
+      borderOnForeground: borderOnForeground,
+      padding: padding,
+      margin: margin,
+      title: title,
+      content: childWidget,
+      imageOverlay: const NetworkImage(
+          'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+    );
+
+    final TestApp app = TestApp(card);
+
+    await tester.pumpWidget(app);
+
+    await tester.pumpWidget(Container(child: childWidget));
+    expect(find.byWidget(childWidget), findsOneWidget);
+    expect(app.card.color, color);
+    expect(app.card.elevation, elevation);
+    expect(app.card.borderOnForeground, borderOnForeground);
+    expect(app.card.padding, padding);
+    expect(app.card.margin, margin);
+    expect(app.card.title, title);
+    expect(app.card.content, childWidget);
+  });
+
+//   testWidgets('LLS Card with color gradient.', (tester) async {
+//     const gradient = LinearGradient(
+//         begin: Alignment.topLeft,
+//         end: Alignment.bottomRight,
+//         colors: [Colors.red, Colors.pink]);
+//     final LLSCard card = LLSCard(
+//       gradient: gradient,
+//       elevation: elevation,
+//       borderOnForeground: borderOnForeground,
+//       padding: padding,
+//       margin: margin,
+//       title: title,
+//       image: Image.network(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//       imageOverlay: const NetworkImage(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     await tester.pumpWidget(app);
+
+//     await tester.pumpWidget(Container(child: childWidget));
+//     expect(find.byWidget(childWidget), findsOneWidget);
+//     expect(app.card.gradient, gradient);
+//     expect(app.card.elevation, elevation);
+//     expect(app.card.borderOnForeground, borderOnForeground);
+//     expect(app.card.padding, padding);
+//     expect(app.card.margin, margin);
+//     expect(app.card.title, title);
+//   });
+
+//   testWidgets('LLS Card with clip behaviour.', (tester) async {
+//     final bgImage = Image.network(
+//       'https://images.unsplash.com/photo-1547721064-da6cfb341d50',
+//     );
+//     const clip = Clip.none;
+
+//     final LLSCard card = LLSCard(
+//       image: bgImage,
+//       title: title,
+//       clipBehavior: clip,
+//       imageOverlay: const NetworkImage(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     expect(app.card.image, bgImage);
+//     expect(app.card.title, title);
+//     expect(app.card.clipBehavior, clip);
+//   });
+
+//   testWidgets('LLS Card with background image.', (tester) async {
+//     final bgImage = Image.network(
+//       'https://images.unsplash.com/photo-1547721064-da6cfb341d50',
+//     );
+//     const boxFit = BoxFit.cover;
+
+//     final LLSCard card = LLSCard(
+//       image: bgImage,
+//       title: title,
+//       boxFit: boxFit,
+//       imageOverlay: const NetworkImage(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     expect(app.card.image, bgImage);
+//     expect(app.card.title, title);
+//     expect(app.card.boxFit, boxFit);
+//   });
+
+//   testWidgets('LLS Card with background image & image overlay.', (tester) async {
+//     final bgImage = Image.network(
+//       'https://images.unsplash.com/photo-1547721064-da6cfb341d50',
+//     );
+//     const boxFit = BoxFit.cover;
+//     const imageOverlay = NetworkImage(
+//         'https://cdn.pixabay.com/photo/2016/11/22/07/09/spruce-1848543__340.jpg');
+
+//     final LLSCard card = LLSCard(
+//       image: bgImage,
+//       title: title,
+//       boxFit: boxFit,
+//       imageOverlay: imageOverlay,
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     expect(app.card.image, bgImage);
+//     expect(app.card.title, title);
+//     expect(app.card.boxFit, boxFit);
+//     expect(app.card.imageOverlay, imageOverlay);
+//   });
+
+//   testWidgets('LLS Card with semantic container.', (tester) async {
+//     const isSemanticContainer = false;
+
+//     final LLSCard card = LLSCard(
+//       semanticContainer: isSemanticContainer,
+//       elevation: elevation,
+//       borderOnForeground: borderOnForeground,
+//       title: title,
+//       image: Image.network(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//       imageOverlay: const NetworkImage(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     await tester.pumpWidget(app);
+
+//     await tester.pumpWidget(Container(child: childWidget));
+//     expect(find.byWidget(childWidget), findsOneWidget);
+//     expect(app.card.semanticContainer, isSemanticContainer);
+//     expect(app.card.elevation, elevation);
+//     expect(app.card.borderOnForeground, borderOnForeground);
+//     expect(app.card.title, title);
+//   });
+
+//   testWidgets('LLS Card with title position.', (tester) async {
+//     final bgImage = Image.network(
+//       'https://images.unsplash.com/photo-1547721064-da6cfb341d50',
+//     );
+//     const titlePosition = LLSPosition.end;
+
+//     final LLSCard card = LLSCard(
+//       image: bgImage,
+//       title: title,
+//       titlePosition: titlePosition,
+//       imageOverlay: const NetworkImage(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     expect(app.card.image, bgImage);
+//     expect(app.card.title, title);
+//     expect(app.card.titlePosition, titlePosition);
+//   });
+
+//   testWidgets('LLS Card with border & border radius.', (tester) async {
+//     final bgImage = Image.network(
+//       'https://images.unsplash.com/photo-1547721064-da6cfb341d50',
+//     );
+//     final LLSCard card = LLSCard(
+//       title: title,
+//       border: border,
+//       borderRadius: borderRadius,
+//       image: bgImage,
+//       content: content,
+//       imageOverlay: const NetworkImage(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     await tester.pumpWidget(Container(child: childWidget));
+//     expect(find.byWidget(childWidget), findsOneWidget);
+//     expect(app.card.title, title);
+//     expect(app.card.border, border);
+//     expect(app.card.borderRadius, borderRadius);
+//     expect(app.card.content, content);
+//     expect(app.card.image, bgImage);
+//   });
+
+//   testWidgets('LLS Card with custom button bar.', (tester) async {
+//     final bgImage = Image.network(
+//       'https://images.unsplash.com/photo-1547721064-da6cfb341d50',
+//     );
+//     const customButtonBar = LLSButtonBar(
+//       children: <Widget>[
+//         LLSButton(
+//           onPressed: null,
+//           child: Text('Read More'),
+//           icon: Icon(Icons.keyboard_arrow_right),
+//           type: LLSButtonType.transparent,
+//         ),
+//       ],
+//     );
+//     final LLSCard card = LLSCard(
+//       color: color,
+//       elevation: elevation,
+//       buttonBar: customButtonBar,
+//       title: title,
+//       image: bgImage,
+//       imageOverlay: const NetworkImage(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     await tester.pumpWidget(Container(child: childWidget));
+//     expect(find.byWidget(childWidget), findsOneWidget);
+//     expect(app.card.color, color);
+//     expect(app.card.elevation, elevation);
+//     expect(app.card.buttonBar, customButtonBar);
+//     expect(app.card.image, bgImage);
+//   });
+
+//   testWidgets('LLS Card with custom title.', (tester) async {
+//     const customTitle = LLSListTile(
+//       titleText: 'Card Title',
+//       icon: Icon(Icons.favorite_border),
+//     );
+//     final LLSCard card = LLSCard(
+//       color: color,
+//       title: customTitle,
+//       image: Image.network(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//       imageOverlay: const NetworkImage(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     await tester.pumpWidget(app);
+
+//     await tester.pumpWidget(Container(child: childWidget));
+//     expect(find.byWidget(childWidget), findsOneWidget);
+//     expect(app.card.color, color);
+//     expect(app.card.title, customTitle);
+//   });
+
+//   testWidgets('LLS Card with full background image & button bar.',
+//       (tester) async {
+//     const imageOverlay = NetworkImage(
+//         'https://cdn.pixabay.com/photo/2016/11/22/07/09/spruce-1848543__340.jpg');
+//     final colorFilter =
+//         ColorFilter.mode(Colors.black.withOpacity(0.67), BlendMode.darken);
+//     const customTitle = LLSListTile(
+//       titleText: 'Card Title',
+//       subTitleText: 'Sub title',
+//     );
+//     final LLSCard card = LLSCard(
+//       color: color,
+//       title: customTitle,
+//       imageOverlay: imageOverlay,
+//       colorFilter: colorFilter,
+//       image: Image.network(
+//           'https://cdn.pixabay.com/photo/2021/02/01/16/22/flamingo-5971206__340.jpg'),
+//     );
+
+//     final TestApp app = TestApp(card);
+
+//     await tester.pumpWidget(Container(child: childWidget));
+//     expect(find.byWidget(childWidget), findsOneWidget);
+//     expect(app.card.color, color);
+//     expect(app.card.title, customTitle);
+//     expect(app.card.imageOverlay, imageOverlay);
+//     expect(app.card.colorFilter, colorFilter);
+//   });
+}
+
+class TestApp extends StatefulWidget {
+  const TestApp(this.card);
+
+  final LLSCard card;
+
+  @override
+  _TestAppState createState() => _TestAppState();
+}
+
+class _TestAppState extends State<TestApp> {
+  bool fav = false;
+
+  @override
+  Widget build(BuildContext context) => MaterialApp(
+        home: Scaffold(
+          body: Column(
+            children: [
+              widget.card,
+            ],
+          ),
+        ),
+      );
+}
\ No newline at end of file