@multiplatform.one/components 5.0.26 → 6.0.0

package/dist/jsx/views/Dashboard.stories.native.js

@@ -0,0 +1,100 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var Dashboard_stories_exports = {};
+__export(Dashboard_stories_exports, {
+  Default: () => Default,
+  default: () => Dashboard_stories_default
+});
+module.exports = __toCommonJS(Dashboard_stories_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_Dashboard = require("./Dashboard.native.js");
+var widgets = [{
+  id: "kpi-1",
+  type: "kpi",
+  kpiConfig: {
+    label: "Total Revenue",
+    value: "$12,450",
+    trend: "up",
+    trendValue: "+12%"
+  }
+}, {
+  id: "kpi-2",
+  type: "kpi",
+  kpiConfig: {
+    label: "Active Users",
+    value: "1,234",
+    trend: "up",
+    trendValue: "+5%"
+  }
+}, {
+  id: "kpi-3",
+  type: "kpi",
+  kpiConfig: {
+    label: "Conversion Rate",
+    value: "3.2%",
+    trend: "down",
+    trendValue: "-0.5%"
+  }
+}, {
+  id: "chart-1",
+  type: "chart",
+  colSpan: 2,
+  chartConfig: {
+    title: "Monthly Revenue",
+    type: "bar",
+    data: [{
+      label: "Jan",
+      value: 4e3
+    }, {
+      label: "Feb",
+      value: 3e3
+    }, {
+      label: "Mar",
+      value: 5e3
+    }, {
+      label: "Apr",
+      value: 4500
+    }]
+  }
+}];
+var meta = {
+  title: "Components/Dashboard",
+  parameters: {
+    status: {
+      type: "stable"
+    }
+  }
+};
+var Dashboard_stories_default = meta;
+var Default = {
+  name: "Main",
+  render: function render() {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_Dashboard.Dashboard, {
+      widgets,
+      title: "Sales Dashboard"
+    });
+  }
+};
+//# sourceMappingURL=Dashboard.stories.native.js.map

package/dist/jsx/views/Dashboard.stories.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","Dashboard_stories_exports","Default","default","Dashboard_stories_default","module","exports","import_jsx_runtime","require","import_Dashboard","widgets","id","type","kpiConfig","label","trend","trendValue"],"sources":["../../../src/views/Dashboard.stories.tsx"],"sourcesContent":[null],"mappings":"AACA,YAAS;;AA8CO,IAAAA,SAAA,GAAAC,MAAA,CAAAC,cAAA;AA5ChB,IAAAC,gBAAmC,GAAAF,MAAA,CAAAG,wBAAA;AAAA,IACjCC,iBAAA,GAAAJ,MAAA,CAAAK,mBAAA;AAAA,IACEC,YAAI,GAAAN,MAAA,CAAAO,SAAA,CAAAC,cAAA;AAAA,IACJC,QAAM,GAAAA,CAAAC,MAAA,EAAAC,GAAA;EAAA,KACN,IAAAC,IAAW,IAAED,GAAA,EACfZ,SAAA,CAAAW,MAAA,EAAAE,IAAA;IAAAC,GAAA,EAAAF,GAAA,CAAAC,IAAA;IAAAE,UAAA;EAAA;AAAA;AACA,IACEC,WAAI,GAAAA,CAAAC,EAAA,EAAAC,IAAA,EAAAC,MAAA,EAAAC,IAAA;EAAA,IACJF,IAAM,WAAAA,IAAA,wBAAAA,IAAA;IACN,SAAAG,GAAW,IAAEhB,iBAAO,CAAAa,IAAgB,GACtC,KAAAX,YAAA,CAAAe,IAAA,CAAAL,EAAA,EAAAI,GAAA,KAAAA,GAAA,KAAAF,MAAA,EACAnB,SAAA,CAAAiB,EAAA,EAAAI,GAAA;MAAAP,GAAA,EAAAA,CAAA,KAAAI,IAAA,CAAAG,GAAA;MAAAN,UAAA,IAAAK,IAAA,GAAAjB,gBAAA,CAAAe,IAAA,EAAAG,GAAA,MAAAD,IAAA,CAAAL;IAAA;EAAA;EACM,OACJE,EAAM;AAAA;AACmF,IAC3FM,YAAA,GAAAC,GAAA,IAAAR,WAAA,CAAAhB,SAAA;EAAAyB,KAAA;AAAA,IAAAD,GAAA;AAAA,IACAE,yBAAA;AAAAhB,QACM,CAAAgB,yBAAA;EAAAC,OACJ,EAAMA,CAAA,KAAAA,OAAA;EAAAC,OACN,EAAAA,CAAA,KAASC;AAAA;AACIC,MACX,CAAAC,OAAO,GAAAR,YAAA,CAAAG,yBAAA;AAAA,IAAAM,kBACD,GAAAC,OAAA;AAAA,IAAAC,gBACA,GAAAD,OAAA;AAAA,IAAAE,OACF,IAA0B;EACAC,EAAA,EAC5B,OAAE;EAA0BC,IAC5B,EAAE;EAA0BC,SAC9B;IACFC,KAAA;IACFd,KAAA;IACFe,KAAA;IAEMC,UAAa;EACjB;AACA,GAAY;EAEZL,EAAA;EACFC,IAAA;EAEOC,SAAA;IAEMC,KAAA,gBAAU;IACrBd,KAAM;IACNe,KAAQ,MAAM;IAChBC,UAAA","ignoreList":[]}

package/dist/jsx/views/ImageGrid.mjs

