@latte-macchiat-io/latte-vanilla-components 0.0.124 → 0.0.126

package/dist/latte-vanilla-components.css

@@ -1 +1 @@
-._1wp326d2{display:flex;background-color:var(--_1wp326d1);flex:1 1 auto;min-height:45vh;text-align:center;align-items:center;flex-direction:column;justify-content:center}@media (min-width: 768px){._1wp326d2{min-height:var(--_1wp326d0)}}
+._1wp326d2{display:flex;background-color:var(--_1wp326d1);flex:1 1 auto;min-height:45vh;text-align:center;align-items:center;flex-direction:column;justify-content:center}@media (min-width: 768px){._1wp326d2{min-height:var(--_1wp326d0)}}.jqc4y0a{width:100%;display:flex;align-items:center;position:relative;flex-direction:column;animation:background .5s ease-in-out;color:var(--jqc4y02);z-index:var(--jqc4y01);min-height:var(--jqc4y07);padding-top:var(--jqc4y03);padding-left:var(--jqc4y04);padding-right:var(--jqc4y05);padding-bottom:var(--jqc4y06);background:var(--jqc4y09);justify-content:var(--jqc4y08)}.jqc4y0b{gap:15px;width:100%;display:flex;flex-direction:column;max-width:var(--max-width);text-align:var(--jqc4y00);align-items:var(--jqc4y00)}

package/dist/types/components/Section/export.d.ts

@@ -1,2 +1,4 @@
 export { Section } from '.';
 export type { SectionProps } from '.';
+export { Align as SectionAlign } from './types';
+export { styles as SectionStyles } from './styles.css';

package/dist/types/components/Section/index.d.ts

@@ -1,13 +1,12 @@
-import { CSSProperties } from 'react';
-import { Align } from './types';
 import { Theme } from '../../types/theme';
+import { Align } from './types';
 export type SectionProps = {
     id?: string;
     theme?: Theme;
     align?: Align;
     zIndex?: number;
     isDark?: boolean;
-    styles?: CSSProperties;
+    className: string;
     isFullHeight?: boolean;
     noPaddingTop?: boolean;
     children: React.ReactNode;
@@ -15,4 +14,4 @@ export type SectionProps = {
     backgroundColor?: string;
     backgroundGradient?: string;
 };
-export declare const Section: ({ children, zIndex, styles, id, isDark, align, isFullHeight, noPaddingTop, backgroundColor, theme, noPaddingBottom, }: SectionProps) => import("react").JSX.Element;
+export declare const Section: ({ children, className, zIndex, id, isDark, align, isFullHeight, noPaddingTop, theme, backgroundColor, noPaddingBottom, }: SectionProps) => import("react").JSX.Element;

package/dist/types/components/Section/stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
-    component: ({ children, zIndex, styles, id, isDark, align, isFullHeight, noPaddingTop, backgroundColor, theme, noPaddingBottom, }: import('.').SectionProps) => import("react").JSX.Element;
+    component: ({ children, className, zIndex, id, isDark, align, isFullHeight, noPaddingTop, theme, backgroundColor, noPaddingBottom, }: import('.').SectionProps) => import("react").JSX.Element;
     parameters: {
         layout: string;
     };
@@ -12,3 +12,5 @@ export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
 export declare const FullHeight: Story;
+export declare const AlignCenter: Story;
+export declare const BackgroundColor: Story;

package/dist/types/components/Section/styles.css.d.ts

@@ -0,0 +1,12 @@
+export declare const sectionAlignVar: `var(--${string})`;
+export declare const sectionZIndexVar: `var(--${string})`;
+export declare const sectionColorVar: `var(--${string})`;
+export declare const sectionPaddingTopVar: `var(--${string})`;
+export declare const sectionPaddingLeftVar: `var(--${string})`;
+export declare const sectionPaddingRightVar: `var(--${string})`;
+export declare const sectionPaddingBottomVar: `var(--${string})`;
+export declare const sectionMinHeightVar: `var(--${string})`;
+export declare const sectionJustifyContentVar: `var(--${string})`;
+export declare const sectionBackgroundColorVar: `var(--${string})`;
+export declare const styles: string;
+export declare const sectionContentStyles: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@latte-macchiat-io/latte-vanilla-components",
-  "version": "0.0.124",
+  "version": "0.0.126",
   "description": "Beautiful components for amazing projects, with a touch of Vanilla 🥤",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",

package/dist/types/components/Section/styles.d.ts

@@ -1,22 +0,0 @@
-import { CSSProperties } from 'react';
-import { Theme } from '../../types/theme';
-import { Align } from './types';
-interface IStyledSection {
-    align: Align;
-    theme: Theme;
-    zIndex: number;
-    isDark: boolean;
-    styles: CSSProperties;
-    isFullHeight: boolean;
-    noPaddingTop: boolean;
-    backgroundColor: string;
-    noPaddingBottom: boolean;
-}
-export declare const StyledSection: import('@emotion/styled').StyledComponent<{
-    theme?: import('@emotion/react').Theme;
-    as?: React.ElementType;
-} & IStyledSection, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
-export declare const StyledSectionContent: import('@emotion/styled').StyledComponent<Omit<import('framer-motion').HTMLMotionProps<"div">, "ref"> & import('react').RefAttributes<HTMLDivElement> & {
-    theme?: import('@emotion/react').Theme;
-}, {}, {}>;
-export {};