flapstacks/dist/index.mjs

Flex layout primitive for React & React Native

var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __objRest = (source, exclude) => {
  var target = {};
  for (var prop in source)
    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
      target[prop] = source[prop];
  if (source != null && __getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(source)) {
      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
        target[prop] = source[prop];
    }
  return target;
};

// src/index.tsx
import React, { memo, forwardRef } from "react";

// src/utils.ts
var removeUndefined = (obj) => {
  Object.keys(obj).forEach((key) => {
    if (obj[key] === void 0)
      delete obj[key];
  });
  return obj;
};
var when = (value, trueValue, falseValue) => {
  if (trueValue && value === true)
    return trueValue;
  if (falseValue && value === false)
    return falseValue;
  return value;
};
var match = (...values) => {
  for (let value of values) {
    if (value !== void 0)
      return value;
  }
};

// src/index.tsx
var DEFAULT_ELEMENT = "div";
var getStackProps = (_a) => {
  var _b = _a, {
    style,
    inline,
    onOverrideStyles,
    flexDirection,
    direction,
    column,
    row,
    wrap,
    noWrap,
    flexWrap,
    gap,
    rowGap,
    columnGap,
    cross,
    align,
    alignItems,
    alignItemsStart,
    alignItemsEnd,
    alignItemsCenter,
    alignItemsBaseline,
    alignItemsStretch,
    alignContent,
    alignContentStart,
    alignContentEnd,
    alignContentCenter,
    alignContentSpaceBetween,
    alignContentSpaceAround,
    alignContentStretch,
    main,
    justify,
    justifyContent,
    justifyContentStart,
    justifyContentEnd,
    justifyContentCenter,
    justifyContentSpaceBetween,
    justifyContentSpaceAround,
    flow,
    flexFlow
  } = _b, rest = __objRest(_b, [
    "style",
    "inline",
    "onOverrideStyles",
    "flexDirection",
    "direction",
    "column",
    "row",
    "wrap",
    "noWrap",
    "flexWrap",
    "gap",
    "rowGap",
    "columnGap",
    "cross",
    "align",
    "alignItems",
    "alignItemsStart",
    "alignItemsEnd",
    "alignItemsCenter",
    "alignItemsBaseline",
    "alignItemsStretch",
    "alignContent",
    "alignContentStart",
    "alignContentEnd",
    "alignContentCenter",
    "alignContentSpaceBetween",
    "alignContentSpaceAround",
    "alignContentStretch",
    "main",
    "justify",
    "justifyContent",
    "justifyContentStart",
    "justifyContentEnd",
    "justifyContentCenter",
    "justifyContentSpaceBetween",
    "justifyContentSpaceAround",
    "flow",
    "flexFlow"
  ]);
  const styles = __spreadProps(__spreadValues({}, style), {
    display: inline ? "inline-flex" : "flex",
    flexDirection: match(direction, flexDirection, when(column, "column"), when(row, "row"), "row"),
    flexWrap: match(when(wrap, "wrap", "no-wrap"), when(flexWrap, "wrap", "no-wrap"), "wrap"),
    gap,
    rowGap,
    columnGap,
    alignContent: match(alignContent, when(alignContentStart, "flex-start"), when(alignContentEnd, "flex-end"), when(alignContentCenter, "center"), alignContentSpaceBetween, alignContentSpaceAround, alignContentStretch),
    alignItems: match(cross, align, alignItems, when(alignItemsStart, "flex-start"), when(alignItemsEnd, "flex-end"), when(alignItemsCenter, "center"), when(alignItemsBaseline, "baseline"), when(alignItemsStretch, "stretch")),
    justifyContent: match(main, justify, justifyContent, when(justifyContentStart, "flex-start"), when(justifyContentEnd, "flex-end"), when(justifyContentCenter, "center"), when(justifyContentSpaceBetween, "space-between"), when(justifyContentSpaceAround, "space-around"))
  });
  removeUndefined(styles);
  return __spreadValues({
    style: onOverrideStyles ? onOverrideStyles(styles) : styles
  }, rest);
};
var Stack = forwardRef(function Stack2(_a, ref) {
  var _b = _a, {
    as
  } = _b, restProps = __objRest(_b, [
    "as"
  ]);
  const Element = as || DEFAULT_ELEMENT;
  const props = getStackProps(restProps);
  return /* @__PURE__ */ React.createElement(Element, __spreadValues({
    ref
  }, props));
});
var MemoizedStack = memo(Stack);
export {
  MemoizedStack,
  Stack
};