@@ -0,0 +1,160 @@
+import { componentColors } from "../componentColors.mjs";
+import { useResolvedKnobs } from "@multiplatform.one/theme";
+import { useHotkey } from "@tanstack/react-hotkeys";
+import { useCallback, useId, useRef, useState } from "react";
+import { Spinner, Text, View, XStack, YStack } from "tamagui";
+import { jsx, jsxs } from "react/jsx-runtime";
+function ImageGrid({
+  items,
+  renderItem,
+  onItemClick,
+  onLoadMore,
+  hasMore = false,
+  isLoading = false,
+  columns = 4,
+  estimateSize: _estimateSize,
+  overscan: _overscan,
+  height: heightProp,
+  emptyMessage = "No items found",
+  hotkeys: hotkeyOverrides,
+  ...stackProps
+}) {
+  const {
+    knobProps
+  } = useResolvedKnobs();
+  const sz = knobProps.sizeToken;
+  const height = heightProp ?? (sz === "$3" ? 480 : sz === "$5" ? 720 : 600);
+  const gridId = useId();
+  const containerRef = useRef(null);
+  const [focusedIndex, setFocusedIndex] = useState(-1);
+  const scrollToIndex = useCallback(index => {
+    if (index >= 0 && index < items.length) {
+      document.getElementById(`${gridId}-item-${index}`)?.scrollIntoView({
+        block: "nearest"
+      });
+    }
+  }, [gridId, items.length]);
+  const hotkeyOpts = {
+    target: containerRef
+  };
+  useHotkey(hotkeyOverrides?.right ?? "ArrowRight", () => {
+    setFocusedIndex(prev => {
+      if (prev < 0) return 0;
+      const col = prev % columns;
+      if (col < columns - 1 && prev + 1 < items.length) {
+        const next = prev + 1;
+        scrollToIndex(next);
+        return next;
+      }
+      return prev;
+    });
+  }, hotkeyOpts);
+  useHotkey(hotkeyOverrides?.left ?? "ArrowLeft", () => {
+    setFocusedIndex(prev => {
+      if (prev < 0) return 0;
+      const col = prev % columns;
+      if (col > 0) {
+        const next = prev - 1;
+        scrollToIndex(next);
+        return next;
+      }
+      return prev;
+    });
+  }, hotkeyOpts);
+  useHotkey(hotkeyOverrides?.down ?? "ArrowDown", () => {
+    setFocusedIndex(prev => {
+      if (prev < 0) return 0;
+      const next = prev + columns;
+      if (next < items.length) {
+        scrollToIndex(next);
+        return next;
+      }
+      return prev;
+    });
+  }, hotkeyOpts);
+  useHotkey(hotkeyOverrides?.up ?? "ArrowUp", () => {
+    setFocusedIndex(prev => {
+      if (prev < 0) return 0;
+      const next = prev - columns;
+      if (next >= 0) {
+        scrollToIndex(next);
+        return next;
+      }
+      return prev;
+    });
+  }, hotkeyOpts);
+  useHotkey(hotkeyOverrides?.select ?? "Enter", () => {
+    if (focusedIndex >= 0 && focusedIndex < items.length) {
+      onItemClick?.(items[focusedIndex]);
+    }
+  }, hotkeyOpts);
+  if (isLoading && items.length === 0) {
+    return /* @__PURE__ */jsx(YStack, {
+      ...knobProps.panelPadding,
+      alignItems: "center",
+      ...stackProps,
+      children: /* @__PURE__ */jsx(Spinner, {
+        size: "large"
+      })
+    });
+  }
+  if (items.length === 0) {
+    return /* @__PURE__ */jsx(YStack, {
+      ...knobProps.panelPadding,
+      alignItems: "center",
+      ...stackProps,
+      children: /* @__PURE__ */jsx(Text, {
+        color: componentColors.text.muted,
+        children: emptyMessage
+      })
+    });
+  }
+  const effectiveFocused = focusedIndex >= items.length ? -1 : focusedIndex;
+  return /* @__PURE__ */jsx(YStack, {
+    ...stackProps,
+    children: /* @__PURE__ */jsxs(View, {
+      ref: containerRef,
+      role: "grid",
+      "aria-label": "Image grid",
+      "aria-activedescendant": effectiveFocused >= 0 ? `${gridId}-item-${effectiveFocused}` : void 0,
+      tabIndex: 0,
+      outlineWidth: 0,
+      style: {
+        height,
+        overflowY: "auto"
+      },
+      children: [/* @__PURE__ */jsx(XStack, {
+        flexWrap: "wrap",
+        onScroll: onLoadMore && hasMore && !isLoading ? () => {
+          const el = containerRef.current;
+          if (el && el.scrollTop + el.clientHeight >= el.scrollHeight - 50) onLoadMore();
+        } : void 0,
+        children: items.map((item, index) => {
+          const isFocused = effectiveFocused === index;
+          return /* @__PURE__ */jsx(View, {
+            id: `${gridId}-item-${index}`,
+            "data-focused": isFocused || void 0,
+            width: `${100 / columns}%`,
+            backgroundColor: isFocused ? "$accentBackground" : void 0,
+            borderRadius: isFocused ? knobProps.borderRadius.borderRadius : void 0,
+            ...knobProps.gap,
+            cursor: onItemClick ? "pointer" : void 0,
+            onPress: onItemClick ? () => {
+              setFocusedIndex(index);
+              onItemClick(item);
+            } : void 0,
+            children: renderItem(item)
+          }, `${gridId}-item-${index}`);
+        })
+      }), isLoading && items.length > 0 && /* @__PURE__ */jsx(YStack, {
+        padding: "$2",
+        alignItems: "center",
+        children: /* @__PURE__ */jsx(Spinner, {
+          size: "small"
+        })
+      })]
+    })
+  });
+}
+export { ImageGrid };
+//# sourceMappingURL=ImageGrid.mjs.map

