@lmb-it/kitsconcerto-native 0.1.236

package/layout/Grid/native/GridContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GridContext.js","sources":["../../../../../src/layout/Grid/native/GridContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\nimport { Dimensions } from 'react-native';\n\n// --- Responsive ColSpan ---\n\nexport type ResponsiveColSpan = {\n  default?: number;\n  base?: number;\n  sm?: number;\n  md?: number;\n  lg?: number;\n  xl?: number;\n};\n\n// --- Context Value ---\n\nexport interface GridContextValue {\n  registerItem: (id: string, colSpan: number) => void;\n  unregisterItem: (id: string) => void;\n  getItemWidth: (id: string) => number | undefined;\n  containerWidth: number;\n  numColumns: number;\n  columnGap: number;\n  rowGap: number;\n}\n\n// --- Context ---\n\nconst GridContext = createContext<GridContextValue>({\n  registerItem: () => {},\n  unregisterItem: () => {},\n  getItemWidth: () => undefined,\n  containerWidth: 0,\n  numColumns: 12,\n  columnGap: 0,\n  rowGap: 0,\n});\n\nexport const useGridContext = () => useContext(GridContext);\nexport default GridContext;\n\n// --- Breakpoints ---\n\nconst BREAKPOINTS = {\n  xl: 1280,\n  lg: 992,\n  md: 768,\n  sm: 480,\n  base: 0,\n} as const;\n\n/**\n * Resolve a responsive colSpan value to a concrete number\n * based on the current screen width.\n */\nexport function resolveColSpan(\n  value: number | ResponsiveColSpan | undefined,\n  screenWidth?: number,\n): number {\n  if (value == null) return 12;\n  if (typeof value === 'number') return value;\n\n  const width = screenWidth ?? Dimensions.get('window').width;\n\n  for (const [key, minWidth] of Object.entries(BREAKPOINTS)) {\n    if (width >= minWidth && value[key as keyof ResponsiveColSpan] != null) {\n      return value[key as keyof ResponsiveColSpan]!;\n    }\n  }\n\n  return value.default ?? 12;\n}\n\n// --- Row Arrangement Algorithm ---\n\n/**\n * Greedy row arrangement: pack items left-to-right, wrap when full.\n * Returns map of rowNumber -> array of item indices.\n */\nexport function arrangeIntoRows(\n  colSpans: number[],\n  numColumns: number,\n): Record<number, number[]> {\n  let currentRow = 1;\n  let currentRowTotal = 0;\n  const rows: Record<number, number[]> = {};\n\n  for (let i = 0; i < colSpans.length; i++) {\n    const colSpan = colSpans[i];\n    if (currentRowTotal + colSpan > numColumns) {\n      currentRow++;\n      currentRowTotal = colSpan;\n    } else {\n      currentRowTotal += colSpan;\n    }\n    if (!rows[currentRow]) {\n      rows[currentRow] = [];\n    }\n    rows[currentRow].push(i);\n  }\n\n  return rows;\n}"],"names":[],"mappings":";;;AA4BA,MAAM,cAAc,aAAA,CAAgC;AAAA,EAClD,cAAc,MAAM;AAAA,EAAC,CAAA;AAAA,EACrB,gBAAgB,MAAM;AAAA,EAAC,CAAA;AAAA,EACvB,cAAc,MAAM,MAAA;AAAA,EACpB,cAAA,EAAgB,CAAA;AAAA,EAChB,UAAA,EAAY,EAAA;AAAA,EACZ,SAAA,EAAW,CAAA;AAAA,EACX,MAAA,EAAQ;AACV,CAAC;AAEM,MAAM,cAAA,GAAiB,MAAM,UAAA,CAAW,WAAW;AAyCnD,SAAS,eAAA,CACd,UACA,UAAA,EAC0B;AAC1B,EAAA,IAAI,UAAA,GAAa,CAAA;AACjB,EAAA,IAAI,eAAA,GAAkB,CAAA;AACtB,EAAA,MAAM,OAAiC,EAAC;AAExC,EAAA,KAAA,IAAS,CAAA,GAAI,CAAA,EAAG,CAAA,GAAI,QAAA,CAAS,QAAQ,CAAA,EAAA,EAAK;AACxC,IAAA,MAAM,OAAA,GAAU,SAAS,CAAC,CAAA;AAC1B,IAAA,IAAI,eAAA,GAAkB,UAAU,UAAA,EAAY;AAC1C,MAAA,UAAA,EAAA;AACA,MAAA,eAAA,GAAkB,OAAA;AAAA,IACpB,CAAA,MAAO;AACL,MAAA,eAAA,IAAmB,OAAA;AAAA,IACrB;AACA,IAAA,IAAI,CAAC,IAAA,CAAK,UAAU,CAAA,EAAG;AACrB,MAAA,IAAA,CAAK,UAAU,IAAI,EAAC;AAAA,IACtB;AACA,IAAA,IAAA,CAAK,UAAU,CAAA,CAAE,IAAA,CAAK,CAAC,CAAA;AAAA,EACzB;AAEA,EAAA,OAAO,IAAA;AACT;;;;"}

package/layout/Grid/native/KitsGrid.cjs

