@vinyasa/layout 1.0.19

package/dist/esm/container.js

@@ -0,0 +1,40 @@
+import "./container.css";
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { resolveSpacingStyle } from "./474.js";
+var container = 'n27f480';
+const Container = /*#__PURE__*/ forwardRef(({ as: Component = 'div', maxWidth, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, className, style, children, ...rest }, ref)=>{
+    const classes = className ? `${container} ${className}` : container;
+    const spacingStyle = resolveSpacingStyle({
+        m,
+        mt,
+        mr,
+        mb,
+        ml,
+        mx,
+        my,
+        p,
+        pt,
+        pr,
+        pb,
+        pl,
+        px,
+        py
+    });
+    return /*#__PURE__*/ jsx(Component, {
+        ref: ref,
+        className: classes,
+        style: {
+            ...spacingStyle,
+            maxWidth,
+            ...style
+        },
+        ...rest,
+        children: children
+    });
+});
+Container.displayName = 'Container';
+const container_Container = Container;
+const components_container = container_Container;
+export default components_container;
+export { components_container as Container };

package/dist/esm/divider.css

@@ -0,0 +1,16 @@
+._187x3450 {
+  background-color: var(--vinyasa-border-color-default);
+  border: none;
+  flex-shrink: 0;
+}
+
+._187x3451 {
+  width: 100%;
+  height: var(--vinyasa-border-width-thin);
+}
+
+._187x3452 {
+  width: var(--vinyasa-border-width-thin);
+  height: 100%;
+}
+

package/dist/esm/divider.js

@@ -0,0 +1,67 @@
+import "./divider.css";
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { createRuntimeFn } from "./953.js";
+import { resolveSpacingStyle } from "./474.js";
+var divider = createRuntimeFn({
+    defaultClassName: '_187x3450',
+    variantClassNames: {
+        orientation: {
+            horizontal: '_187x3451',
+            vertical: '_187x3452'
+        }
+    },
+    defaultVariants: {
+        orientation: 'horizontal'
+    },
+    compoundVariants: []
+});
+const Divider = /*#__PURE__*/ forwardRef(({ orientation = 'horizontal', decorative = false, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, className, style, ...rest }, ref)=>{
+    const classes = className ? `${divider({
+        orientation
+    })} ${className}` : divider({
+        orientation
+    });
+    const computedStyle = {
+        ...resolveSpacingStyle({
+            m,
+            mt,
+            mr,
+            mb,
+            ml,
+            mx,
+            my,
+            p,
+            pt,
+            pr,
+            pb,
+            pl,
+            px,
+            py
+        }),
+        ...style
+    };
+    if ('vertical' === orientation) return /*#__PURE__*/ jsx("div", {
+        ref: ref,
+        ...decorative ? {
+            'aria-hidden': true
+        } : {
+            role: 'separator',
+            'aria-orientation': 'vertical'
+        },
+        className: classes,
+        style: computedStyle,
+        ...rest
+    });
+    return /*#__PURE__*/ jsx("hr", {
+        ref: ref,
+        className: classes,
+        style: computedStyle,
+        ...rest
+    });
+});
+Divider.displayName = 'Divider';
+const divider_Divider = Divider;
+const components_divider = divider_Divider;
+export default components_divider;
+export { components_divider as Divider };

package/dist/esm/flex.js

@@ -0,0 +1,4 @@
+import { flex_Flex } from "./207.js";
+const flex = flex_Flex;
+export default flex;
+export { flex as Flex };

package/dist/esm/grid.css

@@ -0,0 +1,84 @@
+.w86wcg0 {
+  display: grid;
+}
+
+.w86wcg1 {
+  gap: var(--vinyasa-space1);
+}
+
+.w86wcg2 {
+  gap: var(--vinyasa-space2);
+}
+
+.w86wcg3 {
+  gap: var(--vinyasa-space3);
+}
+
+.w86wcg4 {
+  gap: var(--vinyasa-space4);
+}
+
+.w86wcg5 {
+  gap: var(--vinyasa-space5);
+}
+
+.w86wcg6 {
+  gap: var(--vinyasa-space6);
+}
+
+.w86wcg7 {
+  align-items: flex-start;
+}
+
+.w86wcg8 {
+  align-items: center;
+}
+
+.w86wcg9 {
+  align-items: flex-end;
+}
+
+.w86wcga {
+  align-items: stretch;
+}
+
+.w86wcgb {
+  justify-content: flex-start;
+}
+
+.w86wcgc {
+  justify-content: center;
+}
+
+.w86wcgd {
+  justify-content: flex-end;
+}
+
+.w86wcge {
+  justify-content: space-between;
+}
+
+.w86wcgf {
+  justify-content: space-around;
+}
+
+.w86wcgg {
+  grid-auto-flow: row;
+}
+
+.w86wcgh {
+  grid-auto-flow: column;
+}
+
+.w86wcgi {
+  grid-auto-flow: dense;
+}
+
+.w86wcgj {
+  grid-auto-flow: row dense;
+}
+
+.w86wcgk {
+  grid-auto-flow: column dense;
+}
+