package/dist/jsx/views/ImageGrid.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["componentColors","useResolvedKnobs","useHotkey","useCallback","useId","useRef","useState","Spinner","Text","View","XStack","YStack","jsx","jsxs","ImageGrid","items","renderItem","onItemClick","onLoadMore","hasMore","isLoading","columns","estimateSize","_estimateSize","overscan","_overscan","height","heightProp","emptyMessage","hotkeys","hotkeyOverrides","stackProps","knobProps","sz","sizeToken","gridId","containerRef","focusedIndex","setFocusedIndex","scrollToIndex","index","length","document","getElementById","scrollIntoView","block","hotkeyOpts","target","right","prev","col","next","left","down","up","select","panelPadding","alignItems","children","size","color","text","muted","effectiveFocused","ref","role","tabIndex","outlineWidth","style","overflowY","flexWrap","onScroll","el","current","scrollTop","clientHeight","scrollHeight","map","item","isFocused","id","width","backgroundColor","borderRadius","gap","cursor","onPress","padding"],"sources":["../../../src/views/ImageGrid.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/jsx/views/ImageGrid.native.js

@@ -0,0 +1,202 @@
+"use strict";
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+// If the importer is in node compatibility mode or this is not an ESM
+// file that has been converted to a CommonJS file using a Babel-
+// compatible transform (i.e. "__esModule" has not been set), then set
+// "default" to the CommonJS "module.exports" for node compatibility.
+isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var ImageGrid_exports = {};
+__export(ImageGrid_exports, {
+  ImageGrid: () => ImageGrid
+});
+module.exports = __toCommonJS(ImageGrid_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_componentColors = require("../componentColors.native.js");
+var import_theme = require("@multiplatform.one/theme");
+var import_react_hotkeys = require("@tanstack/react-hotkeys");
+var import_react = __toESM(require("react"));
+var import_tamagui = require("tamagui");
+function ImageGrid(param) {
+  var {
+    items,
+    renderItem,
+    onItemClick,
+    onLoadMore,
+    hasMore = false,
+    isLoading = false,
+    columns = 4,
+    estimateSize: _estimateSize,
+    overscan: _overscan,
+    height: heightProp,
+    emptyMessage = "No items found",
+    hotkeys: hotkeyOverrides,
+    ...stackProps
+  } = param;
+  var _ref, _ref1, _ref2, _ref3, _ref4;
+  var {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  var sz = knobProps.sizeToken;
+  var height = heightProp !== null && heightProp !== void 0 ? heightProp : sz === "$3" ? 480 : sz === "$5" ? 720 : 600;
+  var gridId = (0, import_react.useId)();
+  var containerRef = (0, import_react.useRef)(null);
+  var [focusedIndex, setFocusedIndex] = (0, import_react.useState)(-1);
+  var scrollToIndex = (0, import_react.useCallback)(function (index) {
+    if (index >= 0 && index < items.length) {
+      var _document_getElementById;
+      (_document_getElementById = document.getElementById(`${gridId}-item-${index}`)) === null || _document_getElementById === void 0 ? void 0 : _document_getElementById.scrollIntoView({
+        block: "nearest"
+      });
+    }
+  }, [gridId, items.length]);
+  var hotkeyOpts = {
+    target: containerRef
+  };
+  (0, import_react_hotkeys.useHotkey)((_ref = hotkeyOverrides === null || hotkeyOverrides === void 0 ? void 0 : hotkeyOverrides.right) !== null && _ref !== void 0 ? _ref : "ArrowRight", function () {
+    setFocusedIndex(function (prev) {
+      if (prev < 0) return 0;
+      var col = prev % columns;
+      if (col < columns - 1 && prev + 1 < items.length) {
+        var next = prev + 1;
+        scrollToIndex(next);
+        return next;
+      }
+      return prev;
+    });
+  }, hotkeyOpts);
+  (0, import_react_hotkeys.useHotkey)((_ref1 = hotkeyOverrides === null || hotkeyOverrides === void 0 ? void 0 : hotkeyOverrides.left) !== null && _ref1 !== void 0 ? _ref1 : "ArrowLeft", function () {
+    setFocusedIndex(function (prev) {
+      if (prev < 0) return 0;
+      var col = prev % columns;
+      if (col > 0) {
+        var next = prev - 1;
+        scrollToIndex(next);
+        return next;
+      }
+      return prev;
+    });
+  }, hotkeyOpts);
+  (0, import_react_hotkeys.useHotkey)((_ref2 = hotkeyOverrides === null || hotkeyOverrides === void 0 ? void 0 : hotkeyOverrides.down) !== null && _ref2 !== void 0 ? _ref2 : "ArrowDown", function () {
+    setFocusedIndex(function (prev) {
+      if (prev < 0) return 0;
+      var next = prev + columns;
+      if (next < items.length) {
+        scrollToIndex(next);
+        return next;
+      }
+      return prev;
+    });
+  }, hotkeyOpts);
+  (0, import_react_hotkeys.useHotkey)((_ref3 = hotkeyOverrides === null || hotkeyOverrides === void 0 ? void 0 : hotkeyOverrides.up) !== null && _ref3 !== void 0 ? _ref3 : "ArrowUp", function () {
+    setFocusedIndex(function (prev) {
+      if (prev < 0) return 0;
+      var next = prev - columns;
+      if (next >= 0) {
+        scrollToIndex(next);
+        return next;
+      }
+      return prev;
+    });
+  }, hotkeyOpts);
+  (0, import_react_hotkeys.useHotkey)((_ref4 = hotkeyOverrides === null || hotkeyOverrides === void 0 ? void 0 : hotkeyOverrides.select) !== null && _ref4 !== void 0 ? _ref4 : "Enter", function () {
+    if (focusedIndex >= 0 && focusedIndex < items.length) {
+      onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick(items[focusedIndex]);
+    }
+  }, hotkeyOpts);
+  if (isLoading && items.length === 0) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+      ...knobProps.panelPadding,
+      alignItems: "center",
+      ...stackProps,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Spinner, {
+        size: "large"
+      })
+    });
+  }
+  if (items.length === 0) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+      ...knobProps.panelPadding,
+      alignItems: "center",
+      ...stackProps,
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+        color: import_componentColors.componentColors.text.muted,
+        children: emptyMessage
+      })
+    });
+  }
+  var effectiveFocused = focusedIndex >= items.length ? -1 : focusedIndex;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+    ...stackProps,
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.View, {
+      ref: containerRef,
+      role: "grid",
+      "aria-label": "Image grid",
+      "aria-activedescendant": effectiveFocused >= 0 ? `${gridId}-item-${effectiveFocused}` : void 0,
+      tabIndex: 0,
+      outlineWidth: 0,
+      style: {
+        height,
+        overflowY: "auto"
+      },
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.XStack, {
+        flexWrap: "wrap",
+        onScroll: onLoadMore && hasMore && !isLoading ? function () {
+          var el = containerRef.current;
+          if (el && el.scrollTop + el.clientHeight >= el.scrollHeight - 50) onLoadMore();
+        } : void 0,
+        children: items.map(function (item, index) {
+          var isFocused = effectiveFocused === index;
+          return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+            id: `${gridId}-item-${index}`,
+            "data-focused": isFocused || void 0,
+            width: `${100 / columns}%`,
+            backgroundColor: isFocused ? "$accentBackground" : void 0,
+            borderRadius: isFocused ? knobProps.borderRadius.borderRadius : void 0,
+            ...knobProps.gap,
+            cursor: onItemClick ? "pointer" : void 0,
+            onPress: onItemClick ? function () {
+              setFocusedIndex(index);
+              onItemClick(item);
+            } : void 0,
+            children: renderItem(item)
+          }, `${gridId}-item-${index}`);
+        })
+      }), isLoading && items.length > 0 && /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+        padding: "$2",
+        alignItems: "center",
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Spinner, {
+          size: "small"
+        })
+      })]
+    })
+  });
+}
+//# sourceMappingURL=ImageGrid.native.js.map