@@ -0,0 +1,105 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var reactNative = require('react-native');
+var GridContext = require('./GridContext.cjs');
+
+const KitsGrid = ({
+  columns = 12,
+  columnGap = 0,
+  rowGap = 0,
+  children
+}) => {
+  const [containerWidth, setContainerWidth] = React.useState(0);
+  const registryRef = React.useRef(/* @__PURE__ */ new Map());
+  const orderCounterRef = React.useRef(0);
+  const [version, setVersion] = React.useState(0);
+  const registerItem = React.useCallback((id, colSpan) => {
+    const existing = registryRef.current.get(id);
+    if (existing) {
+      if (existing.colSpan !== colSpan) {
+        existing.colSpan = colSpan;
+        setVersion((v) => v + 1);
+      }
+    } else {
+      registryRef.current.set(id, {
+        colSpan,
+        order: orderCounterRef.current++
+      });
+      setVersion((v) => v + 1);
+    }
+  }, []);
+  const unregisterItem = React.useCallback((id) => {
+    if (registryRef.current.has(id)) {
+      registryRef.current.delete(id);
+      setVersion((v) => v + 1);
+    }
+  }, []);
+  const itemWidths = React.useMemo(() => {
+    const widths = /* @__PURE__ */ new Map();
+    if (containerWidth <= 0) return widths;
+    const items = Array.from(registryRef.current.entries()).sort(
+      (a, b) => a[1].order - b[1].order
+    );
+    if (items.length === 0) return widths;
+    const ids = items.map(([id]) => id);
+    const colSpans = items.map(
+      ([_, data]) => Math.min(data.colSpan, columns)
+    );
+    const rows = GridContext.arrangeIntoRows(colSpans, columns);
+    for (const indices of Object.values(rows)) {
+      const itemsInRow = indices.length;
+      const totalGapWidth = columnGap * (itemsInRow - 1);
+      const availableWidth = containerWidth - totalGapWidth;
+      for (const idx of indices) {
+        const width = Math.max(
+          0,
+          Math.floor(availableWidth * colSpans[idx] / columns)
+        );
+        widths.set(ids[idx], width);
+      }
+    }
+    return widths;
+  }, [containerWidth, version, columns, columnGap]);
+  const getItemWidth = React.useCallback(
+    (id) => itemWidths.get(id),
+    [itemWidths]
+  );
+  const contextValue = React.useMemo(
+    () => ({
+      registerItem,
+      unregisterItem,
+      getItemWidth,
+      containerWidth,
+      numColumns: columns,
+      columnGap,
+      rowGap
+    }),
+    [registerItem, unregisterItem, getItemWidth, containerWidth, columns, columnGap, rowGap]
+  );
+  const handleLayout = React.useCallback((event) => {
+    const width = Math.floor(event.nativeEvent.layout.width);
+    setContainerWidth((prev) => prev !== width ? width : prev);
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(GridContext.default.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx(
+    reactNative.View,
+    {
+      style: [styles.container, { columnGap, rowGap }],
+      onLayout: handleLayout,
+      children
+    }
+  ) });
+};
+const styles = reactNative.StyleSheet.create({
+  container: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    width: "100%"
+  }
+});
+
+exports.default = KitsGrid;
+//# sourceMappingURL=KitsGrid.cjs.map

package/layout/Grid/native/KitsGrid.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"KitsGrid.cjs","sources":["../../../../../src/layout/Grid/native/KitsGrid.tsx"],"sourcesContent":["import React, { useState, useRef, useCallback, useMemo, type ReactNode } from 'react';\nimport { View, StyleSheet, type LayoutChangeEvent } from 'react-native';\nimport GridContext, { arrangeIntoRows } from './GridContext';\n\nexport interface IKitsGridProps {\n  /** Total number of columns in the grid (default 12) */\n  columns?: number;\n  /** Gap between columns in pixels (default 0) */\n  columnGap?: number;\n  /** Gap between rows in pixels (default 0) */\n  rowGap?: number;\n  children: ReactNode;\n}\n\ninterface RegistryEntry {\n  colSpan: number;\n  order: number;\n}\n\n/**\n * Pure React Native grid container.\n *\n * Measures its own width via onLayout, then calculates pixel widths\n * for each registered KitsGridItem based on colSpan / numColumns.\n *\n * Children communicate via GridContext — KitsGridItem does NOT need\n * to be a direct child of KitsGrid.\n */\nconst KitsGrid = ({\n  columns = 12,\n  columnGap = 0,\n  rowGap = 0,\n  children,\n}: IKitsGridProps) => {\n  const [containerWidth, setContainerWidth] = useState(0);\n  const registryRef = useRef(new Map<string, RegistryEntry>());\n  const orderCounterRef = useRef(0);\n  const [version, setVersion] = useState(0);\n\n  const registerItem = useCallback((id: string, colSpan: number) => {\n    const existing = registryRef.current.get(id);\n    if (existing) {\n      if (existing.colSpan !== colSpan) {\n        existing.colSpan = colSpan;\n        setVersion(v => v + 1);\n      }\n    } else {\n      registryRef.current.set(id, {\n        colSpan,\n        order: orderCounterRef.current++,\n      });\n      setVersion(v => v + 1);\n    }\n  }, []);\n\n  const unregisterItem = useCallback((id: string) => {\n    if (registryRef.current.has(id)) {\n      registryRef.current.delete(id);\n      setVersion(v => v + 1);\n    }\n  }, []);\n\n  // Calculate pixel widths for every registered item\n  const itemWidths = useMemo(() => {\n    const widths = new Map<string, number>();\n    if (containerWidth <= 0) return widths;\n\n    const items = Array.from(registryRef.current.entries()).sort(\n      (a, b) => a[1].order - b[1].order,\n    );\n    if (items.length === 0) return widths;\n\n    const ids = items.map(([id]) => id);\n    const colSpans = items.map(([_, data]) =>\n      Math.min(data.colSpan, columns),\n    );\n\n    const rows = arrangeIntoRows(colSpans, columns);\n\n    for (const indices of Object.values(rows)) {\n      const itemsInRow = indices.length;\n      const totalGapWidth = columnGap * (itemsInRow - 1);\n      const availableWidth = containerWidth - totalGapWidth;\n\n      for (const idx of indices) {\n        const width = Math.max(\n          0,\n          Math.floor((availableWidth * colSpans[idx]) / columns),\n        );\n        widths.set(ids[idx], width);\n      }\n    }\n\n    return widths;\n    // `version` triggers recalc when registry changes\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [containerWidth, version, columns, columnGap]);\n\n  const getItemWidth = useCallback(\n    (id: string) => itemWidths.get(id),\n    [itemWidths],\n  );\n\n  const contextValue = useMemo(\n    () => ({\n      registerItem,\n      unregisterItem,\n      getItemWidth,\n      containerWidth,\n      numColumns: columns,\n      columnGap,\n      rowGap,\n    }),\n    [registerItem, unregisterItem, getItemWidth, containerWidth, columns, columnGap, rowGap],\n  );\n\n  const handleLayout = useCallback((event: LayoutChangeEvent) => {\n    const width = Math.floor(event.nativeEvent.layout.width);\n    setContainerWidth(prev => (prev !== width ? width : prev));\n  }, []);\n\n  return (\n    <GridContext.Provider value={contextValue}>\n      <View\n        style={[styles.container, { columnGap, rowGap }]}\n        onLayout={handleLayout}\n      >\n        {children}\n      </View>\n    </GridContext.Provider>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    flexDirection: 'row',\n    flexWrap: 'wrap',\n    width: '100%',\n  },\n});\n\nexport default KitsGrid;\n"],"names":["useState","useRef","useCallback","useMemo","arrangeIntoRows","jsx","GridContext","View","StyleSheet"],"mappings":"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"}

package/layout/Grid/native/KitsGrid.js

