@teamsparta/stack-flex/dist/chunk-TASDVMRP.mjs

stack flex

"use client";

import {
  FlexBase,
  __objRest,
  __spreadValues
} from "./chunk-TM2X2NFP.mjs";

// src/Flex.tsx
import {
  mapResponsive,
  useBreakpointContext
} from "@teamsparta/stack-core";
import { forwardRef } from "react";
import { jsx } from "@emotion/react/jsx-runtime";
var _Flex = forwardRef(function FlexBase2(_a, ref) {
  var _b = _a, {
    as,
    direction = "row",
    align = "start",
    justify = "start",
    wrap = "nowrap",
    gap = 0,
    fullHeight = false,
    fullWidth = false,
    padding = 0,
    width,
    height,
    maxWidth,
    maxHeight,
    borderRadius,
    background,
    position,
    flex,
    border
  } = _b, restProps = __objRest(_b, [
    "as",
    "direction",
    "align",
    "justify",
    "wrap",
    "gap",
    "fullHeight",
    "fullWidth",
    "padding",
    "width",
    "height",
    "maxWidth",
    "maxHeight",
    "borderRadius",
    "background",
    "position",
    "flex",
    "border"
  ]);
  const breakpoints = useBreakpointContext("Flex");
  const directions = mapResponsive(
    breakpoints,
    direction,
    (breakpoint, value) => ({
      breakpoint,
      value
    })
  );
  const aligns = mapResponsive(breakpoints, align, (breakpoint, value) => ({
    breakpoint,
    value
  }));
  const justifies = mapResponsive(
    breakpoints,
    justify,
    (breakpoint, value) => ({
      breakpoint,
      value
    })
  );
  const gaps = mapResponsive(breakpoints, gap, (breakpoint, value) => ({
    breakpoint,
    value
  }));
  const wraps = mapResponsive(breakpoints, wrap, (breakpoint, value) => ({
    breakpoint,
    value
  }));
  const fullWidths = mapResponsive(
    breakpoints,
    fullWidth,
    (breakpoint, value) => ({
      breakpoint,
      value
    })
  );
  const fullHeights = mapResponsive(
    breakpoints,
    fullHeight,
    (breakpoint, value) => ({
      breakpoint,
      value
    })
  );
  const paddings = mapResponsive(breakpoints, padding, (breakpoint, value) => ({
    breakpoint,
    value
  }));
  const widths = width ? mapResponsive(breakpoints, width, (breakpoint, value) => ({
    breakpoint,
    value
  })) : void 0;
  const heights = height ? mapResponsive(breakpoints, height, (breakpoint, value) => ({
    breakpoint,
    value
  })) : void 0;
  const maxWidths = maxWidth ? mapResponsive(breakpoints, maxWidth, (breakpoint, value) => ({
    breakpoint,
    value
  })) : void 0;
  const maxHeights = maxHeight ? mapResponsive(breakpoints, maxHeight, (breakpoint, value) => ({
    breakpoint,
    value
  })) : void 0;
  const borderRadiuses = borderRadius ? mapResponsive(breakpoints, borderRadius, (breakpoint, value) => ({
    breakpoint,
    value
  })) : void 0;
  const backgrounds = background ? mapResponsive(breakpoints, background, (breakpoint, value) => ({
    breakpoint,
    value
  })) : void 0;
  const positions = position ? mapResponsive(breakpoints, position, (breakpoint, value) => ({
    breakpoint,
    value
  })) : void 0;
  const flexes = flex ? mapResponsive(breakpoints, flex, (breakpoint, value) => ({
    breakpoint,
    value
  })) : void 0;
  const borders = border ? mapResponsive(breakpoints, border, (breakpoint, value) => ({
    breakpoint,
    value
  })) : void 0;
  return /* @__PURE__ */ jsx(
    FlexBase,
    __spreadValues({
      ref,
      as,
      $direction: directions,
      $align: aligns,
      $justify: justifies,
      $gap: gaps,
      $wrap: wraps,
      $fullHeight: fullHeights,
      $fullWidth: fullWidths,
      $padding: paddings,
      $width: widths,
      $height: heights,
      $maxWidth: maxWidths,
      $maxHeight: maxHeights,
      $borderRadius: borderRadiuses,
      $background: backgrounds,
      $position: positions,
      $flex: flexes,
      $border: borders
    }, restProps)
  );
});
var Column = forwardRef(function ColumnBase(_a, ref) {
  var _b = _a, {
    direction = "column",
    align = "start",
    justify = "start",
    gap = 0,
    wrap = "nowrap"
  } = _b, restProps = __objRest(_b, [
    "direction",
    "align",
    "justify",
    "gap",
    "wrap"
  ]);
  return /* @__PURE__ */ jsx(
    Flex,
    __spreadValues({
      ref,
      direction,
      align,
      justify,
      gap,
      wrap
    }, restProps)
  );
});
var Row = forwardRef(function ColumnBase2(_a, ref) {
  var _b = _a, {
    direction = "row",
    align = "start",
    justify = "start",
    gap = 0,
    wrap = "nowrap"
  } = _b, restProps = __objRest(_b, [
    "direction",
    "align",
    "justify",
    "gap",
    "wrap"
  ]);
  return /* @__PURE__ */ jsx(
    Flex,
    __spreadValues({
      ref,
      direction,
      align,
      justify,
      gap,
      wrap
    }, restProps)
  );
});
var Flex = Object.assign(_Flex, {
  Column,
  Row
});

export {
  Flex
};