package/dist/jsx/views/ImageGrid.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__create","Object","create","__defProp","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__getProtoOf","getPrototypeOf","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toESM","mod","isNodeMode","__esModule","value","__toCommonJS","ImageGrid_exports","ImageGrid","module","exports","import_jsx_runtime","require","import_componentColors","import_theme","import_react_hotkeys","import_react","import_tamagui","param","items","renderItem","onItemClick","onLoadMore","hasMore","isLoading","columns","estimateSize","_estimateSize","overscan","_overscan","height","heightProp","emptyMessage","hotkeys","hotkeyOverrides","stackProps","_ref","_ref1","_ref2","_ref3","_ref4","knobProps","useResolvedKnobs","sz","sizeToken","gridId","useId","containerRef","useRef","focusedIndex","setFocusedIndex","useState","scrollToIndex","useCallback","index","length","_document_getElementById","document","getElementById","scrollIntoView","block","hotkeyOpts","useHotkey","right","prev","col","next","left","down","up","select","jsx","YStack","panelPadding","alignItems","children","Spinner","size","Text","color","componentColors","text","muted","effectiveFocused","jsxs","View","ref","role","tabIndex","outlineWidth","style","overflowY","XStack","flexWrap","onScroll","el","current","scrollTop","clientHeight","scrollHeight","map","item","isFocused","id","width","backgroundColor","borderRadius"],"sources":["../../../src/views/ImageGrid.tsx"],"sourcesContent":[null],"mappings":"AAAA,YAAS;;AACT,IAAAA,QAAS,GAAAC,MAAA,CAAAC,MAAA;AACT,IAAAC,SAAS,GAAAF,MAAA,CAAAG,cAAiB;AAE1B,IAAAC,gBAAgB,GAAaJ,MAAO,CAAAK,wBAAwB;AAC5D,IAAAC,iBAAkB,GAAMN,MAAM,CAAAO,mBAAQ;AA4L9B,IAAAC,YAkBF,GAAAR,MAAA,CAlBES,cAAA;AArHD,IAAAC,YAAS,GAAaV,MAAA,CAAAW,SAAA,CAAAC,cAAA;AAAA,IAC3BC,QAAA,GAAAA,CAAAC,MAAA,EAAAC,GAAA;EACA,SAAAC,IAAA,IAAAD,GAAA,EACAb,SAAA,CAAAY,MAAA,EAAAE,IAAA;IAAAC,GAAA,EAAAF,GAAA,CAAAC,IAAA;IAAAE,UAAA;EAAA;AAAA;AACA,IACAC,WAAU,GAAAA,CAAAC,EAAA,EAAAC,IAAA,EAAAC,MAAA,EAAAC,IAAA;EACV,IAAAF,IAAA,IAAY,OAAAA,IAAA,wBAAAA,IAAA;IACZ,SAAUG,GAAA,IAAAlB,iBAAA,CAAAe,IAAA,GACV,KAAAX,YAAc,CAAAe,IAAA,CAAAL,EAAA,EAAAI,GAAA,KAAAA,GAAA,KAAAF,MAAA,EACdpB,SAAU,CAAAkB,EAAA,EAAAI,GAAA;MAAAP,GAAA,EAAAA,CAAA,KAAAI,IAAA,CAAAG,GAAA;MAAAN,UAAA,IAAAK,IAAA,GAAAnB,gBAAA,CAAAiB,IAAA,EAAAG,GAAA,MAAAD,IAAA,CAAAL;IAAA;EACV;EACA,OAAAE,EAAA;AAAe;AACN,IACTM,OAAG,GAAAA,CAAAC,GAAA,EAAAC,UAAA,EAAAd,MAAA,MAAAA,MAAA,GAAAa,GAAA,WAAA5B,QAAA,CAAAS,YAAA,CAAAmB,GAAA,SAAAR,WAAA;AACL;AACE;AACA;AACA;AACAS,UAAM,KAASD,GAAA,IAAM,CAAAA,GAAA,CAAAE,UAAA,GAAA3B,SAAA,CAAAY,MAAA;EAAAgB,KAAA,EAAAH,GAAA;EAAAT,UAAA;AAAA,KAAAJ,MAAA,EACrBa,GACA;AAGA,IAAAI,YAAM,GAAAJ,GAAA,IAAgBR,WAAA,CAAAjB,SAAA;EAAA4B,KAAA;AAAA,IAAAH,GAAA;AAAA,IACpBK,iBAAmB;AACjBnB,QAAA,CAAAmB,iBAAkB;EAChBC,SAAA,EAAAA,CAAA,KAASA;AAA8E;AACzFC,MACF,CAAAC,OAAA,GAAAJ,YAAA,CAAAC,iBAAA;AAAA,IACAI,kBAAe,GAAMC,OAAA;AAAA,IACvBC,sBAAA,GAAAD,OAAA;AAGA,IAAAE,YAAM,GAAAF,OAAa;AAAA,IACjBG,oBAAQ,GAAAH,OAAA;AAAA,IACVI,YAAA,GAAAf,OAAA,CAAAW,OAAA;AAEA,IAAAK,cAAA,GAAAL,OAAA;AAAA,SACEJ,UAAAU,KAAiB;EAAS,IAC1B;IAAAC,KAAM;IAAAC,UAAA;IAAAC,WAAA;IAAAC,UAAA;IAAAC,OAAA;IAAAC,SAAA;IAAAC,OAAA;IAAAC,YAAA,EAAAC,aAAA;IAAAC,QAAA,EAAAC,SAAA;IAAAC,MAAA,EAAAC,UAAA;IAAAC,YAAA;IAAAC,OAAA,EAAAC,eAAA;IAAA,GAAAC;EAAA,IAAAjB,KAAA;EACJ,IAAAkB,IAAA,EAAAC,KAAA,EAAAC,KAAiB,EAAAC,KAAA,EAASC,KAAA;EACxB;IAAAC;EAAI,CAAO,GAAG,IAAA3B,YAAO,CAAA4B,gBAAA;EACrB,IAAAC,EAAA,GAAAF,SAAY,CAAAG,SAAO;EAEnB,IAAAd,MAAI,GAAAC,UAAM,KAAU,IAAK,IAAAA,UAAW,KAAM,KAAQ,IAAAA,UAAA,GAAAY,EAAA,kBAAAA,EAAA;EAChD,IAAAE,MAAA,IAAM,GAAA7B,YAAc,CAAA8B,KAAA;EACpB,IAAAC,YAAA,OAAc/B,YAAI,CAAAgC,MAAA;EAClB,KAAAC,YAAO,EAAAC,eAAA,QAAAlC,YAAA,CAAAmC,QAAA;EAAA,IAAAC,aACT,OAAApC,YAAA,CAAAqC,WAAA,YAAAC,KAAA;IACA,IAAAA,KAAA,IAAO,KAAAA,KAAA,GAAAnC,KAAA,CAAAoC,MAAA;MACT,IAACC,wBAAA;MACH,CAAAA,wBAAA,GAAAC,QAAA,CAAAC,cAAA,IAAAb,MAAA,SAAAS,KAAA,iBAAAE,wBAAA,uBAAAA,wBAAA,CAAAG,cAAA;QACAC,KAAA;MACF;IAEA;EAAA,GACE,CACAf,MAAM,EACJ1B,KAAA,CAAAoC,MAAA,CACE;EACA,IAAAM,UAAM;IACNxE,MAAA,EAAI0D;EACF;EACA,IAAAhC,oBAAc,CAAA+C,SAAI,GAAA1B,IAAA,GAAAF,eAAA,aAAAA,eAAA,uBAAAA,eAAA,CAAA6B,KAAA,cAAA3B,IAAA,cAAAA,IAAA;IAClBc,eAAO,WAAAc,IAAA;MAAA,IACTA,IAAA;MACA,IAAAC,GAAA,GAAOD,IAAA,GAAAvC,OAAA;MACT,IAACwC,GAAA,GAAAxC,OAAA,QAAAuC,IAAA,OAAA7C,KAAA,CAAAoC,MAAA;QACH,IAAAW,IAAA,GAAAF,IAAA;QACAZ,aAAA,CAAAc,IAAA;QACF,OAAAA,IAAA;MAEA;MACE,OAAAF,IAAA;IACA;EACE,GAAAH,UAAA;EACE,IAAA9C,oBAAc,CAAA+C,SAAO,GAAAzB,KAAA,GAAAH,eAAA,aAAAA,eAAA,uBAAAA,eAAA,CAAAiC,IAAA,cAAA9B,KAAA,cAAAA,KAAA;IACrBa,eAAM,WAAcc,IAAA;MACpB,IAAAA,IAAI,MAAO,OAAM;MACf,IAAAC,GAAA,GAAAD,IAAA,GAAAvC,OAAkB;MAClB,IAAAwC,GAAA,IAAO;QACT,IAAAC,IAAA,GAAAF,IAAA;QACAZ,aAAO,CAAAc,IAAA;QACR,OAAAA,IAAA;MACH;MACA,OAAAF,IAAA;IACF;EAEA,GAAAH,UAAA;EAAA,EACE,EAAA9C,oBAAiB,CAAM+C,SAAA,GAAAxB,KAAA,GAAAJ,eAAA,aAAAA,eAAA,uBAAAA,eAAA,CAAAkC,IAAA,cAAA9B,KAAA,cAAAA,KAAA;IACvBY,eAAM,WAAAc,IAAA;MACJ,IAAAA,IAAA,aAAiB;MACf,IAAAE,IAAI,GAAAF,IAAU,GAAAvC,OAAO;MACrB,IAAAyC,IAAM,GAAA/C,KAAO,CAAAoC,MAAO;QACpBH,aAAY,CAAAc,IAAG;QACb,OAAAA,IAAA;MACA;MAAO,OACTF,IAAA;IACA;EAAO,GAAAH,UACR;EAAA,EACH,EAAA9C,oBAAA,CAAA+C,SAAA,GAAAvB,KAAA,GAAAL,eAAA,aAAAA,eAAA,uBAAAA,eAAA,CAAAmC,EAAA,cAAA9B,KAAA,cAAAA,KAAA;IACAW,eAAA,WAAAc,IAAA;MACF,IAAAA,IAAA;MAEA,IAAAE,IAAA,GAAAF,IAAA,GAAAvC,OAAA;MACE,IAAAyC,IAAA,OAAiB;QACjBd,aAAM,CAAAc,IAAA;QACJ,OAAIA,IAAA;MACF;MACF,OAAAF,IAAA;IACF;EAAA,GACAH,UAAA;EACF,IAAA9C,oBAAA,CAAA+C,SAAA,GAAAtB,KAAA,GAAAN,eAAA,aAAAA,eAAA,uBAAAA,eAAA,CAAAoC,MAAA,cAAA9B,KAAA,cAAAA,KAAA;IAEA,IAAIS,YAAa,KAAM,IAAAA,YAAc,GAAA9B,KAAA,CAAAoC,MAAA;MACnClC,WACE,aAAAA,WAAS,KAAG,SAAU,SAAAA,WAAc,CAAAF,KAAW,CAAA8B,YAAa;IAIhE;EAEA,GAAAY,UAAU;EACR,IAAArC,SACE,IAAAL,KAAA,CAAAoC,MAAC;IAIL,0BAAA5C,kBAAA,CAAA4D,GAAA,EAAAtD,cAAA,CAAAuD,MAAA;MAGA,GAAM/B,SAAA,CAAAgC,YAAmB;MAEzBC,UACE;MACG,GAAAvC,UAAA;MAAAwC,QAAA,qBAAAhE,kBAAA,CAAA4D,GAAA,EAAAtD,cAAA,CAAA2D,OAAA;QACCC,IAAK;MACL;IAAK,EACL;EAAW;EAEsD,IAEjE1D,KAAA,CAAAoC,MAAU;IAAA,OACV,eAAc,IAAA5C,kBAAA,CAAA4D,GAAA,EAAAtD,cAAA,CAAAuD,MAAA;MACd,GAAA/B,SAAS,CAAAgC,YAAQ;MAEjBC,UAAA;MAAA,GAAAvC,UAAA;MAAAwC,QAAC,qBAAAhE,kBAAA,CAAA4D,GAAA,EAAAtD,cAAA,CAAA6D,IAAA;QAAAC,KAAA,EAAAlE,sBAAA,CAAAmE,eAAA,CAAAC,IAAA,CAAAC,KAAA;QAAAP,QACC,EAAA3C;MAAS;IAID;EACA;EAA6E,IAAAmD,gBAE/E,GAAAlC,YAAA,IAAA9B,KAAA,CAAAoC,MAAA,QAAAN,YAAA;EAAA,sBAGL,IAAMtC,kBAAW,CAAA4D,GAAU,EAAAtD,cAAA,CAAAuD,MAAA;IAC1B,GAAArC,UAAA;IACAwC,QAAA,iBACE,IAAAhE,kBAAA,CAAAyE,IAAA,EAAAnE,cAAA,CAAAoE,IAAA;MAAAC,GAAA,EAAAvC,YAAC;MAAAwC,IAAA;MAAA,YAEC,cAAa;MAAc,uBAC3B,EAAAJ,gBAA2B,WAAAtC,MAAA,SAAAsC,gBAAA;MAAAK,QAAA;MACJC,YACvB;MAAmDC,KAAA;QACa5D,MAAA;QAClD6D,SAAA,EACd;MAAkC;MAI1BhB,QAAA,GACA,mBAAAhE,kBAAgB,CAAA4D,GAAA,EAAAtD,cAAA,CAAA2E,MAAA;QAAAC,QAClB,QACA;QAAAC,QAGL,EAAAxE,UAAA,IAAAC,OAAW,IAAI,CAAAC,SAAA;UAAA,IAAAuE,EAAA,GAAAhD,YAAA,CAAAiD,OAAA;UAAA,IAjBXD,EAAA,IAAGA,EAAA,CAAME,SAAS,GAAAF,EAAK,CAAAG,YAAA,IAAAH,EAAA,CAAAI,YAAA,OAAA7E,UAAA;QAAA,IAkB9B;QAAAqD,QAEH,EAAAxD,KAAA,CAAAiF,GAAA,WAAAC,IAAA,EAAA/C,KAAA;UAAA,IAAAgD,SAAA,GAAAnB,gBAAA,KAAA7B,KAAA;UACH,0BAAA3C,kBAAA,CAAA4D,GAAA,EAAAtD,cAAA,CAAAoE,IAAA;YACCkB,EAAA,KAAa1D,MAAM,SAASS,KAC3B;YAEA,gBAAAgD,SAAA;YAAAE,KAAA,WAAA/E,OAAA;YAGNgF,eAAA,EAAAH,SAAA;YAEJI,YAAA,EAAAJ,SAAA,GAAA7D,SAAA,CAAAiE,YAAA,CAAAA,YAAA","ignoreList":[]}