@@ -0,0 +1,101 @@
+import { jsx } from 'react/jsx-runtime';
+import { useState, useRef, useCallback, useMemo } from 'react';
+import { View, StyleSheet } from 'react-native';
+import GridContext, { arrangeIntoRows } from './GridContext.js';
+
+const KitsGrid = ({
+  columns = 12,
+  columnGap = 0,
+  rowGap = 0,
+  children
+}) => {
+  const [containerWidth, setContainerWidth] = useState(0);
+  const registryRef = useRef(/* @__PURE__ */ new Map());
+  const orderCounterRef = useRef(0);
+  const [version, setVersion] = useState(0);
+  const registerItem = useCallback((id, colSpan) => {
+    const existing = registryRef.current.get(id);
+    if (existing) {
+      if (existing.colSpan !== colSpan) {
+        existing.colSpan = colSpan;
+        setVersion((v) => v + 1);
+      }
+    } else {
+      registryRef.current.set(id, {
+        colSpan,
+        order: orderCounterRef.current++
+      });
+      setVersion((v) => v + 1);
+    }
+  }, []);
+  const unregisterItem = useCallback((id) => {
+    if (registryRef.current.has(id)) {
+      registryRef.current.delete(id);
+      setVersion((v) => v + 1);
+    }
+  }, []);
+  const itemWidths = useMemo(() => {
+    const widths = /* @__PURE__ */ new Map();
+    if (containerWidth <= 0) return widths;
+    const items = Array.from(registryRef.current.entries()).sort(
+      (a, b) => a[1].order - b[1].order
+    );
+    if (items.length === 0) return widths;
+    const ids = items.map(([id]) => id);
+    const colSpans = items.map(
+      ([_, data]) => Math.min(data.colSpan, columns)
+    );
+    const rows = arrangeIntoRows(colSpans, columns);
+    for (const indices of Object.values(rows)) {
+      const itemsInRow = indices.length;
+      const totalGapWidth = columnGap * (itemsInRow - 1);
+      const availableWidth = containerWidth - totalGapWidth;
+      for (const idx of indices) {
+        const width = Math.max(
+          0,
+          Math.floor(availableWidth * colSpans[idx] / columns)
+        );
+        widths.set(ids[idx], width);
+      }
+    }
+    return widths;
+  }, [containerWidth, version, columns, columnGap]);
+  const getItemWidth = useCallback(
+    (id) => itemWidths.get(id),
+    [itemWidths]
+  );
+  const contextValue = useMemo(
+    () => ({
+      registerItem,
+      unregisterItem,
+      getItemWidth,
+      containerWidth,
+      numColumns: columns,
+      columnGap,
+      rowGap
+    }),
+    [registerItem, unregisterItem, getItemWidth, containerWidth, columns, columnGap, rowGap]
+  );
+  const handleLayout = useCallback((event) => {
+    const width = Math.floor(event.nativeEvent.layout.width);
+    setContainerWidth((prev) => prev !== width ? width : prev);
+  }, []);
+  return /* @__PURE__ */ jsx(GridContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
+    View,
+    {
+      style: [styles.container, { columnGap, rowGap }],
+      onLayout: handleLayout,
+      children
+    }
+  ) });
+};
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    width: "100%"
+  }
+});
+
+export { KitsGrid as default };
+//# sourceMappingURL=KitsGrid.js.map

package/layout/Grid/native/KitsGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"KitsGrid.js","sources":["../../../../../src/layout/Grid/native/KitsGrid.tsx"],"sourcesContent":["import React, { useState, useRef, useCallback, useMemo, type ReactNode } from 'react';\nimport { View, StyleSheet, type LayoutChangeEvent } from 'react-native';\nimport GridContext, { arrangeIntoRows } from './GridContext';\n\nexport interface IKitsGridProps {\n  /** Total number of columns in the grid (default 12) */\n  columns?: number;\n  /** Gap between columns in pixels (default 0) */\n  columnGap?: number;\n  /** Gap between rows in pixels (default 0) */\n  rowGap?: number;\n  children: ReactNode;\n}\n\ninterface RegistryEntry {\n  colSpan: number;\n  order: number;\n}\n\n/**\n * Pure React Native grid container.\n *\n * Measures its own width via onLayout, then calculates pixel widths\n * for each registered KitsGridItem based on colSpan / numColumns.\n *\n * Children communicate via GridContext — KitsGridItem does NOT need\n * to be a direct child of KitsGrid.\n */\nconst KitsGrid = ({\n  columns = 12,\n  columnGap = 0,\n  rowGap = 0,\n  children,\n}: IKitsGridProps) => {\n  const [containerWidth, setContainerWidth] = useState(0);\n  const registryRef = useRef(new Map<string, RegistryEntry>());\n  const orderCounterRef = useRef(0);\n  const [version, setVersion] = useState(0);\n\n  const registerItem = useCallback((id: string, colSpan: number) => {\n    const existing = registryRef.current.get(id);\n    if (existing) {\n      if (existing.colSpan !== colSpan) {\n        existing.colSpan = colSpan;\n        setVersion(v => v + 1);\n      }\n    } else {\n      registryRef.current.set(id, {\n        colSpan,\n        order: orderCounterRef.current++,\n      });\n      setVersion(v => v + 1);\n    }\n  }, []);\n\n  const unregisterItem = useCallback((id: string) => {\n    if (registryRef.current.has(id)) {\n      registryRef.current.delete(id);\n      setVersion(v => v + 1);\n    }\n  }, []);\n\n  // Calculate pixel widths for every registered item\n  const itemWidths = useMemo(() => {\n    const widths = new Map<string, number>();\n    if (containerWidth <= 0) return widths;\n\n    const items = Array.from(registryRef.current.entries()).sort(\n      (a, b) => a[1].order - b[1].order,\n    );\n    if (items.length === 0) return widths;\n\n    const ids = items.map(([id]) => id);\n    const colSpans = items.map(([_, data]) =>\n      Math.min(data.colSpan, columns),\n    );\n\n    const rows = arrangeIntoRows(colSpans, columns);\n\n    for (const indices of Object.values(rows)) {\n      const itemsInRow = indices.length;\n      const totalGapWidth = columnGap * (itemsInRow - 1);\n      const availableWidth = containerWidth - totalGapWidth;\n\n      for (const idx of indices) {\n        const width = Math.max(\n          0,\n          Math.floor((availableWidth * colSpans[idx]) / columns),\n        );\n        widths.set(ids[idx], width);\n      }\n    }\n\n    return widths;\n    // `version` triggers recalc when registry changes\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [containerWidth, version, columns, columnGap]);\n\n  const getItemWidth = useCallback(\n    (id: string) => itemWidths.get(id),\n    [itemWidths],\n  );\n\n  const contextValue = useMemo(\n    () => ({\n      registerItem,\n      unregisterItem,\n      getItemWidth,\n      containerWidth,\n      numColumns: columns,\n      columnGap,\n      rowGap,\n    }),\n    [registerItem, unregisterItem, getItemWidth, containerWidth, columns, columnGap, rowGap],\n  );\n\n  const handleLayout = useCallback((event: LayoutChangeEvent) => {\n    const width = Math.floor(event.nativeEvent.layout.width);\n    setContainerWidth(prev => (prev !== width ? width : prev));\n  }, []);\n\n  return (\n    <GridContext.Provider value={contextValue}>\n      <View\n        style={[styles.container, { columnGap, rowGap }]}\n        onLayout={handleLayout}\n      >\n        {children}\n      </View>\n    </GridContext.Provider>\n  );\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    flexDirection: 'row',\n    flexWrap: 'wrap',\n    width: '100%',\n  },\n});\n\nexport default KitsGrid;\n"],"names":[],"mappings":"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"}

