@fluentui-react-native/stack 0.11.0 → 0.11.1

package/lib-commonjs/Stack.js

@@ -1,122 +1,103 @@
-'use strict';
-var __createBinding =
-  (this && this.__createBinding) ||
-  (Object.create
-    ? function (o, m, k, k2) {
-        if (k2 === undefined) k2 = k;
-        var desc = Object.getOwnPropertyDescriptor(m, k);
-        if (!desc || ('get' in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-          desc = {
-            enumerable: true,
-            get: function () {
-              return m[k];
-            },
-          };
-        }
-        Object.defineProperty(o, k2, desc);
-      }
-    : function (o, m, k, k2) {
-        if (k2 === undefined) k2 = k;
-        o[k2] = m[k];
-      });
-var __setModuleDefault =
-  (this && this.__setModuleDefault) ||
-  (Object.create
-    ? function (o, v) {
-        Object.defineProperty(o, 'default', { enumerable: true, value: v });
-      }
-    : function (o, v) {
-        o['default'] = v;
-      });
-var __importStar =
-  (this && this.__importStar) ||
-  (function () {
-    var ownKeys = function (o) {
-      ownKeys =
-        Object.getOwnPropertyNames ||
-        function (o) {
-          var ar = [];
-          for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-          return ar;
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
         };
-      return ownKeys(o);
+        return ownKeys(o);
     };
     return function (mod) {
-      if (mod && mod.__esModule) return mod;
-      var result = {};
-      if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== 'default') __createBinding(result, mod, k[i]);
-      __setModuleDefault(result, mod);
-      return result;
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
     };
-  })();
-var __importDefault =
-  (this && this.__importDefault) ||
-  function (mod) {
-    return mod && mod.__esModule ? mod : { default: mod };
-  };
-Object.defineProperty(exports, '__esModule', { value: true });
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.Stack = void 0;
-const jsx_runtime_1 = require('@fluentui-react-native/framework-base/jsx-runtime');
+const jsx_runtime_1 = require("@fluentui-react-native/framework-base/jsx-runtime");
 /** @jsxImportSource @fluentui-react-native/framework-base */