package/dist/jsx/views/ImageGrid.stories.mjs

@@ -0,0 +1,42 @@
+import { Text, View } from "tamagui";
+import { ImageGrid } from "./ImageGrid.mjs";
+import { jsx } from "react/jsx-runtime";
+const items = Array.from({
+  length: 12
+}, (_, i) => ({
+  id: `img-${i + 1}`,
+  src: `https://picsum.photos/seed/${i + 1}/200/200`,
+  alt: `Sample image ${i + 1}`
+}));
+const meta = {
+  title: "Components/ImageGrid",
+  parameters: {
+    status: {
+      type: "stable"
+    }
+  }
+};
+var ImageGrid_stories_default = meta;
+const Default = {
+  name: "Main",
+  render: () => /* @__PURE__ */jsx(ImageGrid, {
+    items,
+    columns: 3,
+    getItemKey: item => item.id,
+    renderItem: item => /* @__PURE__ */jsx(View, {
+      width: "100%",
+      aspectRatio: 1,
+      backgroundColor: "$color3",
+      borderRadius: "$3",
+      alignItems: "center",
+      justifyContent: "center",
+      children: /* @__PURE__ */jsx(Text, {
+        fontSize: "$2",
+        children: item.alt
+      })
+    }),
+    height: 400
+  })
+};
+export { Default, ImageGrid_stories_default as default };
+//# sourceMappingURL=ImageGrid.stories.mjs.map