package/layout/GridItem/native/KitsGridItem.cjs

@@ -0,0 +1,39 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var reactNative = require('react-native');
+var GridContext = require('../../Grid/native/GridContext.cjs');
+
+const KitsGridItem = ({ id: externalId, colSpan, children }) => {
+  const autoId = React.useId();
+  const id = externalId ?? autoId;
+  const { registerItem, unregisterItem, getItemWidth, containerWidth } = GridContext.useGridContext();
+  React.useEffect(() => {
+    registerItem(id, colSpan);
+  }, [id, colSpan, registerItem]);
+  React.useEffect(() => {
+    return () => {
+      unregisterItem(id);
+    };
+  }, [id]);
+  const width = getItemWidth(id);
+  const measured = containerWidth > 0 && width != null;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactNative.View,
+    {
+      style: measured ? { width, flexShrink: 0, flexGrow: 0 } : styles.fallback,
+      children
+    }
+  );
+};
+const styles = reactNative.StyleSheet.create({
+  fallback: {
+    width: "100%"
+  }
+});
+
+exports.default = KitsGridItem;
+//# sourceMappingURL=KitsGridItem.cjs.map

package/layout/GridItem/native/KitsGridItem.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"KitsGridItem.cjs","sources":["../../../../../src/layout/GridItem/native/KitsGridItem.tsx"],"sourcesContent":["import React, { useEffect, useId, type ReactNode } from 'react';\nimport { View, StyleSheet } from 'react-native';\nimport { useGridContext } from '../../Grid/native/GridContext';\n\nexport interface IKitsGridItemProps {\n  /** Unique identifier — used for context registration. Auto-generated if omitted. */\n  id?: string;\n  /** Number of grid columns this item spans */\n  colSpan: number;\n  children?: ReactNode;\n}\n\n/**\n * Pure React Native grid item.\n *\n * Registers its colSpan with the parent KitsGrid via context.\n * Reads its calculated pixel width from context and applies it.\n *\n * Does NOT need to be a direct child of KitsGrid — context\n * handles communication regardless of hierarchy depth.\n */\nconst KitsGridItem = ({ id: externalId, colSpan, children }: IKitsGridItemProps) => {\n  const autoId = useId();\n  const id = externalId ?? autoId;\n  const { registerItem, unregisterItem, getItemWidth, containerWidth } =\n    useGridContext();\n\n  // Register on mount and when colSpan changes\n  useEffect(() => {\n    registerItem(id, colSpan);\n  }, [id, colSpan, registerItem]);\n\n  // Unregister on unmount\n  useEffect(() => {\n    return () => {\n      unregisterItem(id);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [id]);\n\n  const width = getItemWidth(id);\n  const measured = containerWidth > 0 && width != null;\n\n  return (\n    <View\n      style={\n        measured\n          ? { width, flexShrink: 0, flexGrow: 0 }\n          : styles.fallback\n      }\n    >\n      {children}\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  fallback: {\n    width: '100%',\n  },\n});\n\nexport default KitsGridItem;\n"],"names":["useId","useGridContext","useEffect","jsx","View","StyleSheet"],"mappings":";;;;;;;;;AAqBA,MAAM,eAAe,CAAC,EAAE,IAAI,UAAA,EAAY,OAAA,EAAS,UAAS,KAA0B;AAClF,EAAA,MAAM,SAASA,WAAA,EAAM;AACrB,EAAA,MAAM,KAAK,UAAA,IAAc,MAAA;AACzB,EAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAgB,YAAA,EAAc,cAAA,KAClDC,0BAAA,EAAe;AAGjB,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,YAAA,CAAa,IAAI,OAAO,CAAA;AAAA,EAC1B,CAAA,EAAG,CAAC,EAAA,EAAI,OAAA,EAAS,YAAY,CAAC,CAAA;AAG9B,EAAAA,eAAA,CAAU,MAAM;AACd,IAAA,OAAO,MAAM;AACX,MAAA,cAAA,CAAe,EAAE,CAAA;AAAA,IACnB,CAAA;AAAA,EAEF,CAAA,EAAG,CAAC,EAAE,CAAC,CAAA;AAEP,EAAA,MAAM,KAAA,GAAQ,aAAa,EAAE,CAAA;AAC7B,EAAA,MAAM,QAAA,GAAW,cAAA,GAAiB,CAAA,IAAK,KAAA,IAAS,IAAA;AAEhD,EAAA,uBACEC,cAAA;AAAA,IAACC,gBAAA;AAAA,IAAA;AAAA,MACC,KAAA,EACE,WACI,EAAE,KAAA,EAAO,YAAY,CAAA,EAAG,QAAA,EAAU,CAAA,EAAE,GACpC,MAAA,CAAO,QAAA;AAAA,MAGZ;AAAA;AAAA,GACH;AAEJ;AAEA,MAAM,MAAA,GAASC,uBAAW,MAAA,CAAO;AAAA,EAC/B,QAAA,EAAU;AAAA,IACR,KAAA,EAAO;AAAA;AAEX,CAAC,CAAA;;;;"}

package/layout/GridItem/native/KitsGridItem.js

