@masaraxui/react 1.0.0 → 1.1.1

package/README.md

@@ -3,7 +3,7 @@
       <img 
         alt="MasaraxUI v1 logo" 
         width="100%" 
-        src="https://masaraxui-assets.nyc3.cdn.digitaloceanspaces.com/docs/masaraxui-og_2x.jpg"
+        src=""
       />
   </a>
 </p>
@@ -20,16 +20,12 @@ MasaraxUI is the modern UI library built to help you move fast, stay consistent,
 
 ## Getting Started
 
-Visit <a aria-label="masaraxui learn" href="https://masarax.com/docs/quick-start">https://masarax.com/docs/quick-start</a> to get started with MasaraxUI.
+Visit <a aria-label="masaraxui learn" href="https://github.com/masarax/masaraxui/blob/main/apps/docs/content/docs/react/getting-started/index.mdx">https://github.com/masarax/masaraxui/blob/main/apps/docs/content/docs/react/getting-started/index.mdx</a> to get started with MasaraxUI.
 
 ## Documentation
 
 Visit [https://masarax.com](https://masarax.com) for the full MasaraxUI documentation.
 
-## Storybook
-
-Visit [https://storybook.masarax.com](https://storybook.masarax.com/) to view the storybook for all components.
-
 ## Community
 
 We're excited to see the community adopt MasaraxUI, raise issues, and provide feedback.

package/dist/components/index.d.ts

@@ -72,6 +72,7 @@ export * from "./menu-item";
 export * from "./menu-section";
 export * from "./modal";
 export * from "./number-field";
+export * from "./page-hero";
 export * from "./pagination";
 export * from "./select";
 export * from "./meter";

package/dist/components/page-hero/index.d.ts

@@ -0,0 +1,17 @@
+import type { ComponentProps } from "react";
+import { PageHeroBreadcrumbs, PageHeroDescription, PageHeroRoot, PageHeroTitle } from "./page-hero";
+export declare const PageHero: (({ align, children, className, size, ...props }: import("./page-hero").PageHeroRootProps) => import("react/jsx-runtime").JSX.Element) & {
+    Root: ({ align, children, className, size, ...props }: import("./page-hero").PageHeroRootProps) => import("react/jsx-runtime").JSX.Element;
+    Breadcrumbs: ({ children, className, ...props }: import("./page-hero").PageHeroBreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;
+    Title: ({ children, className, ...props }: import("./page-hero").PageHeroTitleProps) => import("react/jsx-runtime").JSX.Element;
+    Description: ({ children, className, ...props }: import("./page-hero").PageHeroDescriptionProps) => import("react/jsx-runtime").JSX.Element;
+};
+export type PageHero = {
+    Props: ComponentProps<typeof PageHeroRoot>;
+    RootProps: ComponentProps<typeof PageHeroRoot>;
+    BreadcrumbsProps: ComponentProps<typeof PageHeroBreadcrumbs>;
+    TitleProps: ComponentProps<typeof PageHeroTitle>;
+    DescriptionProps: ComponentProps<typeof PageHeroDescription>;
+};
+export { PageHeroRoot, PageHeroBreadcrumbs, PageHeroTitle, PageHeroDescription };
+export type { PageHeroRootProps, PageHeroRootProps as PageHeroProps, PageHeroBreadcrumbsProps, PageHeroTitleProps, PageHeroDescriptionProps, } from "./page-hero";

package/dist/components/page-hero/index.js

@@ -0,0 +1,14 @@
+"use strict";
+import { PageHeroRoot, PageHeroDescription, PageHeroTitle, PageHeroBreadcrumbs } from './page-hero.js';
+
+/* -------------------------------------------------------------------------------------------------
+ * Compound Component
+ * -----------------------------------------------------------------------------------------------*/
+const PageHero = Object.assign(PageHeroRoot, {
+  Root: PageHeroRoot,
+  Breadcrumbs: PageHeroBreadcrumbs,
+  Title: PageHeroTitle,
+  Description: PageHeroDescription
+});
+
+export { PageHero, PageHeroBreadcrumbs, PageHeroDescription, PageHeroRoot, PageHeroTitle };

package/dist/components/page-hero/page-hero.d.ts

@@ -0,0 +1,16 @@
+import type { PageHeroVariants } from "@masaraxui/styles";
+import type { ComponentPropsWithRef } from "react";
+interface PageHeroRootProps extends ComponentPropsWithRef<"div">, PageHeroVariants {
+}
+declare const PageHeroRoot: ({ align, children, className, size, ...props }: PageHeroRootProps) => import("react/jsx-runtime").JSX.Element;
+interface PageHeroBreadcrumbsProps extends ComponentPropsWithRef<"div"> {
+}
+declare const PageHeroBreadcrumbs: ({ children, className, ...props }: PageHeroBreadcrumbsProps) => import("react/jsx-runtime").JSX.Element;
+interface PageHeroTitleProps extends ComponentPropsWithRef<"h1"> {
+}
+declare const PageHeroTitle: ({ children, className, ...props }: PageHeroTitleProps) => import("react/jsx-runtime").JSX.Element;
+interface PageHeroDescriptionProps extends ComponentPropsWithRef<"p"> {
+}
+declare const PageHeroDescription: ({ children, className, ...props }: PageHeroDescriptionProps) => import("react/jsx-runtime").JSX.Element;
+export { PageHeroRoot, PageHeroBreadcrumbs, PageHeroTitle, PageHeroDescription };
+export type { PageHeroRootProps, PageHeroBreadcrumbsProps, PageHeroTitleProps, PageHeroDescriptionProps, };

package/dist/components/page-hero/page-hero.js

@@ -0,0 +1,99 @@
+"use client";
+import { pageHeroVariants } from '@masaraxui/styles';
+import React__default, { createContext, useContext } from 'react';
+import { composeSlotClassName } from '../../utils/compose.js';
+import { jsx } from 'react/jsx-runtime';
+
+const PageHeroContext = /*#__PURE__*/createContext({});
+
+/* -------------------------------------------------------------------------------------------------
+ * PageHero Root
+ * -----------------------------------------------------------------------------------------------*/
+
+const PageHeroRoot = ({
+  align = "left",
+  children,
+  className,
+  size = "md",
+  ...props
+}) => {
+  const slots = React__default.useMemo(() => pageHeroVariants({
+    align,
+    size
+  }), [align, size]);
+  return /*#__PURE__*/jsx(PageHeroContext.Provider, {
+    value: {
+      slots
+    },
+    children: /*#__PURE__*/jsx("div", {
+      className: slots.base({
+        className
+      }),
+      "data-slot": "page-hero",
+      ...props,
+      children: children
+    })
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * PageHero Breadcrumbs
+ * -----------------------------------------------------------------------------------------------*/
+
+const PageHeroBreadcrumbs = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PageHeroContext);
+  return /*#__PURE__*/jsx("div", {
+    className: composeSlotClassName(slots?.breadcrumbs, className),
+    "data-slot": "page-hero-breadcrumbs",
+    ...props,
+    children: children
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * PageHero Title
+ * -----------------------------------------------------------------------------------------------*/
+
+const PageHeroTitle = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PageHeroContext);
+  return /*#__PURE__*/jsx("h1", {
+    className: composeSlotClassName(slots?.title, className),
+    "data-slot": "page-hero-title",
+    ...props,
+    children: children
+  });
+};
+
+/* -------------------------------------------------------------------------------------------------
+ * PageHero Description
+ * -----------------------------------------------------------------------------------------------*/
+
+const PageHeroDescription = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    slots
+  } = useContext(PageHeroContext);
+  return /*#__PURE__*/jsx("p", {
+    className: composeSlotClassName(slots?.description, className),
+    "data-slot": "page-hero-description",
+    ...props,
+    children: children
+  });
+};
+
+export { PageHeroBreadcrumbs, PageHeroDescription, PageHeroRoot, PageHeroTitle };

package/dist/index.js

@@ -153,6 +153,8 @@ export { Modal } from './components/modal/index.js';
 export { ModalBackdrop, ModalBody, ModalCloseTrigger, ModalContainer, ModalDialog, ModalFooter, ModalHeader, ModalHeading, ModalIcon, ModalRoot, ModalTrigger } from './components/modal/modal.js';
 export { NumberField } from './components/number-field/index.js';
 export { NumberFieldDecrementButton, NumberFieldGroup, NumberFieldIncrementButton, NumberFieldInput, NumberFieldRoot } from './components/number-field/number-field.js';
+export { PageHero } from './components/page-hero/index.js';
+export { PageHeroBreadcrumbs, PageHeroDescription, PageHeroRoot, PageHeroTitle } from './components/page-hero/page-hero.js';
 export { Pagination } from './components/pagination/index.js';
 export { PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationNextIcon, PaginationPrevious, PaginationPreviousIcon, PaginationRoot, PaginationSummary } from './components/pagination/pagination.js';
 export { Select } from './components/select/index.js';

package/dist/version.js

@@ -1,5 +1,5 @@
 // This file is generated during the build process
 // It will be replaced with the actual version from package.json
-const MASARAXUI_VERSION = "1.0.0";
+const MASARAXUI_VERSION = "1.1.1";
 
 export { MASARAXUI_VERSION };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@masaraxui/react",
-  "version": "1.0.0",
+  "version": "1.1.1",
   "description": "🚀 Beautiful and modern React UI library",
   "license": "MIT",
   "type": "module",
@@ -251,6 +251,10 @@
       "import": "./dist/components/number-field/index.js",
       "types": "./dist/components/number-field/index.d.ts"
     },
+    "./page-hero": {
+      "import": "./dist/components/page-hero/index.js",
+      "types": "./dist/components/page-hero/index.d.ts"
+    },
     "./pagination": {
       "import": "./dist/components/pagination/index.js",
       "types": "./dist/components/pagination/index.d.ts"
@@ -396,7 +400,7 @@
     "react-aria-components": "1.16.0",
     "tailwind-merge": "3.4.0",
     "tailwind-variants": "3.2.2",
-    "@masaraxui/styles": "1.0.0"
+    "@masaraxui/styles": "1.1.1"
   },
   "peerDependencies": {
     "react": ">=19.0.0",