package/dist/jsx/views/ImageGrid.stories.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["Text","View","ImageGrid","jsx","items","Array","from","length","_","i","id","src","alt","meta","title","parameters","status","type","ImageGrid_stories_default","Default","name","render","columns","getItemKey","item","renderItem","width","aspectRatio","backgroundColor","borderRadius","alignItems","justifyContent","children","fontSize","height"],"sources":["../../../src/views/ImageGrid.stories.tsx"],"sourcesContent":[null],"mappings":"AACA,SAASA,IAAA,EAAMC,IAAA,QAAY;AAC3B,SAASC,SAAA,QAAiB;AAuChB,SAAAC,GAAA;AA/BV,MAAMC,KAAA,GAAqBC,KAAA,CAAMC,IAAA,CAAK;EAAEC,MAAA,EAAQ;AAAG,GAAG,CAACC,CAAA,EAAGC,CAAA,MAAO;EAC/DC,EAAA,EAAI,OAAOD,CAAA,GAAI,CAAC;EAChBE,GAAA,EAAK,8BAA8BF,CAAA,GAAI,CAAC;EACxCG,GAAA,EAAK,gBAAgBH,CAAA,GAAI,CAAC;AAC5B,EAAE;AAEF,MAAMI,IAAA,GAAa;EACjBC,KAAA,EAAO;EACPC,UAAA,EAAY;IACVC,MAAA,EAAQ;MAAEC,IAAA,EAAM;IAAS;EAC3B;AACF;AAEA,IAAOC,yBAAA,GAAQL,IAAA;AAER,MAAMM,OAAA,GAAU;EACrBC,IAAA,EAAM;EACNC,MAAA,EAAQA,CAAA,KACN,eAAAlB,GAAA,CAACD,SAAA;IACCE,KAAA;IACAkB,OAAA,EAAS;IACTC,UAAA,EAAaC,IAAA,IAASA,IAAA,CAAKd,EAAA;IAC3Be,UAAA,EAAaD,IAAA,IACX,eAAArB,GAAA,CAACF,IAAA;MACCyB,KAAA,EAAM;MACNC,WAAA,EAAa;MACbC,eAAA,EAAgB;MAChBC,YAAA,EAAa;MACbC,UAAA,EAAW;MACXC,cAAA,EAAe;MAEfC,QAAA,iBAAA7B,GAAA,CAACH,IAAA;QAAKiC,QAAA,EAAS;QAAMD,QAAA,EAAAR,IAAA,CAAKZ;MAAA,CAAI;IAAA,CAChC;IAEFsB,MAAA,EAAQ;EAAA,CACV;AAEJ","ignoreList":[]}