-const React = __importStar(require('react'));
-const react_native_1 = require('react-native');
-const adapters_1 = require('@fluentui-react-native/adapters');
-const tokens_1 = require('@fluentui-react-native/tokens');
-const foundation_compose_1 = require('@uifabricshared/foundation-compose');
-const foundation_settings_1 = require('@uifabricshared/foundation-settings');
-const Stack_settings_1 = require('./Stack.settings');
-const Stack_tokens_1 = require('./Stack.tokens');
-const Stack_types_1 = require('./Stack.types');
-const StackItem_1 = __importDefault(require('./StackItem/StackItem'));
+const React = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const adapters_1 = require("@fluentui-react-native/adapters");
+const tokens_1 = require("@fluentui-react-native/tokens");
+const foundation_compose_1 = require("@uifabricshared/foundation-compose");
+const foundation_settings_1 = require("@uifabricshared/foundation-settings");
+const Stack_settings_1 = require("./Stack.settings");
+const Stack_tokens_1 = require("./Stack.tokens");
+const Stack_types_1 = require("./Stack.types");
+const StackItem_1 = __importDefault(require("./StackItem/StackItem"));
 function _mixinStyle(style, mixin) {
-  return style ? [style, mixin] : mixin;
+    return style ? [style, mixin] : mixin;
 }
 const _styleKey = 'style';
 const render = (Slots, renderData, ...children) => {
-  const { gap, horizontal, wrap } = renderData.state;
-  if (gap && gap > 0 && children && globalThis.__jsiExecutorDescription !== 'ChakraRuntime') {
-    const extraStyle = horizontal ? { marginLeft: gap } : { marginTop: gap };
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore - TODO, fix typing error
-    children = React.Children.map(children, (child, index) => {
-      if (React.isValidElement(child) && index > 0) {
-        const childProps = child.props;
-        const extraProps = { style: _mixinStyle(childProps[_styleKey], extraStyle) };
-        return React.cloneElement(child, {
-          ...childProps,
-          ...extraProps,
+    const { gap, horizontal, wrap } = renderData.state;
+    if (gap && gap > 0 && children && globalThis.__jsiExecutorDescription !== 'ChakraRuntime') {
+        const extraStyle = horizontal ? { marginLeft: gap } : { marginTop: gap };
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore - TODO, fix typing error
+        children = React.Children.map(children, (child, index) => {
+            if (React.isValidElement(child) && index > 0) {
+                const childProps = child.props;
+                const extraProps = { style: _mixinStyle(childProps[_styleKey], extraStyle) };
+                return React.cloneElement(child, {
+                    ...childProps,
+                    ...extraProps,
+                });
+            }
+            return child;
         });
-      }
-      return child;
-    });
-  }
-  if (wrap) {
-    return jsx_runtime_1.jsx(Slots.root, { children: jsx_runtime_1.jsx(Slots.inner, { children: children }) });
-  }
-  return jsx_runtime_1.jsx(Slots.root, { children: children });
+    }
+    if (wrap) {
+        return (jsx_runtime_1.jsx(Slots.root, { children: jsx_runtime_1.jsx(Slots.inner, { children: children }) }));
+    }
+    return jsx_runtime_1.jsx(Slots.root, { children: children });
 };
 exports.Stack = (0, foundation_compose_1.compose)({
-  displayName: Stack_types_1.stackName,
-  settings: Stack_settings_1.settings,
-  statics: {
-    Item: StackItem_1.default,
-  },
-  usePrepareProps: (props, useStyling) => {
-    const { gap, horizontal, wrap, ...rest } = props;
-    return {
-      slotProps: (0, foundation_settings_1.mergeSettings)(useStyling(props), { root: rest }),
-      state: { gap, horizontal, wrap },
-    };
-  },
-  render: render,
-  slots: {
-    root: { slotType: react_native_1.View, filter: adapters_1.filterViewProps },
-    inner: { slotType: react_native_1.View, filter: adapters_1.filterViewProps },
-  },
-  styles: {
-    root: [Stack_tokens_1.buildStackRootStyles, tokens_1.backgroundColorTokens, tokens_1.borderTokens],
-    inner: [Stack_tokens_1.buildStackInnerStyles],
-  },
+    displayName: Stack_types_1.stackName,
+    settings: Stack_settings_1.settings,
+    statics: {
+        Item: StackItem_1.default,
+    },
+    usePrepareProps: (props, useStyling) => {
+        const { gap, horizontal, wrap, ...rest } = props;
+        return {
+            slotProps: (0, foundation_settings_1.mergeSettings)(useStyling(props), { root: rest }),
+            state: { gap, horizontal, wrap },
+        };
+    },
+    render: render,
+    slots: {
+        root: { slotType: react_native_1.View, filter: adapters_1.filterViewProps },
+        inner: { slotType: react_native_1.View, filter: adapters_1.filterViewProps },
+    },
+    styles: {
+        root: [Stack_tokens_1.buildStackRootStyles, tokens_1.backgroundColorTokens, tokens_1.borderTokens],
+        inner: [Stack_tokens_1.buildStackInnerStyles],
+    },
 });
 exports.default = exports.Stack;
-//# sourceMappingURL=Stack.js.map
+//# sourceMappingURL=Stack.js.map

package/lib-commonjs/Stack.settings.d.ts

@@ -1,4 +1,4 @@
 import type { IComposeSettings } from '@uifabricshared/foundation-compose';
 import type { IStackType } from './Stack.types';
 export declare const settings: IComposeSettings<IStackType>;
-//# sourceMappingURL=Stack.settings.d.ts.map
+//# sourceMappingURL=Stack.settings.d.ts.map

package/lib-commonjs/Stack.settings.js

@@ -1,63 +1,63 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', { value: true });
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.settings = void 0;
-const Stack_types_1 = require('./Stack.types');
+const Stack_types_1 = require("./Stack.types");
 exports.settings = [
-  {
-    root: {
-      style: {
-        display: 'flex',
-      },
-    },
-    inner: {
-      style: {
-        display: 'flex',
-        flexWrap: 'wrap',
-        overflow: 'visible',
-      },
-    },
-    _overrides: {
-      horizontal: {
+    {
         root: {
-          style: {
-            flexDirection: 'row',
-          },
-        },
-        _overrides: {
-          reversed: {
-            root: {
-              style: {
-                flexDirection: 'column-reverse',
-              },
+            style: {
+                display: 'flex',
             },
-          },
         },
-      },
-      reversed: {
-        root: {
-          style: {
-            flexDirection: 'row-reverse',
-          },
-        },
-      },
-      verticalFill: {
-        root: {
-          style: {
-            height: '100%',
-          },
+        inner: {
+            style: {
+                display: 'flex',
+                flexWrap: 'wrap',
+                overflow: 'visible',
+            },
         },
-      },
-      wrap: {
-        root: {
-          style: {
-            flexWrap: 'wrap',
-            height: '100%',
-            overflow: 'visible',
-          },
+        _overrides: {
+            horizontal: {
+                root: {
+                    style: {
+                        flexDirection: 'row',
+                    },
+                },
+                _overrides: {
+                    reversed: {
+                        root: {
+                            style: {
+                                flexDirection: 'column-reverse',
+                            },
+                        },
+                    },
+                },
+            },
+            reversed: {
+                root: {
+                    style: {
+                        flexDirection: 'row-reverse',
+                    },
+                },
+            },
+            verticalFill: {
+                root: {
+                    style: {
+                        height: '100%',
+                    },
+                },
+            },
+            wrap: {
+                root: {
+                    style: {
+                        flexWrap: 'wrap',
+                        height: '100%',
+                        overflow: 'visible',
+                    },
+                },
+            },
         },
-      },
     },
-  },
-  Stack_types_1.stackName,
+    Stack_types_1.stackName,
 ];
-//# sourceMappingURL=Stack.settings.js.map
+//# sourceMappingURL=Stack.settings.js.map

package/lib-commonjs/Stack.tokens.d.ts

@@ -1,6 +1,6 @@
 import type { ViewProps } from 'react-native';
 import type { Theme } from '@fluentui-react-native/framework';
 import type { IStackTokens } from './Stack.types';
-export declare const buildStackInnerStyles: import('@fluentui-react-native/tokens').StyleFactoryFunction<ViewProps, IStackTokens, Theme>;
-export declare const buildStackRootStyles: import('@fluentui-react-native/tokens').StyleFactoryFunction<ViewProps, IStackTokens, Theme>;
-//# sourceMappingURL=Stack.tokens.d.ts.map
+export declare const buildStackInnerStyles: import("@fluentui-react-native/tokens").StyleFactoryFunction<ViewProps, IStackTokens, Theme>;
+export declare const buildStackRootStyles: import("@fluentui-react-native/tokens").StyleFactoryFunction<ViewProps, IStackTokens, Theme>;
+//# sourceMappingURL=Stack.tokens.d.ts.map

package/lib-commonjs/Stack.tokens.js

@@ -1,90 +1,91 @@
-'use strict';
-Object.defineProperty(exports, '__esModule', { value: true });
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.buildStackRootStyles = exports.buildStackInnerStyles = void 0;
-const foundation_tokens_1 = require('@uifabricshared/foundation-tokens');
-const StackUtils_1 = require('./StackUtils');
+const foundation_tokens_1 = require("@uifabricshared/foundation-tokens");
+const StackUtils_1 = require("./StackUtils");
 const nameMap = {
-  start: 'flex-start',
-  end: 'flex-end',
+    start: 'flex-start',
+    end: 'flex-end',
 };
 function _mapAlignment(horizontal, horizontalAlign, verticalAlign, style) {
-  const alignValue = horizontal ? verticalAlign : horizontalAlign;
-  if (alignValue) {
-    style.alignItems = nameMap[alignValue] || alignValue;
-  }
-  const justifyValue = horizontal ? horizontalAlign : verticalAlign;
-  if (justifyValue) {
-    style.justifyContent = nameMap[justifyValue] || justifyValue;
-  }
+    const alignValue = horizontal ? verticalAlign : horizontalAlign;
+    if (alignValue) {
+        style.alignItems = (nameMap[alignValue] || alignValue);
+    }
+    const justifyValue = horizontal ? horizontalAlign : verticalAlign;
+    if (justifyValue) {
+        style.justifyContent = (nameMap[justifyValue] || justifyValue);
+    }
 }
 const _innerKeyProps = [
-  'horizontal',
-  // 'reversed',
-  'gap',
-  'horizontalAlign',
-  'verticalAlign',
-  // 'disableShrink',
-  'childrenGap',
-  'padding',
+    'horizontal',
+    // 'reversed',
+    'gap',
+    'horizontalAlign',
+    'verticalAlign',
+    // 'disableShrink',
+    'childrenGap',
+    'padding',
 ];
 function _buildInnerStyles(tokenProps, theme) {
-  const { horizontal, wrap, horizontalAlign, verticalAlign, padding } = tokenProps;
-  let innerStyle = undefined;
-  const childrenGap = tokenProps.childrenGap || tokenProps.gap;
-  const { rowGap, columnGap } = (0, StackUtils_1.parseGap)(childrenGap, theme);
-  if (wrap) {
-    innerStyle = {
-      rowGap: rowGap,
-      columnGap: columnGap,
-      padding: (0, StackUtils_1.parsePadding)(padding, theme),
-      width: '100%',
-    };
-    _mapAlignment(!!horizontal, horizontalAlign, verticalAlign, innerStyle);
-    if (horizontal) {
-      innerStyle.height = '100%';
-    } else {
-      innerStyle.maxHeight = '100%';
-      innerStyle.height = '100%';
+    const { horizontal, wrap, horizontalAlign, verticalAlign, padding } = tokenProps;
+    let innerStyle = undefined;
+    const childrenGap = tokenProps.childrenGap || tokenProps.gap;
+    const { rowGap, columnGap } = (0, StackUtils_1.parseGap)(childrenGap, theme);
+    if (wrap) {
+        innerStyle = {
+            rowGap: rowGap,
+            columnGap: columnGap,
+            padding: (0, StackUtils_1.parsePadding)(padding, theme),
+            width: '100%',
+        };
+        _mapAlignment(!!horizontal, horizontalAlign, verticalAlign, innerStyle);
+        if (horizontal) {
+            innerStyle.height = '100%';
+        }
+        else {
+            innerStyle.maxHeight = '100%';
+            innerStyle.height = '100%';
+        }
     }
-  }
-  return { style: innerStyle };
+    return { style: innerStyle };
 }
 exports.buildStackInnerStyles = (0, foundation_tokens_1.styleFunction)(_buildInnerStyles, _innerKeyProps);
 function _buildRootStyles(tokenProps, theme) {
-  const { grow, horizontal, horizontalAlign, verticalAlign, maxHeight, maxWidth, padding, wrap } = tokenProps;
-  // const childrenGap = tokenProps.childrenGap || tokenProps.gap;
-  // const { rowGap, columnGap } = parseGap(childrenGap, theme);
-  const rootStyle = {
-    maxHeight,
-    maxWidth,
-  };
-  _mapAlignment(!!horizontal, horizontalAlign, verticalAlign, rootStyle);
-  if (grow && !wrap) {
-    rootStyle.flexGrow = typeof grow === 'boolean' ? (grow ? 1 : 0) : grow;
-    rootStyle.overflow = 'hidden';
-  }
-  if (!wrap) {
-    rootStyle.padding = (0, StackUtils_1.parsePadding)(padding, theme);
-  }
-  return { style: rootStyle };
-  // verticalFill,
-  // reversed,
-  // disableShrink,
+    const { grow, horizontal, horizontalAlign, verticalAlign, maxHeight, maxWidth, padding, wrap } = tokenProps;
+    // const childrenGap = tokenProps.childrenGap || tokenProps.gap;
+    // const { rowGap, columnGap } = parseGap(childrenGap, theme);
+    const rootStyle = {
+        maxHeight,
+        maxWidth,
+    };
+    _mapAlignment(!!horizontal, horizontalAlign, verticalAlign, rootStyle);
+    if (grow && !wrap) {
+        rootStyle.flexGrow = typeof grow === 'boolean' ? (grow ? 1 : 0) : grow;
+        rootStyle.overflow = 'hidden';
+    }
+    if (!wrap) {
+        rootStyle.padding = (0, StackUtils_1.parsePadding)(padding, theme);
+    }
+    return { style: rootStyle };
+    // verticalFill,
+    // reversed,
+    // disableShrink,
 }
 const _keyProps = [
-  // 'verticalFill',
-  'horizontal',
-  // 'reversed',
-  // 'gap',
-  'grow',
-  'wrap',
-  'horizontalAlign',
-  'verticalAlign',
-  // 'disableShrink',
-  // 'childrenGap',
-  'maxHeight',
-  'maxWidth',
-  'padding',
+    // 'verticalFill',
+    'horizontal',
+    // 'reversed',
+    // 'gap',
+    'grow',
+    'wrap',
+    'horizontalAlign',
+    'verticalAlign',
+    // 'disableShrink',
+    // 'childrenGap',
+    'maxHeight',
+    'maxWidth',
+    'padding',
 ];
 exports.buildStackRootStyles = (0, foundation_tokens_1.styleFunction)(_buildRootStyles, _keyProps);
-//# sourceMappingURL=Stack.tokens.js.map
+//# sourceMappingURL=Stack.tokens.js.map