@postenbring/hedwig-react
Version:
React components for [Hedwig Design System](https://github.com/bring/hedwig-design-system).
75 lines (73 loc) • 2.22 kB
JavaScript
import {
getResponsiveProps
} from "./chunk-7ROE6ADK.mjs";
import {
getSpacingVariable
} from "./chunk-NE6W2PCD.mjs";
import {
__objRest,
__spreadProps,
__spreadValues
} from "./chunk-YOSPWY5K.mjs";
// src/layout/stack/stack.tsx
import "react";
import { clsx } from "@postenbring/hedwig-css/typed-classname";
import { forwardRef } from "react";
import { Slot } from "@radix-ui/react-slot";
import { jsx } from "react/jsx-runtime";
var Stack = forwardRef(
(_a, ref) => {
var _b = _a, {
children,
asChild,
className,
style: _style,
gap,
gapX,
gapY,
direction,
wrap,
align,
justify
} = _b, rest = __objRest(_b, [
"children",
"asChild",
"className",
"style",
"gap",
"gapX",
"gapY",
"direction",
"wrap",
"align",
"justify"
]);
const Component = asChild ? Slot : "div";
const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, _style), getResponsiveProps("--hds-stack-gap", gap, getSpacingVariable)), getResponsiveProps("--hds-stack-gap-x", gapX, getSpacingVariable)), getResponsiveProps("--hds-stack-gap-y", gapY, getSpacingVariable)), getResponsiveProps("--hds-stack-direction", direction)), getResponsiveProps("--hds-stack-wrap", wrap, (value) => value ? "wrap" : "nowrap")), getResponsiveProps("--hds-stack-align", align)), getResponsiveProps("--hds-stack-justify", justify));
return /* @__PURE__ */ jsx(
Component,
__spreadProps(__spreadValues({
style,
className: clsx("hds-stack", className),
ref
}, rest), {
children
})
);
}
);
Stack.displayName = "Stack";
var HStack = forwardRef((props, ref) => {
return /* @__PURE__ */ jsx(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "row" }));
});
HStack.displayName = "HStack";
var VStack = forwardRef((props, ref) => {
return /* @__PURE__ */ jsx(Stack, __spreadProps(__spreadValues({ ref }, props), { direction: "column" }));
});
VStack.displayName = "VStack";
export {
Stack,
HStack,
VStack
};
//# sourceMappingURL=chunk-FUIKSOJF.mjs.map