package/dist/jsx/views/ImageGrid.stories.native.js

@@ -0,0 +1,79 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var ImageGrid_stories_exports = {};
+__export(ImageGrid_stories_exports, {
+  Default: () => Default,
+  default: () => ImageGrid_stories_default
+});
+module.exports = __toCommonJS(ImageGrid_stories_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_tamagui = require("tamagui");
+var import_ImageGrid = require("./ImageGrid.native.js");
+var items = Array.from({
+  length: 12
+}, function (_, i) {
+  return {
+    id: `img-${i + 1}`,
+    src: `https://picsum.photos/seed/${i + 1}/200/200`,
+    alt: `Sample image ${i + 1}`
+  };
+});
+var meta = {
+  title: "Components/ImageGrid",
+  parameters: {
+    status: {
+      type: "stable"
+    }
+  }
+};
+var ImageGrid_stories_default = meta;
+var Default = {
+  name: "Main",
+  render: function render() {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ImageGrid.ImageGrid, {
+      items,
+      columns: 3,
+      getItemKey: function getItemKey(item) {
+        return item.id;
+      },
+      renderItem: function renderItem(item) {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+          width: "100%",
+          aspectRatio: 1,
+          backgroundColor: "$color3",
+          borderRadius: "$3",
+          alignItems: "center",
+          justifyContent: "center",
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+            fontSize: "$2",
+            children: item.alt
+          })
+        });
+      },
+      height: 400
+    });
+  }
+};
+//# sourceMappingURL=ImageGrid.stories.native.js.map