package/dist/esm/grid.js

@@ -0,0 +1,88 @@
+import "./grid.css";
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { createRuntimeFn } from "./953.js";
+import { resolveSpacingStyle } from "./474.js";
+var grid = createRuntimeFn({
+    defaultClassName: 'w86wcg0',
+    variantClassNames: {
+        gap: {
+            1: 'w86wcg1',
+            2: 'w86wcg2',
+            3: 'w86wcg3',
+            4: 'w86wcg4',
+            5: 'w86wcg5',
+            6: 'w86wcg6'
+        },
+        align: {
+            start: 'w86wcg7',
+            center: 'w86wcg8',
+            end: 'w86wcg9',
+            stretch: 'w86wcga'
+        },
+        justify: {
+            start: 'w86wcgb',
+            center: 'w86wcgc',
+            end: 'w86wcgd',
+            between: 'w86wcge',
+            around: 'w86wcgf'
+        },
+        flow: {
+            row: 'w86wcgg',
+            column: 'w86wcgh',
+            dense: 'w86wcgi',
+            'row-dense': 'w86wcgj',
+            'column-dense': 'w86wcgk'
+        }
+    },
+    defaultVariants: {},
+    compoundVariants: []
+});
+const Grid = /*#__PURE__*/ forwardRef(({ as: Component = 'div', columns, rows, gap, align, justify, flow, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, className, style, children, ...rest }, ref)=>{
+    const classes = className ? `${grid({
+        gap,
+        align,
+        justify,
+        flow
+    })} ${className}` : grid({
+        gap,
+        align,
+        justify,
+        flow
+    });
+    const gridTemplateColumns = 'number' == typeof columns ? `repeat(${String(columns)}, 1fr)` : columns;
+    const gridTemplateRows = 'number' == typeof rows ? `repeat(${String(rows)}, 1fr)` : rows;
+    const spacingStyle = resolveSpacingStyle({
+        m,
+        mt,
+        mr,
+        mb,
+        ml,
+        mx,
+        my,
+        p,
+        pt,
+        pr,
+        pb,
+        pl,
+        px,
+        py
+    });
+    return /*#__PURE__*/ jsx(Component, {
+        ref: ref,
+        className: classes,
+        style: {
+            ...spacingStyle,
+            gridTemplateColumns,
+            gridTemplateRows,
+            ...style
+        },
+        ...rest,
+        children: children
+    });
+});
+Grid.displayName = 'Grid';
+const grid_Grid = Grid;
+const components_grid = grid_Grid;
+export default components_grid;
+export { components_grid as Grid };

package/dist/esm/index.d.ts

@@ -0,0 +1,13 @@
+export { default as AspectRatio, type AspectRatioProps } from './components/aspect-ratio';
+export { default as Box, type BoxProps } from './components/box';
+export { default as Center, type CenterProps } from './components/center';
+export { default as Container, type ContainerProps } from './components/container';
+export { default as Divider, type DividerProps } from './components/divider';
+export { default as Flex, type FlexProps } from './components/flex';
+export { default as Grid, type GridProps } from './components/grid';
+export { default as Inline, type InlineProps } from './components/inline';
+export { default as Portal, type PortalProps } from './components/portal';
+export { default as ScrollArea, type ScrollAreaProps } from './components/scroll-area';
+export { default as Spacer, type SpacerProps } from './components/spacer';
+export { default as Stack, type StackProps } from './components/stack';
+export { default as Surface, type SurfaceProps } from './components/surface';

package/dist/esm/index.js

@@ -0,0 +1,13 @@
+export { AspectRatio } from "./aspect-ratio.js";
+export { Box } from "./box.js";
+export { Center } from "./center.js";
+export { Container } from "./container.js";
+export { Divider } from "./divider.js";
+export { Flex } from "./flex.js";
+export { Grid } from "./grid.js";
+export { Inline } from "./inline.js";
+export { Portal } from "./portal.js";
+export { ScrollArea } from "./scroll-area.js";
+export { Spacer } from "./spacer.js";
+export { Stack } from "./stack.js";
+export { Surface } from "./surface.js";

package/dist/esm/inline.js

@@ -0,0 +1,13 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { flex_Flex } from "./207.js";
+const Inline = /*#__PURE__*/ forwardRef((props, ref)=>/*#__PURE__*/ jsx(flex_Flex, {
+        ref: ref,
+        direction: "row",
+        ...props
+    }));
+Inline.displayName = 'Inline';
+const inline_Inline = Inline;
+const inline = inline_Inline;
+export default inline;
+export { inline as Inline };

