@versini/ui-main 4.0.8 → 4.0.10

package/README.md

@@ -1,12 +1,12 @@
 # @versini/ui-main
 
 [![npm version](https://img.shields.io/npm/v/@versini/ui-main?style=flat-square)](https://www.npmjs.com/package/@versini/ui-main)
+![npm package minimized gzipped size](<https://img.shields.io/bundlejs/size/%40versini%2Fui-main?style=flat-square&label=size%20(gzip)>)
 
 > A semantic and accessible React main component built with TypeScript and TailwindCSS.
 
 The Main component provides a semantic main element for page content with customizable margins, padding, and styling options. Perfect for creating accessible page layouts and content areas.
 
-
 ## Table of Contents
 
 - [Features](#features)
@@ -27,7 +27,7 @@ The Main component provides a semantic main element for page content with custom
 npm install @versini/ui-main
 ```
 
-> **Note**: This component requires TailwindCSS and the `@versini/ui-styles` plugin for proper styling. See the [root README](../../README.md#tailwindcss-setup) for complete setup instructions.
+> **Note**: This component requires TailwindCSS and the `@versini/ui-styles` plugin for proper styling. See the [installation documentation](https://versini-org.github.io/ui-components/?path=/docs/getting-started-installation--docs) for complete setup instructions.
 
 ## Usage
 
@@ -83,15 +83,15 @@ function App() {
 
 ### Main Props
 
-| Prop | Type | Default | Description |
-|------|------|---------|-------------|
-| children | `React.ReactNode` | - | The children to render |
-| noMargin | `boolean` | `false` | Whether to render without margin |
-| noPadding | `boolean` | `false` | Whether to render without padding |
-| raw | `boolean` | `false` | Whether to render with no styles |
-| className | `string` | - | CSS class(es) to add to the main component wrapper |
+| Prop      | Type              | Default | Description                                        |
+| --------- | ----------------- | ------- | -------------------------------------------------- |
+| children  | `React.ReactNode` | -       | The children to render                             |
+| noMargin  | `boolean`         | `false` | Whether to render without margin                   |
+| noPadding | `boolean`         | `false` | Whether to render without padding                  |
+| raw       | `boolean`         | `false` | Whether to render with no styles                   |
+| className | `string`          | -       | CSS class(es) to add to the main component wrapper |
 
-*Also supports all standard HTML main element attributes*
+_Also supports all standard HTML main element attributes_
 
 ## Examples
 
@@ -108,14 +108,14 @@ function PageLayout() {
       <Header sticky>
         <nav>Navigation content</nav>
       </Header>
-      
+
       <Main className="flex-1">
         <div className="max-w-7xl mx-auto px-4 py-8">
           <h1>Page Title</h1>
           <p>Main page content...</p>
         </div>
       </Main>
-      
+
       <Footer row1="© 2024 Company" />
     </div>
   );
@@ -135,11 +135,11 @@ function ArticleLayout() {
           <h1>Understanding React Components</h1>
           <time dateTime="2024-01-15">January 15, 2024</time>
         </header>
-        
+
         <section>
           <p>Introduction to the article...</p>
         </section>
-        
+
         <section>
           <h2>Core Concepts</h2>
           <p>Main content...</p>
@@ -157,18 +157,12 @@ import { Main } from "@versini/ui-main";
 
 function DashboardLayout() {
   return (
-    <Main 
-      noMargin 
-      noPadding 
-      className="min-h-screen bg-gray-50"
-    >
+    <Main noMargin noPadding className="min-h-screen bg-gray-50">
       <div className="grid grid-cols-1 lg:grid-cols-4 gap-6 p-6">
         <aside className="lg:col-span-1">
-          <div className="bg-white rounded-lg shadow p-4">
-            Sidebar content
-          </div>
+          <div className="bg-white rounded-lg shadow p-4">Sidebar content</div>
         </aside>
-        
+
         <section className="lg:col-span-3">
           <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
             <div className="bg-white rounded-lg shadow p-6">
@@ -192,18 +186,14 @@ import { Main } from "@versini/ui-main";
 
 function FullWidthContent() {
   return (
-    <Main 
-      noMargin 
-      noPadding 
-      className="w-full"
-    >
+    <Main noMargin noPadding className="w-full">
       <section className="bg-blue-600 text-white py-20">
         <div className="container mx-auto text-center">
           <h1 className="text-4xl font-bold">Hero Section</h1>
           <p className="text-xl mt-4">Full-width hero content</p>
         </div>
       </section>
-      
+
       <section className="py-16">
         <div className="container mx-auto">
           <h2 className="text-3xl font-bold text-center mb-8">Features</h2>
@@ -226,10 +216,7 @@ import { Main } from "@versini/ui-main";
 
 function RawMain() {
   return (
-    <Main 
-      raw 
-      className="my-custom-main-styles"
-    >
+    <Main raw className="my-custom-main-styles">
       <div className="completely-custom-layout">
         Custom main with no default styles
       </div>

package/dist/index.js

@@ -1,12 +1,12 @@
 import { MAIN_CLASSNAME as o, Main as I } from "./components/Main/Main.js";
 /*!
-  @versini/ui-main v4.0.8
+  @versini/ui-main v4.0.10
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_MAIN__ || (window.__VERSINI_UI_MAIN__ = {
-    version: "4.0.8",
-    buildTime: "08/23/2025 09:09 AM EDT",
+    version: "4.0.10",
+    buildTime: "08/23/2025 12:23 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-main",
-	"version": "4.0.8",
+	"version": "4.0.10",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -50,5 +50,5 @@
 	"sideEffects": [
 		"**/*.css"
 	],
-	"gitHead": "7bbfa99a4441ef5b0828a37d190f694e199b663d"
+	"gitHead": "d568e20474c6c87f836c4cb6548f2cc0143a353c"
 }