negodesign 0.0.72 → 0.0.74

package/dist/docs/components.js

@@ -10,26 +10,26 @@ export const categories = [
     "Login / Security",
     "Full Pages",
 ];
-const navButtonExample = `import { Menu } from "negodesign"
-
-<Menu
-  isBorder
-  isLightSwitch
-  isLanguageSwitcher
-  logo={{ label: "Negoturismo" }}
-  navMenuButton={{
-    textButtonLogin: "Sign in",
-    textButtonRegister: "Register",
-    onclickButtonLogin: () => {},
-    onclickButtonRegister: () => {},
-    buttonClass: "bg-primary text-white",
-  }}
-  navMenu={{
-    links: [
-      { label: "Home", url: "/", icon: Home01Icon },
-      { label: "Accommodation", url: "/hospedagem", icon: Hotel01Icon },
-    ],
-  }}
+const navButtonExample = `import { Menu } from "negodesign"
+
+<Menu
+  isBorder
+  isLightSwitch
+  isLanguageSwitcher
+  logo={{ label: "Negoturismo" }}
+  navMenuButton={{
+    textButtonLogin: "Sign in",
+    textButtonRegister: "Register",
+    onclickButtonLogin: () => {},
+    onclickButtonRegister: () => {},
+    buttonClass: "bg-primary text-white",
+  }}
+  navMenu={{
+    links: [
+      { label: "Home", url: "/", icon: Home01Icon },
+      { label: "Accommodation", url: "/hospedagem", icon: Hotel01Icon },
+    ],
+  }}
 />`;
 export const components = [
     {
@@ -59,12 +59,12 @@ export const components = [
         examples: [
             {
                 title: "Search Field",
-                code: `import { SearchInput } from "negodesign"
-
-<SearchInput
-  variant={1}
-  placeholder="Search..."
-  onSubmit={(q) => console.log(q)}
+                code: `import { SearchInput } from "negodesign"
+
+<SearchInput
+  variant={1}
+  placeholder="Search..."
+  onSubmit={(q) => console.log(q)}
 />`,
             },
         ],