package/dist/esm/polymorphic.d.ts

@@ -0,0 +1,5 @@
+import type { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';
+export interface PolymorphicProps extends ComponentPropsWithoutRef<'div'> {
+    as?: ElementType;
+    children?: ReactNode;
+}

package/dist/esm/portal.js

@@ -0,0 +1,14 @@
+import { useSyncExternalStore } from "react";
+import { createPortal } from "react-dom";
+const noop = ()=>void 0;
+const emptySubscribe = ()=>noop;
+const Portal = ({ children, container })=>{
+    const mounted = useSyncExternalStore(emptySubscribe, ()=>true, ()=>false);
+    if (!mounted) return null;
+    return /*#__PURE__*/ createPortal(children, container ?? document.body);
+};
+Portal.displayName = 'Portal';
+const portal_Portal = Portal;
+const portal = portal_Portal;
+export default portal;
+export { portal as Portal };

package/dist/esm/scroll-area.css

@@ -0,0 +1,58 @@
+._1mtpkkv0 {
+  position: relative;
+  overflow: hidden;
+}
+
+._1mtpkkv1 {
+  border-radius: inherit;
+  width: 100%;
+  height: 100%;
+}
+
+._1mtpkkv2 {
+  -webkit-user-select: none;
+  user-select: none;
+  touch-action: none;
+  background: var(--vinyasa-border-color-default);
+  transition: background var(--vinyasa-motion-duration-fast) var(--vinyasa-motion-easing-standard);
+  padding: 2px;
+  display: flex;
+}
+
+._1mtpkkv2[data-orientation="vertical"] {
+  width: 10px;
+}
+
+._1mtpkkv2[data-orientation="horizontal"] {
+  flex-direction: column;
+  height: 10px;
+}
+
+._1mtpkkv3 {
+  border-radius: var(--vinyasa-radius-full);
+  background: var(--vinyasa-border-color-default);
+  transition: background var(--vinyasa-motion-duration-fast) var(--vinyasa-motion-easing-standard);
+  flex: 1;
+  position: relative;
+}
+
+._1mtpkkv3:hover {
+  background: var(--vinyasa-on-secondary);
+}
+
+._1mtpkkv3:before {
+  content: "";
+  width: 100%;
+  min-width: 44px;
+  height: 100%;
+  min-height: 44px;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+._1mtpkkv4 {
+  background: var(--vinyasa-border-color-default);
+}
+

package/dist/esm/scroll-area.js

@@ -0,0 +1,68 @@
+import "./scroll-area.css";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { resolveSpacingStyle } from "./474.js";
+import * as __rspack_external__radix_ui_react_scroll_area_93228e9e from "@radix-ui/react-scroll-area";
+var corner = '_1mtpkkv4';
+var root = '_1mtpkkv0';
+var scrollbar = '_1mtpkkv2';
+var thumb = '_1mtpkkv3';
+var viewport = '_1mtpkkv1';
+const ScrollArea = /*#__PURE__*/ forwardRef(({ maxHeight, maxWidth, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, className, style, children, ...rest }, ref)=>{
+    const classes = className ? `${root} ${className}` : root;
+    const computedStyle = {
+        ...resolveSpacingStyle({
+            m,
+            mt,
+            mr,
+            mb,
+            ml,
+            mx,
+            my,
+            p,
+            pt,
+            pr,
+            pb,
+            pl,
+            px,
+            py
+        }),
+        height: maxHeight,
+        width: maxWidth,
+        ...style
+    };
+    return /*#__PURE__*/ jsxs(__rspack_external__radix_ui_react_scroll_area_93228e9e.Root, {
+        ref: ref,
+        className: classes,
+        style: computedStyle,
+        ...rest,
+        children: [
+            /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_scroll_area_93228e9e.Viewport, {
+                className: viewport,
+                children: children
+            }),
+            /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_scroll_area_93228e9e.Scrollbar, {
+                className: scrollbar,
+                orientation: "vertical",
+                children: /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_scroll_area_93228e9e.Thumb, {
+                    className: thumb
+                })
+            }),
+            /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_scroll_area_93228e9e.Scrollbar, {
+                className: scrollbar,
+                orientation: "horizontal",
+                children: /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_scroll_area_93228e9e.Thumb, {
+                    className: thumb
+                })
+            }),
+            /*#__PURE__*/ jsx(__rspack_external__radix_ui_react_scroll_area_93228e9e.Corner, {
+                className: corner
+            })
+        ]
+    });
+});
+ScrollArea.displayName = 'ScrollArea';
+const scroll_area_ScrollArea = ScrollArea;
+const scroll_area = scroll_area_ScrollArea;
+export default scroll_area;
+export { scroll_area as ScrollArea };