@@ -0,0 +1,35 @@
+import { jsx } from 'react/jsx-runtime';
+import { useId, useEffect } from 'react';
+import { View, StyleSheet } from 'react-native';
+import { useGridContext } from '../../Grid/native/GridContext.js';
+
+const KitsGridItem = ({ id: externalId, colSpan, children }) => {
+  const autoId = useId();
+  const id = externalId ?? autoId;
+  const { registerItem, unregisterItem, getItemWidth, containerWidth } = useGridContext();
+  useEffect(() => {
+    registerItem(id, colSpan);
+  }, [id, colSpan, registerItem]);
+  useEffect(() => {
+    return () => {
+      unregisterItem(id);
+    };
+  }, [id]);
+  const width = getItemWidth(id);
+  const measured = containerWidth > 0 && width != null;
+  return /* @__PURE__ */ jsx(
+    View,
+    {
+      style: measured ? { width, flexShrink: 0, flexGrow: 0 } : styles.fallback,
+      children
+    }
+  );
+};
+const styles = StyleSheet.create({
+  fallback: {
+    width: "100%"
+  }
+});
+
+export { KitsGridItem as default };
+//# sourceMappingURL=KitsGridItem.js.map

package/layout/GridItem/native/KitsGridItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"KitsGridItem.js","sources":["../../../../../src/layout/GridItem/native/KitsGridItem.tsx"],"sourcesContent":["import React, { useEffect, useId, type ReactNode } from 'react';\nimport { View, StyleSheet } from 'react-native';\nimport { useGridContext } from '../../Grid/native/GridContext';\n\nexport interface IKitsGridItemProps {\n  /** Unique identifier — used for context registration. Auto-generated if omitted. */\n  id?: string;\n  /** Number of grid columns this item spans */\n  colSpan: number;\n  children?: ReactNode;\n}\n\n/**\n * Pure React Native grid item.\n *\n * Registers its colSpan with the parent KitsGrid via context.\n * Reads its calculated pixel width from context and applies it.\n *\n * Does NOT need to be a direct child of KitsGrid — context\n * handles communication regardless of hierarchy depth.\n */\nconst KitsGridItem = ({ id: externalId, colSpan, children }: IKitsGridItemProps) => {\n  const autoId = useId();\n  const id = externalId ?? autoId;\n  const { registerItem, unregisterItem, getItemWidth, containerWidth } =\n    useGridContext();\n\n  // Register on mount and when colSpan changes\n  useEffect(() => {\n    registerItem(id, colSpan);\n  }, [id, colSpan, registerItem]);\n\n  // Unregister on unmount\n  useEffect(() => {\n    return () => {\n      unregisterItem(id);\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [id]);\n\n  const width = getItemWidth(id);\n  const measured = containerWidth > 0 && width != null;\n\n  return (\n    <View\n      style={\n        measured\n          ? { width, flexShrink: 0, flexGrow: 0 }\n          : styles.fallback\n      }\n    >\n      {children}\n    </View>\n  );\n};\n\nconst styles = StyleSheet.create({\n  fallback: {\n    width: '100%',\n  },\n});\n\nexport default KitsGridItem;\n"],"names":[],"mappings":";;;;;AAqBA,MAAM,eAAe,CAAC,EAAE,IAAI,UAAA,EAAY,OAAA,EAAS,UAAS,KAA0B;AAClF,EAAA,MAAM,SAAS,KAAA,EAAM;AACrB,EAAA,MAAM,KAAK,UAAA,IAAc,MAAA;AACzB,EAAA,MAAM,EAAE,YAAA,EAAc,cAAA,EAAgB,YAAA,EAAc,cAAA,KAClD,cAAA,EAAe;AAGjB,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,YAAA,CAAa,IAAI,OAAO,CAAA;AAAA,EAC1B,CAAA,EAAG,CAAC,EAAA,EAAI,OAAA,EAAS,YAAY,CAAC,CAAA;AAG9B,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,OAAO,MAAM;AACX,MAAA,cAAA,CAAe,EAAE,CAAA;AAAA,IACnB,CAAA;AAAA,EAEF,CAAA,EAAG,CAAC,EAAE,CAAC,CAAA;AAEP,EAAA,MAAM,KAAA,GAAQ,aAAa,EAAE,CAAA;AAC7B,EAAA,MAAM,QAAA,GAAW,cAAA,GAAiB,CAAA,IAAK,KAAA,IAAS,IAAA;AAEhD,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,KAAA,EACE,WACI,EAAE,KAAA,EAAO,YAAY,CAAA,EAAG,QAAA,EAAU,CAAA,EAAE,GACpC,MAAA,CAAO,QAAA;AAAA,MAGZ;AAAA;AAAA,GACH;AAEJ;AAEA,MAAM,MAAA,GAAS,WAAW,MAAA,CAAO;AAAA,EAC/B,QAAA,EAAU;AAAA,IACR,KAAA,EAAO;AAAA;AAEX,CAAC,CAAA;;;;"}

package/layout/HStack/index.cjs