@@ -87,14 +87,14 @@ export const components = [
         examples: [
             {
                 title: "Simple Hero",
-                code: `import { SimpleHero } from "negodesign"
-
-<SimpleHero
-  title="Find your ideal stay"
-  subTitle="Welcome"
-  description="Verified hotels, guest houses and apartments."
-  image="/images/hero.jpg"
-  buttons={[{ label: "Explore", variant: "default" }]}
+                code: `import { SimpleHero } from "negodesign"
+
+<SimpleHero
+  title="Find your ideal stay"
+  subTitle="Welcome"
+  description="Verified hotels, guest houses and apartments."
+  image="/images/hero.jpg"
+  buttons={[{ label: "Explore", variant: "default" }]}
 />`,
                 href: "/hero",
             },
@@ -121,24 +121,24 @@ export const components = [
         examples: [
             {
                 title: "Carousel Hero",
-                code: `import { CarouselHero } from "negodesign"
-
-<CarouselHero
-  titleClass="md:text-2xl lg:text-4xl"
-  descriptionClass="text-xs md:text-lg"
-  simpleMenu={{
-    logo: { url: "/", label: "Negoturismo", className: "text-white" },
-    links: [{ label: "Accommodation", url: "#", icon: Hotel01Icon }],
-    isLanguageSwitcher: false,
-    isLightSwitch: false,
-  }}
-  items={[
-    {
-      title: "Find your ideal stay",
-      description: "Verified hotels, guest houses and apartments.",
-      image: "https://images.unsplash.com/photo-1566073771259",
-    },
-  ]}
+                code: `import { CarouselHero } from "negodesign"
+
+<CarouselHero
+  titleClass="md:text-2xl lg:text-4xl"
+  descriptionClass="text-xs md:text-lg"
+  simpleMenu={{
+    logo: { url: "/", label: "Negoturismo", className: "text-white" },
+    links: [{ label: "Accommodation", url: "#", icon: Hotel01Icon }],
+    isLanguageSwitcher: false,
+    isLightSwitch: false,
+  }}
+  items={[
+    {
+      title: "Find your ideal stay",
+      description: "Verified hotels, guest houses and apartments.",
+      image: "https://images.unsplash.com/photo-1566073771259",
+    },
+  ]}
 />`,
                 href: "/hero/carousel",
             },
@@ -168,14 +168,14 @@ export const components = [
         examples: [
             {
                 title: "CTA Image Banner",
-                code: `import { CtaCardImageBanner } from "negodesign"
-
-<CtaCardImageBanner
-  title="Let's get in touch"
-  description="Talk to us and discover the best offers."
-  primaryText="Contact"
-  primaryHref="#"
-  imageSrc="/images/banner.jpg"
+                code: `import { CtaCardImageBanner } from "negodesign"
+
+<CtaCardImageBanner
+  title="Let's get in touch"
+  description="Talk to us and discover the best offers."
+  primaryText="Contact"
+  primaryHref="#"
+  imageSrc="/images/banner.jpg"
 />`,
                 href: "/banner",
             },
@@ -206,13 +206,13 @@ export const components = [
         examples: [
             {
                 title: "Notification Banner",
-                code: `import { NotificationBanner } from "negodesign"
-
-<NotificationBanner
-  strongText="New"
-  description="New offers available!"
-  ctaText="View offers"
-  onDismiss={() => console.log("dismissed")}
+                code: `import { NotificationBanner } from "negodesign"
+
+<NotificationBanner
+  strongText="New"
+  description="New offers available!"
+  ctaText="View offers"
+  onDismiss={() => console.log("dismissed")}
 />`,
             },
         ],
@@ -239,14 +239,14 @@ export const components = [
         examples: [
             {
                 title: "Ad Banner",
-                code: `import { AdCardBanner } from "negodesign"
-
-<AdCardBanner
-  tagText="This ad could be yours."
-  titleHighlight="This ad"
-  titleMain="could be yours."
-  buttonText="Learn more"
-  onClickButton={() => console.log("clicked")}
+                code: `import { AdCardBanner } from "negodesign"
+
+<AdCardBanner
+  tagText="This ad could be yours."
+  titleHighlight="This ad"
+  titleMain="could be yours."
+  buttonText="Learn more"
+  onClickButton={() => console.log("clicked")}
 />`,
                 href: "/banner/cad-add",
             },
@@ -272,13 +272,13 @@ export const components = [
         examples: [
             {
                 title: "CTA Banner",
-                code: `import { CtaCardBanner } from "negodesign"
-
-<CtaCardBanner
-  title="Let's get in touch"
-  description="We have the ideal solution for you."
-  primaryText="Contact"
-  secondaryText="Learn more"
+                code: `import { CtaCardBanner } from "negodesign"
+
+<CtaCardBanner
+  title="Let's get in touch"
+  description="We have the ideal solution for you."
+  primaryText="Contact"
+  secondaryText="Learn more"
 />`,
                 href: "/banner/card-contact-cta",
             },
@@ -306,16 +306,16 @@ export const components = [
         examples: [
             {
                 title: "Media Card",
-                code: `import { CardMedia } from "negodesign"
-
-<CardMedia
-  {...item}
-  variant={2}
-  isImageButtonMaximized
-  isVideoButtonMaximized
-  onFavoriteClick={(id) => console.log(id)}
-  onButtonProfile={(id) => console.log(id)}
-  onButtonDetails={(id) => console.log(id)}
+                code: `import { CardMedia } from "negodesign"
+
+<CardMedia
+  {...item}
+  variant={2}
+  isImageButtonMaximized
+  isVideoButtonMaximized
+  onFavoriteClick={(id) => console.log(id)}
+  onButtonProfile={(id) => console.log(id)}
+  onButtonDetails={(id) => console.log(id)}
 />`,
                 href: "/card/media",
             },
@@ -353,13 +353,13 @@ export const components = [
         examples: [
             {
                 title: "Profile Card",
-                code: `import { CardProfile } from "negodesign"
-
-<CardProfile
-  {...item}
-  variant={1}
-  onFavoriteClick={(id) => console.log(id)}
-  onWhatsappClick={(id) => console.log(id)}
+                code: `import { CardProfile } from "negodesign"
+
+<CardProfile
+  {...item}
+  variant={1}
+  onFavoriteClick={(id) => console.log(id)}
+  onWhatsappClick={(id) => console.log(id)}
 />`,
                 href: "/card/profile",
             },
@@ -394,16 +394,16 @@ export const components = [
         examples: [
             {
                 title: "Badge Carousel",
-                code: `import { CarouselBadge } from "negodesign"
-
-<CarouselBadge
-  orientation="horizontal"
-  itemStyle="BORDER"
-  items={[
-    { label: "Hotels", value: "hotel", icon: Hotel01Icon },
-    { label: "Pensions", value: "pensao", icon: BedDoubleIcon },
-  ]}
-  onClick={(value) => console.log(value)}
+                code: `import { CarouselBadge } from "negodesign"
+
+<CarouselBadge
+  orientation="horizontal"
+  itemStyle="BORDER"
+  items={[
+    { label: "Hotels", value: "hotel", icon: Hotel01Icon },
+    { label: "Pensions", value: "pensao", icon: BedDoubleIcon },
+  ]}
+  onClick={(value) => console.log(value)}
 />`,
                 href: "/carousel/badge",
             },
@@ -435,18 +435,18 @@ export const components = [
         examples: [
             {
                 title: "Highlights Carousel",
-                code: `import { CarouselHighlights } from "negodesign"
-
-<CarouselHighlights
-  varient={2}
-  headerProps={{
-    title: "Highlights",
-    description: "The best organizations",
-    onButtonViewAll: () => {},
-  }}
-  items={highlights}
-  onClickBtn={(id) => console.log(id)}
-  onClickFavorite={(id) => console.log(id)}
+                code: `import { CarouselHighlights } from "negodesign"
+
+<CarouselHighlights
+  varient={2}
+  headerProps={{
+    title: "Highlights",
+    description: "The best organizations",
+    onButtonViewAll: () => {},
+  }}
+  items={highlights}
+  onClickBtn={(id) => console.log(id)}
+  onClickFavorite={(id) => console.log(id)}
 />`,
                 href: "/carousel/highlights",
             },
@@ -473,16 +473,16 @@ export const components = [
         examples: [
             {
                 title: "Promotion Carousel",
-                code: `import { CarouselPromotion } from "negodesign"
-
-<CarouselPromotion
-  items={promotions}
-  headerProps={{
-    title: "Promotions",
-    onButtonViewAll: () => {},
-  }}
-  onClickBuy={(id) => console.log(id)}
-  onClickShop={(id) => console.log(id)}
+                code: `import { CarouselPromotion } from "negodesign"
+
+<CarouselPromotion
+  items={promotions}
+  headerProps={{
+    title: "Promotions",
+    onButtonViewAll: () => {},
+  }}
+  onClickBuy={(id) => console.log(id)}
+  onClickShop={(id) => console.log(id)}
 />`,
                 href: "/carousel/promotion",
             },
@@ -509,15 +509,15 @@ export const components = [
         examples: [
             {
                 title: "Media Grid",
-                code: `import { CarouselGridMedia } from "negodesign"
-
-<CarouselGridMedia
-  items={media}
-  headerProps={{
-    title: "Explore",
-    onButtonViewAll: () => {},
-  }}
-  onFavoriteClick={(id) => console.log(id)}
+                code: `import { CarouselGridMedia } from "negodesign"
+
+<CarouselGridMedia
+  items={media}
+  headerProps={{
+    title: "Explore",
+    onButtonViewAll: () => {},
+  }}
+  onFavoriteClick={(id) => console.log(id)}
 />`,
                 href: "/carousel/grid/media",
             },
@@ -548,14 +548,14 @@ export const components = [
         examples: [
             {
                 title: "Simple Grid",
-                code: `import { ItemsSimpleGrid } from "negodesign"
-
-<ItemsSimpleGrid
-  variant={1}
-  items={[
-    { icon: Coffee03Icon, title: "Coffee", description: "Start your day right" },
-  ]}
-  onClick={(id) => console.log(id)}
+                code: `import { ItemsSimpleGrid } from "negodesign"
+
+<ItemsSimpleGrid
+  variant={1}
+  items={[
+    { icon: Coffee03Icon, title: "Coffee", description: "Start your day right" },
+  ]}
+  onClick={(id) => console.log(id)}
 />`,
                 href: "/grid/simple",
             },
@@ -579,13 +579,13 @@ export const components = [
         examples: [
             {
                 title: "Panel Grid",
-                code: `import { ItemsPanel } from "negodesign"
-
-<ItemsPanel
-  style="grid"
-  variant={1}
-  items={items}
-  onClick={(id) => console.log(id)}
+                code: `import { ItemsPanel } from "negodesign"
+
+<ItemsPanel
+  style="grid"
+  variant={1}
+  items={items}
+  onClick={(id) => console.log(id)}
 />`,
                 href: "/grid/panel",
             },
@@ -610,17 +610,17 @@ export const components = [
         examples: [
             {
                 title: "Footer",
-                code: `import { Footer } from "negodesign"
-
-<Footer
-  isNewsletter={true}
-  items={[
-    { title: "Solutions", items: [{ text: "Marketing" }] },
-  ]}
-  socialsMedia={[
-    { icon: "facebook", text: "Facebook", href: "#" },
-  ]}
-  companyName="Negoturismo"
+                code: `import { Footer } from "negodesign"
+
+<Footer
+  isNewsletter={true}
+  items={[
+    { title: "Solutions", items: [{ text: "Marketing" }] },
+  ]}
+  socialsMedia={[
+    { icon: "facebook", text: "Facebook", href: "#" },
+  ]}
+  companyName="Negoturismo"
 />`,
                 href: "/footer",
             },
@@ -647,15 +647,15 @@ export const components = [
         examples: [
             {
                 title: "Admin Panel",
-                code: `import { AdminPanel } from "negodesign"
-
-<AdminPanel>
-  {#snippet appsidebar()}
-    <MenuBarSidebar {user} {menus} {menusButtons} />
-  {/snippet}
-  {#snippet content()}
-    <AdminContent>...content...</AdminContent>
-  {/snippet}
+                code: `import { AdminPanel } from "negodesign"
+
+<AdminPanel>
+  {#snippet appsidebar()}
+    <MenuBarSidebar {user} {menus} {menusButtons} />
+  {/snippet}
+  {#snippet content()}
+    <AdminContent>...content...</AdminContent>
+  {/snippet}
 </AdminPanel>`,
                 href: "/admin/01",
             },
@@ -676,13 +676,13 @@ export const components = [
         examples: [
             {
                 title: "Data Table",
-                code: `import { DataTableCore } from "negodesign"
-
-<DataTableCore
-  items={rows}
-  config={columns}
-  columnFilter="name"
-  actions={RowActions}
+                code: `import { DataTableCore } from "negodesign"
+
+<DataTableCore
+  items={rows}
+  config={columns}
+  columnFilter="name"
+  actions={RowActions}
 />`,
                 href: "/datatable/01",
             },
@@ -704,12 +704,12 @@ export const components = [
         examples: [
             {
                 title: "Sidebar",
-                code: `import { MenuBarSidebar } from "negodesign"
-
-<MenuBarSidebar
-  {menus}
-  {user}
-  {menusButtons}
+                code: `import { MenuBarSidebar } from "negodesign"
+
+<MenuBarSidebar
+  {menus}
+  {user}
+  {menusButtons}
 />`,
             },
         ],
@@ -732,15 +732,15 @@ export const components = [
         examples: [
             {
                 title: "Login Page",
-                code: `import { PageLogin } from "negodesign"
-
-<PageLogin
-  title="Negodesign"
-  formType="EMAIL_PASSWORD"
-  carousel={[
-    { title: "Welcome", description: "Access your account", buttonText: "Sign in" },
-  ]}
-  onSubmit={(credential) => console.log(credential)}
+                code: `import { PageLogin } from "negodesign"
+
+<PageLogin
+  title="Negodesign"
+  formType="EMAIL_PASSWORD"
+  carousel={[
+    { title: "Welcome", description: "Access your account", buttonText: "Sign in" },
+  ]}
+  onSubmit={(credential) => console.log(credential)}
 />`,
                 href: "/login/admin/01",
             },
@@ -767,13 +767,13 @@ export const components = [
         examples: [
             {
                 title: "Company Profile",
-                code: `import { CompanyProfile } from "negodesign"
-
-<CompanyProfile
-  data={data}
-  isLoading={false}
-  onWhatsapp={(id) => console.log(id)}
-  onEmail={(id) => console.log(id)}
+                code: `import { CompanyProfile } from "negodesign"
+
+<CompanyProfile
+  data={data}
+  isLoading={false}
+  onWhatsapp={(id) => console.log(id)}
+  onEmail={(id) => console.log(id)}
 />`,
                 href: "/company-profile",
             },
@@ -797,14 +797,14 @@ export const components = [
         examples: [
             {
                 title: "Privacy Policy",
-                code: `import { PrivacyPolicyOrTermsOfUse } from "negodesign"
-
-<PrivacyPolicyOrTermsOfUse
-  variant={1}
-  title="Privacy Policy"
-  lastUpdated="August 15, 2026"
-  breadcrumb={[{ label: "Home", href: "/" }]}
-  sections={[{ id: "intro", title: "Introduction", blocks: [] }]}
+                code: `import { PrivacyPolicyOrTermsOfUse } from "negodesign"
+
+<PrivacyPolicyOrTermsOfUse
+  variant={1}
+  title="Privacy Policy"
+  lastUpdated="August 15, 2026"
+  breadcrumb={[{ label: "Home", href: "/" }]}
+  sections={[{ id: "intro", title: "Introduction", blocks: [] }]}
 />`,
                 href: "/privacy-policy-or-terms-of-use",
             },
@@ -829,15 +829,15 @@ export const components = [
         examples: [
             {
                 title: "Product Details",
-                code: `import { ProductDetails } from "negodesign"
-
-<ProductDetails
-  varient={1}
-  data={productData}
-  isLoading={false}
-  onBuy={(id) => alert("Buy " + id)}
-  onFavorite={(id) => alert("Favorite " + id)}
-  onCart={(id) => alert("Cart " + id)}
+                code: `import { ProductDetails } from "negodesign"
+
+<ProductDetails
+  varient={1}
+  data={productData}
+  isLoading={false}
+  onBuy={(id) => alert("Buy " + id)}
+  onFavorite={(id) => alert("Favorite " + id)}
+  onCart={(id) => alert("Cart " + id)}
 />`,
                 href: "/product-details/01",
             },
@@ -863,15 +863,15 @@ export const components = [
         examples: [
             {
                 title: "User Profile",
-                code: `import { ProfileUser } from "negodesign"
-
-<ProfileUser
-  varient={1}
-  data={userData}
-  isLoading={false}
-  onLoginAsUser={(id) => alert(id)}
-  onAddAddress={() => alert("Add")}
-  onChangePassword={(p) => alert(JSON.stringify(p))}
+                code: `import { ProfileUser } from "negodesign"
+
+<ProfileUser
+  varient={1}
+  data={userData}
+  isLoading={false}
+  onLoginAsUser={(id) => alert(id)}
+  onAddAddress={() => alert("Add")}
+  onChangePassword={(p) => alert(JSON.stringify(p))}
 />`,
                 href: "/profile-user/01",
             },