ui-beyable 1.1.0-beta.25 → 1.1.0-beta.26

package/lib/cjs/components/Stack/Stack.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { spaceType } from '../Tokens/Tokens';
 type alignInlineType = 'stretch' | 'start' | 'center' | 'end';
+type justifyType = 'start' | 'center' | 'end' | 'space-between' | 'space-around' | 'space-evenly';
 type flexType = 'none' | 'auto' | 'shrink' | 'grow';
 interface StackType {
     children?: React.ReactNode;
@@ -8,6 +9,7 @@ interface StackType {
     gap?: spaceType;
     shouldWrap?: boolean;
     alignInline?: alignInlineType;
+    justify?: justifyType;
     flex?: flexType;
     style?: React.CSSProperties;
 }
@@ -17,6 +19,6 @@ interface StackRowType {
     flex?: flexType;
     style?: React.CSSProperties;
 }
-declare function Stack({ children, className, gap, alignInline, flex, style }: StackType): JSX.Element;
+declare function Stack({ children, className, gap, alignInline, justify, flex, style }: StackType): JSX.Element;
 declare function StackRow({ children, className, flex, style }: StackRowType): JSX.Element;
 export { Stack, StackRow };

package/lib/cjs/index.js

@@ -3569,7 +3569,7 @@ var getAlignClass = function (direction) {
     }
     return '';
 };
-var getJustifyClass = function (direction) {
+var getJustifyClass$1 = function (direction) {
     switch (direction) {
         case 'start': return flex.flex_justify_start;
         case 'center': return flex.flex_justify_center;
@@ -3615,7 +3615,7 @@ function Inline(_a) {
         cssClass.push(getAlignClass(align));
     }
     if (justify) {
-        cssClass.push(getJustifyClass(justify));
+        cssClass.push(getJustifyClass$1(justify));
     }
     return (React.createElement("div", { className: cssClass.join(' '), style: style }, children));
 }
@@ -4189,8 +4189,19 @@ var getFlexClass = function (flex$1) {
     }
     return '';
 };
+var getJustifyClass = function (direction) {
+    switch (direction) {
+        case 'start': return flex.flex_justify_start;
+        case 'center': return flex.flex_justify_center;
+        case 'end': return flex.flex_justify_end;
+        case 'space-between': return flex.flex_justify_between;
+        case 'space-around': return flex.flex_justify_around;
+        case 'space-evenly': return flex.flex_justify_evenly;
+    }
+    return '';
+};
 function Stack(_a) {
-    var children = _a.children, className = _a.className, _b = _a.gap, gap = _b === void 0 ? 'space.150' : _b, _c = _a.alignInline, alignInline = _c === void 0 ? 'stretch' : _c, flex$1 = _a.flex, _d = _a.style, style = _d === void 0 ? {} : _d;
+    var children = _a.children, className = _a.className, _b = _a.gap, gap = _b === void 0 ? 'space.150' : _b, _c = _a.alignInline, alignInline = _c === void 0 ? 'stretch' : _c, _d = _a.justify, justify = _d === void 0 ? 'start' : _d, flex$1 = _a.flex, _e = _a.style, style = _e === void 0 ? {} : _e;
     var cssClass = [flex.flex, flex.flex_direction_column];
     style.rowGap = token(gap);
     if (className) {
@@ -4202,6 +4213,9 @@ function Stack(_a) {
     if (flex$1) {
         cssClass.push(getFlexClass(flex$1));
     }
+    if (justify) {
+        cssClass.push(getJustifyClass(justify));
+    }
     return (React.createElement("div", { className: cssClass.join(' '), style: style }, children));
 }
 function StackRow(_a) {