@@ -0,0 +1,128 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+require('../../apps/mobile/src/ui/accordion/index.cjs');
+require('../../apps/mobile/src/ui/actionsheet/index.cjs');
+require('../../apps/mobile/src/ui/alert/index.cjs');
+require('../../apps/mobile/src/ui/alert-dialog/index.cjs');
+require('../../apps/mobile/src/ui/avatar/index.cjs');
+require('../../apps/mobile/src/ui/badge/index.cjs');
+require('../../apps/mobile/src/ui/bottomsheet/index.cjs');
+require('../../apps/mobile/src/ui/box/index.cjs');
+require('../../apps/mobile/src/ui/button/index.cjs');
+require('../../apps/mobile/src/ui/card/index.cjs');
+require('../../apps/mobile/src/ui/center/index.cjs');
+require('../../apps/mobile/src/ui/checkbox/index.cjs');
+require('../../apps/mobile/src/ui/divider/index.cjs');
+require('../../apps/mobile/src/ui/drawer/index.cjs');
+require('../../apps/mobile/src/ui/fab/index.cjs');
+require('react-native');
+require('../../apps/mobile/src/ui/form-control/index.cjs');
+require('react');
+require('../../apps/mobile/src/ui/gluestack-ui-provider/config.cjs');
+require('@gluestack-ui/core/overlay/creator');
+require('@gluestack-ui/core/toast/creator');
+require('nativewind');
+require('../../apps/mobile/src/ui/grid/index.cjs');
+require('../../apps/mobile/src/ui/heading/index.cjs');
+require('../../apps/mobile/src/ui/hstack/index.cjs');
+require('../../apps/mobile/src/ui/icon/index.cjs');
+require('../../apps/mobile/src/ui/image/index.cjs');
+require('../../apps/mobile/src/ui/image-background/index.cjs');
+require('../../apps/mobile/src/ui/input/index.cjs');
+require('../../apps/mobile/src/ui/link/index.cjs');
+require('../../apps/mobile/src/ui/menu/index.cjs');
+require('../../apps/mobile/src/ui/modal/index.cjs');
+require('../../apps/mobile/src/ui/popover/index.cjs');
+require('../../apps/mobile/src/ui/portal/index.cjs');
+require('../../apps/mobile/src/ui/pressable/index.cjs');
+require('../../apps/mobile/src/ui/progress/index.cjs');
+require('../../apps/mobile/src/ui/radio/index.cjs');
+require('react-native-safe-area-context');
+require('../../apps/mobile/src/ui/select/index.cjs');
+require('../../apps/mobile/src/ui/skeleton/index.cjs');
+require('../../apps/mobile/src/ui/slider/index.cjs');
+require('../../apps/mobile/src/ui/spinner/index.cjs');
+require('../../apps/mobile/src/ui/switch/index.cjs');
+require('../../apps/mobile/src/ui/table/index.cjs');
+require('../../apps/mobile/src/ui/text/index.cjs');
+require('../../apps/mobile/src/ui/textarea/index.cjs');
+require('../../apps/mobile/src/ui/toast/index.cjs');
+require('../../apps/mobile/src/ui/tooltip/index.cjs');
+require('../../apps/mobile/src/ui/vstack/index.cjs');
+var ResponsiveElement = require('../../apps/mobile/src/Factory/ResponsiveElement.cjs');
+require('react-icons/fa');
+require('react-icons/ai');
+require('react-icons/io');
+require('../../packages/types/src/Components/Molecules/Form/FilePicker/types/filesTypes.cjs');
+require('yup');
+require('../../packages/types/src/Css/map/index.cjs');
+require('../../packages/types/src/Theme/shadows.cjs');
+require('../../packages/types/src/Theme/defaultTheme.cjs');
+var useSeparator = require('../../apps/mobile/src/Factory/useSeparator.cjs');
+require('../../apps/mobile/src/Factory/DimensionsContext.cjs');
+require('i18next');
+require('react-i18next');
+require('../../apps/mobile/src/Core/AutoComplete/index.cjs');
+require('../../apps/mobile/src/Core/Dropdown/index.cjs');
+require('../../apps/mobile/src/Core/MultiSelect/index.cjs');
+require('../../apps/mobile/src/Core/Trees/components/CoreTree.cjs');
+require('../../apps/mobile/src/Core/Trees/components/CoreTreeSelect.cjs');
+require('../../apps/mobile/src/Core/Trees/components/CoreToolbar.cjs');
+require('../../apps/mobile/src/Core/Paginator/index.cjs');
+require('lucide-react-native');
+require('../../apps/mobile/src/Core/SelectButton/index.cjs');
+require('../../apps/mobile/src/Core/DataTable/DataTable.cjs');
+require('../../apps/mobile/src/Core/Tag/index.cjs');
+require('../../apps/mobile/src/Core/Badge/index.cjs');
+require('../../apps/mobile/src/Core/ProgressBar/index.cjs');
+require('../../apps/mobile/src/Core/Checkbox/index.cjs');
+require('../../apps/mobile/src/Core/RadioButton/index.cjs');
+require('../../apps/mobile/src/Core/Input/index.cjs');
+require('../../apps/mobile/src/Core/Input/Field.cjs');
+require('../../apps/mobile/src/Core/Input/Slot.cjs');
+
+const SPACE_TO_GAP = {
+  xs: 4,
+  sm: 8,
+  md: 12,
+  lg: 16,
+  xl: 20,
+  "2xl": 24,
+  "3xl": 28,
+  "4xl": 32
+};
+const HStack = (props) => {
+  const { cssProps, nativeProps } = useSeparator.default(props);
+  const {
+    space = "md",
+    reversed = false,
+    scrollable,
+    children,
+    entering,
+    exiting,
+    ...rest
+  } = nativeProps;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ResponsiveElement.default,
+    {
+      ref: props.ref,
+      as: "Box",
+      scrollable,
+      entering,
+      exiting,
+      cssProps: {
+        flexDirection: reversed ? "row-reverse" : "row",
+        gap: SPACE_TO_GAP[space],
+        ...cssProps
+      },
+      nativeProps: rest,
+      children
+    }
+  );
+};
+
+exports.default = HStack;
+//# sourceMappingURL=index.cjs.map

