@multiplatform.one/frappe-ui 7.65.2 → 7.67.0

package/dist/esm/list/RecordCard.native.js

@@ -4,6 +4,7 @@ import { Button } from "@multiplatform.one/forms";
 import { transitionProps, useResolvedKnobs } from "@multiplatform.one/theme";
 import { HeartIcon } from "@phosphor-icons/react";
 import { useTranslation } from "react-i18next";
+import { useTheme } from "tamagui";
 import { FacetBadge } from "./FacetBadge.native.js";
 import { ImageWell } from "./ImageWell.native.js";
 function RecordCard(param) {
@@ -19,6 +20,7 @@ function RecordCard(param) {
     testID,
     favoriteTestID
   } = param;
+  var _this;
   var {
     t
   } = useTranslation();
@@ -28,21 +30,58 @@ function RecordCard(param) {
   } = useResolvedKnobs({
     component: "Card"
   });
+  var theme = useTheme();
   var handleToggleFavorite = function handleToggleFavorite2(event) {
     var _event_stopPropagation;
     event === null || event === void 0 ? void 0 : (_event_stopPropagation = event.stopPropagation) === null || _event_stopPropagation === void 0 ? void 0 : _event_stopPropagation.call(event);
     favorite === null || favorite === void 0 ? void 0 : favorite.toggle();
   };
-  return /* @__PURE__ */_jsx(Card, {
+  return /* @__PURE__ */_jsxs(Card, {
     testID,
-    ...knobProps.cardSurface,
-    // Full-bleed media: the card has no inset of its own and its radius
-    // clips the image well; the body below carries the inset.
-    padding: 0,
-    gap: 0,
-    overflow: "hidden",
-    "data-record-card-bleed": "",
-    elevation: knobProps.elevation,
+    media: /* @__PURE__ */_jsxs(YStack, {
+      position: "relative",
+      children: [/* @__PURE__ */_jsx(ImageWell, {
+        sources: images,
+        alt: title,
+        tint,
+        inset: 0.04,
+        borderRadius: 0,
+        ...{
+          "data-record-card-media": ""
+        }
+      }), favorite ? /* @__PURE__ */_jsx(XStack, {
+        position: "absolute",
+        top: "$1",
+        right: "$1",
+        zIndex: 2,
+        children: /* @__PURE__ */_jsx(Button, {
+          circular: true,
+          chromeless: true,
+          minWidth: knobProps.sizeToken,
+          minHeight: knobProps.sizeToken,
+          ...transitionProps(knobProps.motion.control),
+          backgroundColor: "$background08",
+          pressStyle: {
+            backgroundColor: "$background",
+            scale: 0.92
+          },
+          onPress: handleToggleFavorite,
+          col: favorite.active ? "$red9" : "$color11",
+          icon: /* @__PURE__ */_jsx(HeartIcon, {
+            size: 20,
+            weight: favorite.active ? "fill" : "regular",
+            color: (_this = favorite.active ? theme.red9 : theme.color11) === null || _this === void 0 ? void 0 : _this.val
+          }),
+          "aria-label": favorite.active ? t("Remove {{name}} from favorites", {
+            name: title
+          }) : t("Add {{name}} to favorites", {
+            name: title
+          }),
+          "aria-pressed": favorite.active,
+          testID: favoriteTestID
+        })
+      }) : null]
+    }),
     ...transitionProps(knobProps.motion.control, ["boxShadow", "shadowColor", "shadowOffset", "shadowOpacity", "shadowRadius", "elevation"]),
     pressStyle: {
       scale: 0.98,
@@ -53,93 +92,44 @@ function RecordCard(param) {
     onPress: function onPress1() {
       return onPress === null || onPress === void 0 ? void 0 : onPress();
     },
-    children: /* @__PURE__ */_jsxs(YStack, {
-      gap: 0,
-      children: [/* @__PURE__ */_jsxs(YStack, {
-        position: "relative",
-        children: [/* @__PURE__ */_jsx(ImageWell, {
-          sources: images,
-          alt: title,
-          tint,
-          inset: 0.04,
-          borderRadius: 0,
-          ...{
-            "data-record-card-media": ""
-          }
-        }), favorite ? /* @__PURE__ */_jsx(XStack, {
-          position: "absolute",
-          top: "$1",
-          right: "$1",
-          zIndex: 2,
-          children: /* @__PURE__ */_jsx(Button, {
-            circular: true,
-            chromeless: true,
-            minWidth: knobProps.sizeToken,
-            minHeight: knobProps.sizeToken,
-            ...transitionProps(knobProps.motion.control),
-            backgroundColor: "$background08",
-            pressStyle: {
-              backgroundColor: "$background",
-              scale: 0.92
-            },
-            onPress: handleToggleFavorite,
-            col: favorite.active ? "$red9" : "$color11",
-            icon: /* @__PURE__ */_jsx(HeartIcon, {
-              size: 20,
-              weight: favorite.active ? "fill" : "regular"
-            }),
-            "aria-label": favorite.active ? t("Remove {{name}} from favorites", {
-              name: title
-            }) : t("Add {{name}} to favorites", {
-              name: title
-            }),
-            "aria-pressed": favorite.active,
-            testID: favoriteTestID
-          })
-        }) : null]
-      }), /* @__PURE__ */_jsxs(YStack, {
-        ...knobProps.panelPadding,
-        gap: "$1.5",
-        children: [/* @__PURE__ */_jsxs(XStack, {
-          gap: "$2",
-          alignItems: "baseline",
-          children: [/* @__PURE__ */_jsx(Text, {
-            ...knobProps.heading,
-            fontWeight: "700",
-            fontSize: "$4",
-            numberOfLines: 1,
-            color: "$color12",
-            flexShrink: 1,
-            children: title
-          }), code ? /* @__PURE__ */_jsx(Text, {
-            fontSize: "$2",
-            fontWeight: "700",
-            color: "$color10",
-            flexShrink: 0,
-            ...{
-              "data-record-card-code": ""
-            },
-            children: code
-          }) : null]
-        }), subtitle ? /* @__PURE__ */_jsx(Text, {
-          ...knobProps.body,
-          fontSize: "$2",
-          color: "$color10",
-          numberOfLines: 1,
-          children: subtitle
-        }) : null, badges.length > 0 ? /* @__PURE__ */_jsx(XStack, {
-          gap: "$1.5",
-          flexWrap: "wrap",
-          children: badges.map(function (badge) {
-            return /* @__PURE__ */_jsx(FacetBadge, {
-              label: badge.label,
-              tint: badge.tint,
-              size: "$3"
-            }, badge.value);
-          })
-        }) : null]
-      })]
-    })
+    children: [/* @__PURE__ */_jsxs(XStack, {
+      gap: "$2",
+      alignItems: "baseline",
+      children: [/* @__PURE__ */_jsx(Text, {
+        ...knobProps.heading,
+        fontWeight: "700",
+        fontSize: "$4",
+        numberOfLines: 1,
+        color: "$color12",
+        flexShrink: 1,
+        children: title
+      }), code ? /* @__PURE__ */_jsx(Text, {
+        fontSize: "$2",
+        fontWeight: "700",
+        color: "$color10",
+        flexShrink: 0,
+        ...{
+          "data-record-card-code": ""
+        },
+        children: code
+      }) : null]
+    }), subtitle ? /* @__PURE__ */_jsx(Text, {
+      ...knobProps.body,
+      fontSize: "$2",
+      color: "$color10",
+      numberOfLines: 1,
+      children: subtitle
+    }) : null, badges.length > 0 ? /* @__PURE__ */_jsx(XStack, {
+      gap: "$1.5",
+      flexWrap: "wrap",
+      children: badges.map(function (badge) {
+        return /* @__PURE__ */_jsx(FacetBadge, {
+          label: badge.label,
+          tint: badge.tint,
+          size: "$3"
+        }, badge.value);
+      })
+    }) : null]
   });
 }
 export { RecordCard };

package/dist/esm/list/RecordCard.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Card","Text","XStack","YStack","Button","transitionProps","useResolvedKnobs","HeartIcon","useTranslation","FacetBadge","ImageWell","RecordCard","param","title","subtitle","code","images","tint","badges","onPress","favorite","testID","favoriteTestID","t","knobProps","elevation","elevationState","component","handleToggleFavorite","handleToggleFavorite2","event","_event_stopPropagation","stopPropagation","call","toggle","cardSurface","padding","gap","overflow","motion","control","pressStyle","scale","pressKnobProps","role","onPress1","children","position","sources","alt","inset","borderRadius","top","right","zIndex","circular","chromeless","minWidth","sizeToken","minHeight","backgroundColor","col","active","icon","size","weight","name","panelPadding","alignItems","heading","fontWeight","fontSize","numberOfLines","color","flexShrink","body","length","flexWrap","map","badge","label","value"],"sources":["../../../src/list/RecordCard.native.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Card","Text","XStack","YStack","Button","transitionProps","useResolvedKnobs","HeartIcon","useTranslation","useTheme","FacetBadge","ImageWell","RecordCard","param","title","subtitle","code","images","tint","badges","onPress","favorite","testID","favoriteTestID","_this","t","knobProps","elevation","elevationState","component","theme","handleToggleFavorite","handleToggleFavorite2","event","_event_stopPropagation","stopPropagation","call","toggle","media","position","children","sources","alt","inset","borderRadius","top","right","zIndex","circular","chromeless","minWidth","sizeToken","minHeight","motion","control","backgroundColor","pressStyle","scale","col","active","icon","size","weight","color","red9","color11","val","name","pressKnobProps","role","onPress1","gap","alignItems","heading","fontWeight","fontSize","numberOfLines","flexShrink","body","length","flexWrap","map","badge","label","value"],"sources":["../../../src/list/RecordCard.native.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/list/ShufflePanel.mjs

@@ -1,10 +1,9 @@
-import { Button, Wheel, XStack, YStack } from "@multiplatform.one/components";
+import { Button, Tooltip, Wheel, XStack, YStack, useImageGridGeometry } from "@multiplatform.one/components";
 import { useResolvedKnobs } from "@multiplatform.one/theme";
-import { ArrowCounterClockwiseIcon, ArrowRightIcon } from "@phosphor-icons/react";
+import { ArrowRightIcon, ShuffleIcon } from "@phosphor-icons/react";
 import { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { jsx, jsxs } from "react/jsx-runtime";
-const pickWidth = "$12";
 function randomOtherIndex(current, length) {
   if (length < 2) return Math.max(0, current);
   const offset = 1 + Math.floor(Math.random() * (length - 1));
@@ -17,6 +16,7 @@ function ShufflePanel({
   itemLabel,
   renderPick,
   onGo,
+  grid,
   testID
 }) {
   const {
@@ -25,6 +25,10 @@ function ShufflePanel({
   const {
     knobProps
   } = useResolvedKnobs();
+  const {
+    columns,
+    gutter
+  } = useImageGridGeometry(grid);
   const named = useMemo(() => rows.filter(row => row.name), [rows]);
   const items = useMemo(() => named.map(row => ({
     value: row.name,
@@ -37,49 +41,66 @@ function ShufflePanel({
     const current = named.findIndex(row => row.name === pick.name);
     setSelected(named[randomOtherIndex(current, named.length)]?.name ?? "");
   };
+  const pickLabel = itemLabel(pick);
+  const tracks = Math.max(2, columns);
   return /* @__PURE__ */jsxs(XStack, {
     id,
     role: "region",
     "aria-label": label,
-    ...knobProps.surface,
-    ...knobProps.borderRadius,
-    ...knobProps.panelPadding,
-    ...knobProps.gap,
+    gap: gutter,
     alignItems: "center",
-    flexWrap: "wrap",
     testID,
-    children: [/* @__PURE__ */jsx(Wheel, {
-      items,
-      value: pick.name,
-      onChange: next => setSelected(String(next)),
-      visibleItems: 3,
-      loop: true,
-      "aria-label": label
-    }), /* @__PURE__ */jsx(YStack, {
-      width: pickWidth,
-      flexShrink: 0,
-      children: renderPick(pick)
-    }), /* @__PURE__ */jsxs(XStack, {
-      ...knobProps.gap,
+    children: [/* @__PURE__ */jsxs(YStack, {
+      flexGrow: tracks - 1,
+      flexShrink: 1,
+      flexBasis: gutter * (tracks - 2),
+      minWidth: 0,
       alignItems: "center",
-      flexShrink: 0,
-      children: [/* @__PURE__ */jsx(Button, {
-        outlined: true,
-        onPress: spin,
-        icon: /* @__PURE__ */jsx(ArrowCounterClockwiseIcon, {
-          size: 16
-        }),
-        testID: testID ? `${testID}-spin` : void 0,
-        children: t("Spin")
-      }), /* @__PURE__ */jsx(Button, {
-        theme: "accent",
-        onPress: () => onGo(pick),
-        iconAfter: /* @__PURE__ */jsx(ArrowRightIcon, {
-          size: 16
-        }),
-        testID: testID ? `${testID}-go` : void 0,
-        children: t("Go")
+      ...knobProps.gap,
+      children: [/* @__PURE__ */jsx(Wheel, {
+        items,
+        value: pick.name,
+        onChange: next => setSelected(String(next)),
+        visibleItems: 3,
+        loop: true,
+        "aria-label": label
+      }), /* @__PURE__ */jsxs(XStack, {
+        alignItems: "center",
+        gap: "$2",
+        children: [/* @__PURE__ */jsx(Tooltip, {
+          content: t("Shuffle"),
+          children: /* @__PURE__ */jsx(Button, {
+            chromeless: true,
+            accentInk: true,
+            circular: true,
+            icon: ShuffleIcon,
+            "aria-label": t("Shuffle"),
+            onPress: spin,
+            testID: testID ? `${testID}-spin` : void 0
+          })
+        }), /* @__PURE__ */jsx(Tooltip, {
+          content: t("Open {{name}}", {
+            name: pickLabel
+          }),
+          children: /* @__PURE__ */jsx(Button, {
+            chromeless: true,
+            accentInk: true,
+            circular: true,
+            icon: ArrowRightIcon,
+            "aria-label": t("Open {{name}}", {
+              name: pickLabel
+            }),
+            onPress: () => onGo(pick),
+            testID: testID ? `${testID}-go` : void 0
+          })
+        })]
       })]
+    }), /* @__PURE__ */jsx(YStack, {
+      flexGrow: 1,
+      flexShrink: 1,
+      flexBasis: 0,
+      minWidth: 0,
+      children: renderPick(pick)
     })]
   });
 }

package/dist/esm/list/ShufflePanel.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["Button","Wheel","XStack","YStack","useResolvedKnobs","ArrowCounterClockwiseIcon","ArrowRightIcon","useMemo","useState","useTranslation","jsx","jsxs","pickWidth","randomOtherIndex","current","length","Math","max","offset","floor","random","ShufflePanel","id","label","rows","itemLabel","renderPick","onGo","testID","t","knobProps","named","filter","row","name","items","map","value","selected","setSelected","pick","find","spin","findIndex","role","surface","borderRadius","panelPadding","gap","alignItems","flexWrap","children","onChange","next","String","visibleItems","loop","width","flexShrink","outlined","onPress","icon","size","theme","iconAfter"],"sources":["../../../src/list/ShufflePanel.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["Button","Tooltip","Wheel","XStack","YStack","useImageGridGeometry","useResolvedKnobs","ArrowRightIcon","ShuffleIcon","useMemo","useState","useTranslation","jsx","jsxs","randomOtherIndex","current","length","Math","max","offset","floor","random","ShufflePanel","id","label","rows","itemLabel","renderPick","onGo","grid","testID","t","knobProps","columns","gutter","named","filter","row","name","items","map","value","selected","setSelected","pick","find","spin","findIndex","pickLabel","tracks","role","gap","alignItems","children","flexGrow","flexShrink","flexBasis","minWidth","onChange","next","String","visibleItems","loop","content","chromeless","accentInk","circular","icon","onPress"],"sources":["../../../src/list/ShufflePanel.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/list/ShufflePanel.native.js

@@ -1,10 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Wheel, XStack, YStack } from "@multiplatform.one/components";
+import { Button, Tooltip, Wheel, XStack, YStack, useImageGridGeometry } from "@multiplatform.one/components";
 import { useResolvedKnobs } from "@multiplatform.one/theme";
-import { ArrowCounterClockwiseIcon, ArrowRightIcon } from "@phosphor-icons/react";
+import { ArrowRightIcon, ShuffleIcon } from "@phosphor-icons/react";
 import { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
-var pickWidth = "$12";
 function randomOtherIndex(current, length) {
   if (length < 2) return Math.max(0, current);
   var offset = 1 + Math.floor(Math.random() * (length - 1));
@@ -18,6 +17,7 @@ function ShufflePanel(param) {
     itemLabel,
     renderPick,
     onGo,
+    grid,
     testID
   } = param;
   var _named_find;
@@ -27,6 +27,10 @@ function ShufflePanel(param) {
   var {
     knobProps
   } = useResolvedKnobs();
+  var {
+    columns,
+    gutter
+  } = useImageGridGeometry(grid);
   var named = useMemo(function () {
     return rows.filter(function (row) {
       return row.name;
@@ -57,53 +61,74 @@ function ShufflePanel(param) {
     });
     setSelected((_ref = (_named_randomOtherIndex = named[randomOtherIndex(current, named.length)]) === null || _named_randomOtherIndex === void 0 ? void 0 : _named_randomOtherIndex.name) !== null && _ref !== void 0 ? _ref : "");
   };
+  var pickLabel = itemLabel(pick);
+  var tracks = Math.max(2, columns);
   return /* @__PURE__ */_jsxs(XStack, {
     id,
     role: "region",
     "aria-label": label,
-    ...knobProps.surface,
-    ...knobProps.borderRadius,
-    ...knobProps.panelPadding,
-    ...knobProps.gap,
+    gap: gutter,
     alignItems: "center",
-    flexWrap: "wrap",
     testID,
-    children: [/* @__PURE__ */_jsx(Wheel, {
-      items,
-      value: pick.name,
-      onChange: function onChange(next) {
-        return setSelected(String(next));
-      },
-      visibleItems: 3,
-      loop: true,
-      "aria-label": label
-    }), /* @__PURE__ */_jsx(YStack, {
-      width: pickWidth,
-      flexShrink: 0,
-      children: renderPick(pick)
-    }), /* @__PURE__ */_jsxs(XStack, {
-      ...knobProps.gap,
+    children: [
+    /* The controls span every track but the pick's, with the gutters
+    between them, so the pick lands on one tile's exact width. */
+    /* @__PURE__ */
+    _jsxs(YStack, {
+      flexGrow: tracks - 1,
+      flexShrink: 1,
+      flexBasis: gutter * (tracks - 2),
+      minWidth: 0,
       alignItems: "center",
-      flexShrink: 0,
-      children: [/* @__PURE__ */_jsx(Button, {
-        outlined: true,
-        onPress: spin,
-        icon: /* @__PURE__ */_jsx(ArrowCounterClockwiseIcon, {
-          size: 16
-        }),
-        testID: testID ? `${testID}-spin` : void 0,
-        children: t("Spin")
-      }), /* @__PURE__ */_jsx(Button, {
-        theme: "accent",
-        onPress: function onPress() {
-          return onGo(pick);
+      ...knobProps.gap,
+      children: [/* @__PURE__ */_jsx(Wheel, {
+        items,
+        value: pick.name,
+        onChange: function onChange(next) {
+          return setSelected(String(next));
         },
-        iconAfter: /* @__PURE__ */_jsx(ArrowRightIcon, {
-          size: 16
-        }),
-        testID: testID ? `${testID}-go` : void 0,
-        children: t("Go")
+        visibleItems: 3,
+        loop: true,
+        "aria-label": label
+      }), /* @__PURE__ */_jsxs(XStack, {
+        alignItems: "center",
+        gap: "$2",
+        children: [/* @__PURE__ */_jsx(Tooltip, {
+          content: t("Shuffle"),
+          children: /* @__PURE__ */_jsx(Button, {
+            chromeless: true,
+            accentInk: true,
+            circular: true,
+            icon: ShuffleIcon,
+            "aria-label": t("Shuffle"),
+            onPress: spin,
+            testID: testID ? `${testID}-spin` : void 0
+          })
+        }), /* @__PURE__ */_jsx(Tooltip, {
+          content: t("Open {{name}}", {
+            name: pickLabel
+          }),
+          children: /* @__PURE__ */_jsx(Button, {
+            chromeless: true,
+            accentInk: true,
+            circular: true,
+            icon: ArrowRightIcon,
+            "aria-label": t("Open {{name}}", {
+              name: pickLabel
+            }),
+            onPress: function onPress() {
+              return onGo(pick);
+            },
+            testID: testID ? `${testID}-go` : void 0
+          })
+        })]
       })]
+    }), /* @__PURE__ */_jsx(YStack, {
+      flexGrow: 1,
+      flexShrink: 1,
+      flexBasis: 0,
+      minWidth: 0,
+      children: renderPick(pick)
     })]
   });
 }

package/dist/esm/list/ShufflePanel.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Button","Wheel","XStack","YStack","useResolvedKnobs","ArrowCounterClockwiseIcon","ArrowRightIcon","useMemo","useState","useTranslation","pickWidth","randomOtherIndex","current","length","Math","max","offset","floor","random","ShufflePanel","param","id","label","rows","itemLabel","renderPick","onGo","testID","_named_find","t","knobProps","named","filter","row","name","items","map","value","selected","setSelected","_ref","_named_randomOtherIndex","pick","find","spin","spin2","findIndex","role","surface","borderRadius","panelPadding","gap","alignItems","flexWrap","children","onChange","next","String","visibleItems","loop","width","flexShrink","outlined","onPress","icon","size"],"sources":["../../../src/list/ShufflePanel.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Button","Tooltip","Wheel","XStack","YStack","useImageGridGeometry","useResolvedKnobs","ArrowRightIcon","ShuffleIcon","useMemo","useState","useTranslation","randomOtherIndex","current","length","Math","max","offset","floor","random","ShufflePanel","param","id","label","rows","itemLabel","renderPick","onGo","grid","testID","_named_find","t","knobProps","columns","gutter","named","filter","row","name","items","map","value","selected","setSelected","_ref","_named_randomOtherIndex","pick","find","spin","spin2","findIndex","pickLabel","tracks","role","gap","alignItems","children","flexGrow","flexShrink","flexBasis","minWidth","onChange","next","String","visibleItems","loop","content","chromeless","accentInk","circular","icon","onPress"],"sources":["../../../src/list/ShufflePanel.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}