package/dist/jsx/views/ImageGrid.stories.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__defProp","Object","defineProperty","__getOwnPropDesc","getOwnPropertyDescriptor","__getOwnPropNames","getOwnPropertyNames","__hasOwnProp","prototype","hasOwnProperty","__export","target","all","name","get","enumerable","__copyProps","to","from","except","desc","key","call","__toCommonJS","mod","value","ImageGrid_stories_exports","Default","default","ImageGrid_stories_default","module","exports","import_jsx_runtime","require","import_tamagui","import_ImageGrid","items","Array","length","_","i","id","src","alt","meta","title","parameters"],"sources":["../../../src/views/ImageGrid.stories.tsx"],"sourcesContent":[null],"mappings":"AACA,YAAS;;AACT,IAAAA,SAAS,GAAAC,MAAA,CAAAC,cAAiB;AAuChB,IAAAC,gBAAA,GAAAF,MAAA,CAAAG,wBAAA;AA/BV,IAAAC,iBAAiC,GAAAJ,MAAO,CAAAK,mBAAkB;AAAO,IAC/DC,YAAW,GAAKN,MAAA,CAAAO,SAAA,CAAAC,cAAA;AAAA,IAChBC,QAAK,GAAAA,CAAAC,MAAA,EAAAC,GAAA;EACL,KAAK,IAAAC,IAAA,IAAAD,GAAA,EACLZ,SAAA,CAAAW,MAAA,EAAAE,IAAA;IAAAC,GAAA,EAAAF,GAAA,CAAAC,IAAA;IAAAE,UAAA;EAAA;AAEF;AAAmB,IACjBC,WAAO,GAAAA,CAAAC,EAAA,EAAAC,IAAA,EAAAC,MAAA,EAAAC,IAAA;EACP,IAAAF,IAAA,IAAY,OAAAA,IAAA,wBAAAA,IAAA;IACV,SAAQG,GAAE,IAAMhB,iBAAS,CAAAa,IAAA,GAC3B,KAAAX,YAAA,CAAAe,IAAA,CAAAL,EAAA,EAAAI,GAAA,KAAAA,GAAA,KAAAF,MAAA,EACFnB,SAAA,CAAAiB,EAAA,EAAAI,GAAA;MAAAP,GAAA,EAAAA,CAAA,KAAAI,IAAA,CAAAG,GAAA;MAAAN,UAAA,IAAAK,IAAA,GAAAjB,gBAAA,CAAAe,IAAA,EAAAG,GAAA,MAAAD,IAAA,CAAAL;IAAA;EAEA;EAEO,OAAME,EAAA;AAAU;AACf,IACNM,YACE,GAAAC,GAAA,IAAAR,WAAA,CAAAhB,SAAA;EAAAyB,KAAA;AAAA,IAAAD,GAAA;AAAA,IAACE,yBAAA;AAAAhB,QAAA,CAAAgB,yBAAA;EAAAC,OACC,EAAAA,CAAA,KAAAA,OAAA;EAAAC,OACA,EAAAA,CAAA,KAASC;AAAA;AACkBC,MAC3B,CAAAC,OAAA,GAAAR,YACE,CAAAG,yBAAA;AAAA,IAAAM,kBAAC,GAAAC,OAAA;AAAA,IAAAC,cAAA,GAAAD,OAAA;AAAA,IAAAE,gBACO,GAAAF,OAAA;AAAA,IAAAG,KAAA,GACNC,KAAA,CAAAnB,IAAA,CAAa;EAAAoB,MAAA,EACb;AAAgB,aAChBC,CAAA,EAAAC,CAAA;EAAa;IACFC,EAAA,SACXD,CAAA;IAAeE,GAAA,gCAEfF,CAAC,cAAK;IAAwBG,GAAA,kBAAAH,CAAA;EAAA;AAChC;AAEM,IAAAI,IAAA;EACVC,KAAA;EAEJC,UAAA","ignoreList":[]}