package/layout/HStack/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../src/layout/HStack/index.native.tsx"],"sourcesContent":["import React, {type PropsWithChildren} from \"react\";\nimport {ResponsiveElement, useSeparator} from \"../../factory\";\nimport type {IStackProps, IStyleClasses} from \"@lmb-it/kitsconcerto-types\";\n\ntype IsolatedStack = Omit<IStackProps, keyof IStyleClasses>;\n\n/**\n * Maps the `space` prop to a gap value in dp. Mirrors the Tailwind\n * `gap-1 … gap-8` scale used by the old Gluestack-based hstack styles\n * so visual spacing stays identical for every existing caller.\n */\nconst SPACE_TO_GAP: Record<NonNullable<IStackProps[\"space\"]>, number> = {\n    xs: 4,\n    sm: 8,\n    md: 12,\n    lg: 16,\n    xl: 20,\n    \"2xl\": 24,\n    \"3xl\": 28,\n    \"4xl\": 32,\n};\n\n/**\n * HStack (native)\n *\n * Lays children out in a horizontal row with a gap derived from `space`.\n *\n * Implementation note: we render through `ResponsiveElement as=\"Box\"`\n * (a plain React Native View) and force `flexDirection` + `gap` via\n * `cssProps`. The previous implementation delegated to a Gluestack\n * component that applied layout through Nativewind `className` strings\n * (\"flex-row gap-1\") — when Nativewind's class interpreter isn't active\n * across the yalc package boundary, those classes were ignored and the\n * underlying View fell back to its RN default `flexDirection: 'column'`\n * (children stacked vertically). Forcing the layout here via native\n * style props removes that runtime-config dependency entirely.\n *\n * If a caller genuinely wants a different direction, their own\n * `flexDirection=` / `gap=` props (harvested by `useSeparator` into\n * `cssProps`) spread AFTER the defaults and win.\n */\nconst HStack: React.FC<PropsWithChildren<IStackProps>> = (props) => {\n    const {cssProps, nativeProps} = useSeparator<IStackProps>(props);\n    const {\n        space = \"md\",\n        reversed = false,\n        scrollable,\n        children,\n        entering,\n        exiting,\n        ...rest\n    } = nativeProps;\n\n    return (\n        <ResponsiveElement<IsolatedStack>\n            ref={props.ref}\n            as=\"Box\"\n            scrollable={scrollable}\n            entering={entering}\n            exiting={exiting}\n            cssProps={{\n                flexDirection: reversed ? \"row-reverse\" : \"row\",\n                gap: SPACE_TO_GAP[space],\n                ...cssProps,\n            }}\n            //@ts-ignore\n            nativeProps={rest}\n        >\n            {children}\n        </ResponsiveElement>\n    );\n};\n\nexport default HStack;\n"],"names":["useSeparator","jsx","ResponsiveElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAkE;AAAA,EACpE,EAAA,EAAI,CAAA;AAAA,EACJ,EAAA,EAAI,CAAA;AAAA,EACJ,EAAA,EAAI,EAAA;AAAA,EACJ,EAAA,EAAI,EAAA;AAAA,EACJ,EAAA,EAAI,EAAA;AAAA,EACJ,KAAA,EAAO,EAAA;AAAA,EACP,KAAA,EAAO,EAAA;AAAA,EACP,KAAA,EAAO;AACX,CAAA;AAqBA,MAAM,MAAA,GAAmD,CAAC,KAAA,KAAU;AAChE,EAAA,MAAM,EAAC,QAAA,EAAU,WAAA,EAAW,GAAIA,qBAA0B,KAAK,CAAA;AAC/D,EAAA,MAAM;AAAA,IACF,KAAA,GAAQ,IAAA;AAAA,IACR,QAAA,GAAW,KAAA;AAAA,IACX,UAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,GAAG;AAAA,GACP,GAAI,WAAA;AAEJ,EAAA,uBACIC,cAAA;AAAA,IAACC,yBAAA;AAAA,IAAA;AAAA,MACG,KAAK,KAAA,CAAM,GAAA;AAAA,MACX,EAAA,EAAG,KAAA;AAAA,MACH,UAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA,EAAU;AAAA,QACN,aAAA,EAAe,WAAW,aAAA,GAAgB,KAAA;AAAA,QAC1C,GAAA,EAAK,aAAa,KAAK,CAAA;AAAA,QACvB,GAAG;AAAA,OACP;AAAA,MAEA,WAAA,EAAa,IAAA;AAAA,MAEZ;AAAA;AAAA,GACL;AAER;;;;"}

package/layout/HStack/index.js

@@ -0,0 +1,124 @@
+import { jsx } from 'react/jsx-runtime';
+import '../../apps/mobile/src/ui/accordion/index.js';
+import '../../apps/mobile/src/ui/actionsheet/index.js';
+import '../../apps/mobile/src/ui/alert/index.js';
+import '../../apps/mobile/src/ui/alert-dialog/index.js';
+import '../../apps/mobile/src/ui/avatar/index.js';
+import '../../apps/mobile/src/ui/badge/index.js';
+import '../../apps/mobile/src/ui/bottomsheet/index.js';
+import '../../apps/mobile/src/ui/box/index.js';
+import '../../apps/mobile/src/ui/button/index.js';
+import '../../apps/mobile/src/ui/card/index.js';
+import '../../apps/mobile/src/ui/center/index.js';
+import '../../apps/mobile/src/ui/checkbox/index.js';
+import '../../apps/mobile/src/ui/divider/index.js';
+import '../../apps/mobile/src/ui/drawer/index.js';
+import '../../apps/mobile/src/ui/fab/index.js';
+import 'react-native';
+import '../../apps/mobile/src/ui/form-control/index.js';
+import 'react';
+import '../../apps/mobile/src/ui/gluestack-ui-provider/config.js';
+import '@gluestack-ui/core/overlay/creator';
+import '@gluestack-ui/core/toast/creator';
+import 'nativewind';
+import '../../apps/mobile/src/ui/grid/index.js';
+import '../../apps/mobile/src/ui/heading/index.js';
+import '../../apps/mobile/src/ui/hstack/index.js';
+import '../../apps/mobile/src/ui/icon/index.js';
+import '../../apps/mobile/src/ui/image/index.js';
+import '../../apps/mobile/src/ui/image-background/index.js';
+import '../../apps/mobile/src/ui/input/index.js';
+import '../../apps/mobile/src/ui/link/index.js';
+import '../../apps/mobile/src/ui/menu/index.js';
+import '../../apps/mobile/src/ui/modal/index.js';
+import '../../apps/mobile/src/ui/popover/index.js';
+import '../../apps/mobile/src/ui/portal/index.js';
+import '../../apps/mobile/src/ui/pressable/index.js';
+import '../../apps/mobile/src/ui/progress/index.js';
+import '../../apps/mobile/src/ui/radio/index.js';
+import 'react-native-safe-area-context';
+import '../../apps/mobile/src/ui/select/index.js';
+import '../../apps/mobile/src/ui/skeleton/index.js';
+import '../../apps/mobile/src/ui/slider/index.js';
+import '../../apps/mobile/src/ui/spinner/index.js';
+import '../../apps/mobile/src/ui/switch/index.js';
+import '../../apps/mobile/src/ui/table/index.js';
+import '../../apps/mobile/src/ui/text/index.js';
+import '../../apps/mobile/src/ui/textarea/index.js';
+import '../../apps/mobile/src/ui/toast/index.js';
+import '../../apps/mobile/src/ui/tooltip/index.js';
+import '../../apps/mobile/src/ui/vstack/index.js';
+import ResponsiveElement from '../../apps/mobile/src/Factory/ResponsiveElement.js';
+import 'react-icons/fa';
+import 'react-icons/ai';
+import 'react-icons/io';
+import '../../packages/types/src/Components/Molecules/Form/FilePicker/types/filesTypes.js';
+import 'yup';
+import '../../packages/types/src/Css/map/index.js';
+import '../../packages/types/src/Theme/shadows.js';
+import '../../packages/types/src/Theme/defaultTheme.js';
+import useSeparator from '../../apps/mobile/src/Factory/useSeparator.js';
+import '../../apps/mobile/src/Factory/DimensionsContext.js';
+import 'i18next';
+import 'react-i18next';
+import '../../apps/mobile/src/Core/AutoComplete/index.js';
+import '../../apps/mobile/src/Core/Dropdown/index.js';
+import '../../apps/mobile/src/Core/MultiSelect/index.js';
+import '../../apps/mobile/src/Core/Trees/components/CoreTree.js';
+import '../../apps/mobile/src/Core/Trees/components/CoreTreeSelect.js';
+import '../../apps/mobile/src/Core/Trees/components/CoreToolbar.js';
+import '../../apps/mobile/src/Core/Paginator/index.js';
+import 'lucide-react-native';
+import '../../apps/mobile/src/Core/SelectButton/index.js';
+import '../../apps/mobile/src/Core/DataTable/DataTable.js';
+import '../../apps/mobile/src/Core/Tag/index.js';
+import '../../apps/mobile/src/Core/Badge/index.js';
+import '../../apps/mobile/src/Core/ProgressBar/index.js';
+import '../../apps/mobile/src/Core/Checkbox/index.js';
+import '../../apps/mobile/src/Core/RadioButton/index.js';
+import '../../apps/mobile/src/Core/Input/index.js';
+import '../../apps/mobile/src/Core/Input/Field.js';
+import '../../apps/mobile/src/Core/Input/Slot.js';
+
+const SPACE_TO_GAP = {
+  xs: 4,
+  sm: 8,
+  md: 12,
+  lg: 16,
+  xl: 20,
+  "2xl": 24,
+  "3xl": 28,
+  "4xl": 32
+};
+const HStack = (props) => {
+  const { cssProps, nativeProps } = useSeparator(props);
+  const {
+    space = "md",
+    reversed = false,
+    scrollable,
+    children,
+    entering,
+    exiting,
+    ...rest
+  } = nativeProps;
+  return /* @__PURE__ */ jsx(
+    ResponsiveElement,
+    {
+      ref: props.ref,
+      as: "Box",
+      scrollable,
+      entering,
+      exiting,
+      cssProps: {
+        flexDirection: reversed ? "row-reverse" : "row",
+        gap: SPACE_TO_GAP[space],
+        ...cssProps
+      },
+      nativeProps: rest,
+      children
+    }
+  );
+};
+
+export { HStack as default };
+//# sourceMappingURL=index.js.map