package/dist/esm/spacer.css

@@ -0,0 +1,4 @@
+._9riydv0 {
+  flex: 1 0;
+}
+

package/dist/esm/spacer.js

@@ -0,0 +1,18 @@
+import "./spacer.css";
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+var spacer = '_9riydv0';
+const Spacer = /*#__PURE__*/ forwardRef(({ className, ...rest }, ref)=>{
+    const classes = className ? `${spacer} ${className}` : spacer;
+    return /*#__PURE__*/ jsx("div", {
+        ref: ref,
+        "aria-hidden": "true",
+        className: classes,
+        ...rest
+    });
+});
+Spacer.displayName = 'Spacer';
+const spacer_Spacer = Spacer;
+const components_spacer = spacer_Spacer;
+export default components_spacer;
+export { components_spacer as Spacer };

package/dist/esm/spacing.d.ts

@@ -0,0 +1,19 @@
+import type { CSSProperties } from 'react';
+export type SpaceScale = 1 | 2 | 3 | 4 | 5 | 6;
+export interface SpacingProps {
+    m?: SpaceScale;
+    mt?: SpaceScale;
+    mr?: SpaceScale;
+    mb?: SpaceScale;
+    ml?: SpaceScale;
+    mx?: SpaceScale;
+    my?: SpaceScale;
+    p?: SpaceScale;
+    pt?: SpaceScale;
+    pr?: SpaceScale;
+    pb?: SpaceScale;
+    pl?: SpaceScale;
+    px?: SpaceScale;
+    py?: SpaceScale;
+}
+export declare const resolveSpacingStyle: (props: SpacingProps) => CSSProperties;

package/dist/esm/stack.js

@@ -0,0 +1,13 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { flex_Flex } from "./207.js";
+const Stack = /*#__PURE__*/ forwardRef((props, ref)=>/*#__PURE__*/ jsx(flex_Flex, {
+        ref: ref,
+        direction: "column",
+        ...props
+    }));
+Stack.displayName = 'Stack';
+const stack_Stack = Stack;
+const stack = stack_Stack;
+export default stack;
+export { stack as Stack };

package/dist/esm/surface.css

@@ -0,0 +1,28 @@
+._1b2xjv10 {
+  background-color: var(--vinyasa-secondary);
+}
+
+._1b2xjv11 {
+  border-radius: var(--vinyasa-radius-sm);
+}
+
+._1b2xjv12 {
+  border-radius: var(--vinyasa-radius-md);
+}
+
+._1b2xjv13 {
+  border-radius: var(--vinyasa-radius-full);
+}
+
+._1b2xjv14 {
+  box-shadow: var(--vinyasa-elevation-raised);
+}
+
+._1b2xjv15 {
+  box-shadow: var(--vinyasa-elevation-overlay);
+}
+
+._1b2xjv16 {
+  box-shadow: var(--vinyasa-elevation-modal);
+}
+

package/dist/esm/surface.js

@@ -0,0 +1,64 @@
+import "./surface.css";
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { createRuntimeFn } from "./953.js";
+import { resolveSpacingStyle } from "./474.js";
+var surface = createRuntimeFn({
+    defaultClassName: '_1b2xjv10',
+    variantClassNames: {
+        radius: {
+            sm: '_1b2xjv11',
+            md: '_1b2xjv12',
+            full: '_1b2xjv13'
+        },
+        elevation: {
+            raised: '_1b2xjv14',
+            overlay: '_1b2xjv15',
+            modal: '_1b2xjv16'
+        }
+    },
+    defaultVariants: {
+        radius: 'md'
+    },
+    compoundVariants: []
+});
+const Surface = /*#__PURE__*/ forwardRef(({ as: Component = 'div', radius, elevation, m, mt, mr, mb, ml, mx, my, p, pt, pr, pb, pl, px, py, className, style, children, ...rest }, ref)=>{
+    const classes = className ? `${surface({
+        radius,
+        elevation
+    })} ${className}` : surface({
+        radius,
+        elevation
+    });
+    const spacingStyle = resolveSpacingStyle({
+        m,
+        mt,
+        mr,
+        mb,
+        ml,
+        mx,
+        my,
+        p,
+        pt,
+        pr,
+        pb,
+        pl,
+        px,
+        py
+    });
+    return /*#__PURE__*/ jsx(Component, {
+        ref: ref,
+        className: classes,
+        style: {
+            ...spacingStyle,
+            ...style
+        },
+        ...rest,
+        children: children
+    });
+});
+Surface.displayName = 'Surface';
+const surface_Surface = Surface;
+const components_surface = surface_Surface;
+export default components_surface;
+export { components_surface as Surface };