package/layout/HStack/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/layout/HStack/index.native.tsx"],"sourcesContent":["import React, {type PropsWithChildren} from \"react\";\nimport {ResponsiveElement, useSeparator} from \"../../factory\";\nimport type {IStackProps, IStyleClasses} from \"@lmb-it/kitsconcerto-types\";\n\ntype IsolatedStack = Omit<IStackProps, keyof IStyleClasses>;\n\n/**\n * Maps the `space` prop to a gap value in dp. Mirrors the Tailwind\n * `gap-1 … gap-8` scale used by the old Gluestack-based hstack styles\n * so visual spacing stays identical for every existing caller.\n */\nconst SPACE_TO_GAP: Record<NonNullable<IStackProps[\"space\"]>, number> = {\n    xs: 4,\n    sm: 8,\n    md: 12,\n    lg: 16,\n    xl: 20,\n    \"2xl\": 24,\n    \"3xl\": 28,\n    \"4xl\": 32,\n};\n\n/**\n * HStack (native)\n *\n * Lays children out in a horizontal row with a gap derived from `space`.\n *\n * Implementation note: we render through `ResponsiveElement as=\"Box\"`\n * (a plain React Native View) and force `flexDirection` + `gap` via\n * `cssProps`. The previous implementation delegated to a Gluestack\n * component that applied layout through Nativewind `className` strings\n * (\"flex-row gap-1\") — when Nativewind's class interpreter isn't active\n * across the yalc package boundary, those classes were ignored and the\n * underlying View fell back to its RN default `flexDirection: 'column'`\n * (children stacked vertically). Forcing the layout here via native\n * style props removes that runtime-config dependency entirely.\n *\n * If a caller genuinely wants a different direction, their own\n * `flexDirection=` / `gap=` props (harvested by `useSeparator` into\n * `cssProps`) spread AFTER the defaults and win.\n */\nconst HStack: React.FC<PropsWithChildren<IStackProps>> = (props) => {\n    const {cssProps, nativeProps} = useSeparator<IStackProps>(props);\n    const {\n        space = \"md\",\n        reversed = false,\n        scrollable,\n        children,\n        entering,\n        exiting,\n        ...rest\n    } = nativeProps;\n\n    return (\n        <ResponsiveElement<IsolatedStack>\n            ref={props.ref}\n            as=\"Box\"\n            scrollable={scrollable}\n            entering={entering}\n            exiting={exiting}\n            cssProps={{\n                flexDirection: reversed ? \"row-reverse\" : \"row\",\n                gap: SPACE_TO_GAP[space],\n                ...cssProps,\n            }}\n            //@ts-ignore\n            nativeProps={rest}\n        >\n            {children}\n        </ResponsiveElement>\n    );\n};\n\nexport default HStack;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,YAAA,GAAkE;AAAA,EACpE,EAAA,EAAI,CAAA;AAAA,EACJ,EAAA,EAAI,CAAA;AAAA,EACJ,EAAA,EAAI,EAAA;AAAA,EACJ,EAAA,EAAI,EAAA;AAAA,EACJ,EAAA,EAAI,EAAA;AAAA,EACJ,KAAA,EAAO,EAAA;AAAA,EACP,KAAA,EAAO,EAAA;AAAA,EACP,KAAA,EAAO;AACX,CAAA;AAqBA,MAAM,MAAA,GAAmD,CAAC,KAAA,KAAU;AAChE,EAAA,MAAM,EAAC,QAAA,EAAU,WAAA,EAAW,GAAI,aAA0B,KAAK,CAAA;AAC/D,EAAA,MAAM;AAAA,IACF,KAAA,GAAQ,IAAA;AAAA,IACR,QAAA,GAAW,KAAA;AAAA,IACX,UAAA;AAAA,IACA,QAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,GAAG;AAAA,GACP,GAAI,WAAA;AAEJ,EAAA,uBACI,GAAA;AAAA,IAAC,iBAAA;AAAA,IAAA;AAAA,MACG,KAAK,KAAA,CAAM,GAAA;AAAA,MACX,EAAA,EAAG,KAAA;AAAA,MACH,UAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA,EAAU;AAAA,QACN,aAAA,EAAe,WAAW,aAAA,GAAgB,KAAA;AAAA,QAC1C,GAAA,EAAK,aAAa,KAAK,CAAA;AAAA,QACvB,GAAG;AAAA,OACP;AAAA,MAEA,WAAA,EAAa,IAAA;AAAA,MAEZ;AAAA;AAAA,GACL;AAER;;;;"}