@multiplatform.one/frappe-ui 7.23.2 → 7.24.0

package/dist/cjs/record/RecordBars.native.js

@@ -0,0 +1,225 @@
+"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 RecordBars_exports = {};
+__export(RecordBars_exports, {
+  RecordBars: () => RecordBars
+});
+module.exports = __toCommonJS(RecordBars_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@multiplatform.one/components");
+var import_theme = require("@multiplatform.one/theme");
+var import_react_i18next = require("react-i18next");
+var import_recordData = require("./recordData.native.js");
+var chartHeight = 220;
+var chartTicks = 4;
+function FixedScaleBars(param) {
+  var {
+    data,
+    max,
+    label,
+    testID
+  } = param;
+  var {
+    palette,
+    labelFontSize
+  } = (0, import_components.useChartTheme)();
+  var fills = data.map(function () {
+    return palette.single;
+  });
+  var domain = [0, max];
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.ChartSurface, {
+    label,
+    height: chartHeight,
+    testID,
+    children: function children(size) {
+      var marginScale = (0, import_components.createLinearScale)({
+        domain,
+        range: [0, 1],
+        nice: false
+      });
+      var tickLabels = (0, import_components.getLinearTicks)(marginScale, chartTicks).map(function (value) {
+        return (0, import_components.formatChartValue)(value);
+      });
+      var widestTick = Math.max(0, ...tickLabels.map(function (tick) {
+        return (0, import_components.approximateTextWidth)(tick, labelFontSize);
+      }));
+      var top = Math.ceil(labelFontSize / 2) + 2;
+      var right = 4;
+      var bottom = 4 + 3 + Math.ceil(labelFontSize * 1.15);
+      var left = Math.ceil(widestTick) + 4 + 3 + 2;
+      var plot = {
+        x: left,
+        y: top,
+        width: Math.max(0, size.width - left - right),
+        height: Math.max(0, size.height - top - bottom)
+      };
+      if (plot.width <= 0 || plot.height <= 0 || data.length === 0) return null;
+      var xScale = (0, import_components.createBandScale)({
+        domain: data.map(function (datum) {
+          return datum.label;
+        }),
+        range: [plot.x, plot.x + plot.width]
+      });
+      var yScale = (0, import_components.createLinearScale)({
+        domain,
+        range: [plot.y + plot.height, plot.y],
+        nice: false
+      });
+      return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.YAxis, {
+          plot,
+          scale: yScale,
+          ticks: chartTicks,
+          tickFormat: function tickFormat(value) {
+            return (0, import_components.formatChartValue)(value);
+          }
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.BarSeries, {
+          data,
+          xScale,
+          yScale,
+          plot,
+          fills
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.XAxis, {
+          plot,
+          scale: xScale
+        })]
+      });
+    }
+  });
+}
+function RecordBars(param) {
+  var {
+    rows,
+    section,
+    testID
+  } = param;
+  var _section_totalLabel;
+  var {
+    t
+  } = (0, import_react_i18next.useTranslation)();
+  var {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  var {
+    knobProps: nested
+  } = (0, import_theme.useResolvedKnobs)({
+    compact: true
+  });
+  var {
+    bars,
+    total
+  } = (0, import_recordData.childBars)(rows, section);
+  var name = function name2(key) {
+    var _ref;
+    var _section_barLabel;
+    return (_ref = (_section_barLabel = section.barLabel) === null || _section_barLabel === void 0 ? void 0 : _section_barLabel.call(section, key)) !== null && _ref !== void 0 ? _ref : key;
+  };
+  var data = bars.map(function (bar) {
+    return {
+      label: name(bar.key),
+      value: bar.value
+    };
+  });
+  if (bars.length === 0) {
+    var _section_empty;
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+      ...nested.label,
+      ...nested.body,
+      color: "$color10",
+      children: (_section_empty = section.empty) !== null && _section_empty !== void 0 ? _section_empty : t("None yet")
+    });
+  }
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.YStack, {
+    ...knobProps.gapLg,
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.XStack, {
+      ...knobProps.gap,
+      alignItems: "baseline",
+      justifyContent: "space-between",
+      flexWrap: "wrap",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.YStack, {
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+          ...nested.label,
+          color: "$color10",
+          textTransform: "uppercase",
+          letterSpacing: 1,
+          children: (_section_totalLabel = section.totalLabel) !== null && _section_totalLabel !== void 0 ? _section_totalLabel : t("Total")
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+          fontSize: "$10",
+          fontWeight: "700",
+          children: total
+        })]
+      }), section.description ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+        ...nested.label,
+        color: "$color10",
+        flexShrink: 1,
+        maxWidth: (0, import_theme.sizeRecipeEscape)(420, "chart caption: a readable measure beside the total"),
+        children: section.description
+      }) : null]
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(FixedScaleBars, {
+      data,
+      max: section.max,
+      testID,
+      label: [(0, import_components.describeChart)({
+        typeLabel: t("Bar chart"),
+        title: section.title,
+        data
+      }), t("Values on a fixed 0 to {{max}} scale.", {
+        max: section.max
+      })].join(" ")
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.XStack, {
+      ...nested.gap,
+      flexWrap: "wrap",
+      children: bars.map(function (bar) {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Tooltip, {
+          content: t("{{name}}: {{value}}", {
+            name: name(bar.key),
+            value: bar.value
+          }),
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.XStack, {
+            ...nested.borderRadius,
+            backgroundColor: "$color2",
+            borderWidth: 0,
+            paddingHorizontal: "$2",
+            paddingVertical: "$0.5",
+            gap: "$1",
+            alignItems: "baseline",
+            cursor: "help",
+            children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+              ...nested.label,
+              ...nested.body,
+              color: "$color10",
+              children: name(bar.key)
+            }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+              ...nested.label,
+              fontWeight: "700",
+              children: bar.value
+            })]
+          })
+        }, bar.key);
+      })
+    })]
+  });
+}
+//# sourceMappingURL=RecordBars.native.js.map

package/dist/cjs/record/RecordBars.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","RecordBars_exports","__export","RecordBars","module","exports","import_jsx_runtime","require","import_components","import_theme","import_react_i18next","import_recordData","chartHeight","chartTicks","FixedScaleBars","param","data","max","label","testID","palette","labelFontSize","useChartTheme","fills","map","single","domain","jsx","ChartSurface","height","children","size","marginScale","createLinearScale","range","nice","tickLabels","getLinearTicks","formatChartValue","widestTick","Math","tick","approximateTextWidth","top","ceil","right","bottom","left","plot","x","y","width","length","xScale","createBandScale","datum","yScale","jsxs","Fragment","YAxis","scale","ticks","tickFormat","BarSeries","XAxis","rows","section","_section_totalLabel","t","useTranslation","knobProps","useResolvedKnobs","nested","compact","bars","total","childBars","name","name2","key","_ref","_section_barLabel","barLabel","call","bar","_section_empty","Text","body","color","empty","YStack","gapLg","XStack","gap","alignItems","justifyContent","flexWrap","textTransform","letterSpacing","totalLabel"],"sources":["../../../src/record/RecordBars.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/cjs/record/RecordGallery.cjs

@@ -0,0 +1,67 @@
+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 RecordGallery_exports = {};
+__export(RecordGallery_exports, {
+  RecordGallery: () => RecordGallery
+});
+module.exports = __toCommonJS(RecordGallery_exports);
+var import_components = require("@multiplatform.one/components");
+var import_react = require("react");
+var import_ImageWell = require("../list/ImageWell.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+function RecordGallery({
+  images,
+  slides = [],
+  alt,
+  tints
+}) {
+  const [width, setWidth] = (0, import_react.useState)(0);
+  const first = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ImageWell.ImageWell, {
+    sources: images,
+    alt,
+    tints,
+    inset: 0.08
+  });
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.YStack, {
+    onLayout: event => setWidth(Math.round(event.nativeEvent.layout.width)),
+    width: "100%",
+    children: width > 0 && slides.length > 0 ? /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.Carousel, {
+      gap: 0,
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ImageWell.ImageWell, {
+        sources: images,
+        alt,
+        tints,
+        inset: 0.08,
+        width
+      }), slides.map(slide => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ImageWell.ImageWell, {
+        sources: [slide.src],
+        alt: `${alt}, ${slide.label}`,
+        pixelated: slide.pixelated,
+        inset: 0.14,
+        backgroundColor: "$color2",
+        width,
+        lazy: true
+      }, slide.src))]
+    }) : first
+  });
+}

package/dist/cjs/record/RecordGallery.native.js

@@ -0,0 +1,75 @@
+"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 RecordGallery_exports = {};
+__export(RecordGallery_exports, {
+  RecordGallery: () => RecordGallery
+});
+module.exports = __toCommonJS(RecordGallery_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@multiplatform.one/components");
+var import_react = require("react");
+var import_ImageWell = require("../list/ImageWell.native.js");
+function RecordGallery(param) {
+  var {
+    images,
+    slides = [],
+    alt,
+    tints
+  } = param;
+  var [width, setWidth] = (0, import_react.useState)(0);
+  var first = /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ImageWell.ImageWell, {
+    sources: images,
+    alt,
+    tints,
+    inset: 0.08
+  });
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.YStack, {
+    onLayout: function onLayout(event) {
+      return setWidth(Math.round(event.nativeEvent.layout.width));
+    },
+    width: "100%",
+    children: width > 0 && slides.length > 0 ? /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.Carousel, {
+      gap: 0,
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ImageWell.ImageWell, {
+        sources: images,
+        alt,
+        tints,
+        inset: 0.08,
+        width
+      }), slides.map(function (slide) {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_ImageWell.ImageWell, {
+          sources: [slide.src],
+          alt: `${alt}, ${slide.label}`,
+          pixelated: slide.pixelated,
+          inset: 0.14,
+          backgroundColor: "$color2",
+          width,
+          lazy: true
+        }, slide.src);
+      })]
+    }) : first
+  });
+}
+//# sourceMappingURL=RecordGallery.native.js.map

package/dist/cjs/record/RecordGallery.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","RecordGallery_exports","__export","RecordGallery","module","exports","import_jsx_runtime","require","import_components","import_react","import_ImageWell","param","images","slides","alt","tints","width","setWidth","useState","first","jsx","ImageWell","sources","inset","YStack","onLayout","event","Math","round","nativeEvent","layout","children","length","jsxs","Carousel","gap"],"sources":["../../../src/record/RecordGallery.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,qBAAA;AAAAC,QAAA,CAAAD,qBAAA;EAAAE,aAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAT,YAAiC,CAAAK,qBAAA;AACjC,IAAAK,kBAAyB,GAAAC,OAAA;AACzB,IAAAC,iBAAA,GAA0BD,OAAA;AAoBV,IAAAE,YAAA,GAAAF,OAAA;AAFT,IAAAG,gBAAS,GAAcH,OAAE,8BAAqB,CAAK;AACxD,SAAOJ,aAAOA,CAAAQ,KAAQ;EACtB;IAAMC,MAAA;IAAQC,MAAA;IAAAC,GAAA;IAAAC;EAAA,IAAAJ,KAAA;EACd,KAAAK,KACE,EAAAC,QAAA,QAAAR,YAAA,CAAAS,QAAA,EAAC;EAGK,IAAAC,KAAA,sBAAAb,kBAAC,CAAAc,GAAA,EAAAV,gBAAA,CAAAW,SAAU;IACVC,OAAO,EAAAV,MAAK;IACXE,GAAC;IAAAC,KAAA;IAAAQ,KAEC;EAAmB;EACQ,OAC3B,eAAiB,IAAAjB,kBAAA,CAAAc,GAAA,EAAAZ,iBAAA,CAAAgB,MAAA;IAAAC,QACjB,WAAOA,SAAAC,KAAA;MAAA,OACPT,QAAA,CAAAU,IAAgB,CAAAC,KAAA,CAAAF,KAAA,CAAAG,WAAA,CAAAC,MAAA,CAAAd,KAAA;IAAA;IAChBA,KACA,QAAI;IAAAe,QAAA,EAAAf,KAAA,QAAAH,MAAA,CAAAmB,MAAA,0BAAA1B,kBAAA,CAAA2B,IAAA,EAAAzB,iBAAA,CAAA0B,QAAA;MAPCC,GAAA,GAAM;MASdJ,QAAA,GACH,eAIJ,IAAAzB,kBAAA,CAAAc,GAAA,EAAAV,gBAAA,CAAAW,SAAA;QAEJC,OAAA,EAAAV,MAAA","ignoreList":[]}

package/dist/cjs/record/RecordHero.cjs

@@ -0,0 +1,239 @@
+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 RecordHero_exports = {};
+__export(RecordHero_exports, {
+  RecordBreadcrumbBone: () => RecordBreadcrumbBone,
+  RecordHeroArtColumn: () => RecordHeroArtColumn,
+  RecordHeroFrame: () => RecordHeroFrame,
+  RecordHeroIdentityColumn: () => RecordHeroIdentityColumn,
+  RecordHeroRow: () => RecordHeroRow,
+  RecordSkeleton: () => RecordSkeleton,
+  RecordVitals: () => RecordVitals,
+  recordHeroArtBasis: () => recordHeroArtBasis,
+  recordHeroArtMax: () => recordHeroArtMax,
+  recordHeroIdentityBasis: () => recordHeroIdentityBasis
+});
+module.exports = __toCommonJS(RecordHero_exports);
+var import_components = require("@multiplatform.one/components");
+var import_forms = require("@multiplatform.one/forms");
+var import_theme = require("@multiplatform.one/theme");
+var import_react_i18next = require("react-i18next");
+var import_jsx_runtime = require("react/jsx-runtime");
+const recordHeroArtBasis = 380;
+const recordHeroArtMax = 480;
+const recordHeroIdentityBasis = 320;
+function RecordHeroFrame({
+  tint,
+  children,
+  ...rest
+}) {
+  const {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.YStack, {
+    ...knobProps.borderRadius,
+    ...knobProps.panelPadding,
+    backgroundColor: tint ? `$${tint}2` : "$color3",
+    width: "100%",
+    ...rest,
+    children
+  });
+}
+function RecordHeroRow({
+  children
+}) {
+  const {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.XStack, {
+    ...knobProps.gapLg,
+    flexWrap: "wrap",
+    alignItems: "flex-start",
+    children
+  });
+}
+function RecordHeroArtColumn({
+  children,
+  ...rest
+}) {
+  const {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.YStack, {
+    flexGrow: 1,
+    flexBasis: recordHeroArtBasis,
+    maxWidth: recordHeroArtMax,
+    minWidth: 0,
+    ...knobProps.gap,
+    ...rest,
+    children
+  });
+}
+function RecordHeroIdentityColumn({
+  children,
+  ...rest
+}) {
+  const {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.YStack, {
+    flexGrow: 999,
+    flexBasis: recordHeroIdentityBasis,
+    minWidth: 0,
+    ...knobProps.gap,
+    ...rest,
+    children
+  });
+}
+function RecordVitals({
+  tiles
+}) {
+  const {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)({
+    compact: true
+  });
+  if (tiles.length === 0) return null;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.XStack, {
+    ...knobProps.gap,
+    flexWrap: "wrap",
+    children: tiles.map(tile => /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.YStack, {
+      ...knobProps.borderRadius,
+      ...knobProps.panelPadding,
+      backgroundColor: "$color2",
+      borderWidth: 0,
+      flexGrow: 1,
+      flexBasis: 140,
+      gap: "$1",
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+        ...knobProps.label,
+        ...knobProps.body,
+        color: "$color10",
+        children: tile.label
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+        fontSize: "$5",
+        fontWeight: "700",
+        children: tile.value
+      }), tile.percent === void 0 ? null : /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_forms.Progress, {
+        value: tile.percent,
+        max: 100,
+        size: "$2",
+        intent: "accent",
+        progressProps: {
+          "aria-label": tile.label
+        }
+      })]
+    }, tile.id))
+  });
+}
+const bone = px => (0, import_theme.sizeRecipeEscape)(px, "loading bones sized to the record page they stand in for");
+function RecordBreadcrumbBone() {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.XStack, {
+    alignItems: "center",
+    minHeight: bone(20),
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+      width: bone(180),
+      height: bone(14)
+    })
+  });
+}
+function RecordSkeleton({
+  testID
+}) {
+  const {
+    t
+  } = (0, import_react_i18next.useTranslation)();
+  const {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.YStack, {
+    ...knobProps.gapLg,
+    testID,
+    "data-async-skeleton": "record",
+    "aria-busy": true,
+    "aria-label": t("Loading"),
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(RecordHeroFrame, {
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(RecordHeroRow, {
+        children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(RecordHeroArtColumn, {
+          ...{
+            "data-skeleton-part": "art"
+          },
+          children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+            variant: "rounded",
+            width: "100%",
+            aspectRatio: 1
+          })
+        }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(RecordHeroIdentityColumn, {
+          ...{
+            "data-skeleton-part": "identity"
+          },
+          children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+            width: bone(72),
+            height: bone(16)
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+            width: bone(280),
+            height: bone(56)
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+            width: bone(160),
+            height: bone(18)
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.XStack, {
+            gap: "$1.5",
+            children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+              variant: "rounded",
+              width: bone(64),
+              height: bone(22)
+            }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+              variant: "rounded",
+              width: bone(64),
+              height: bone(22)
+            })]
+          }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.XStack, {
+            ...knobProps.gap,
+            flexWrap: "wrap",
+            children: [0, 1, 2].map(tile => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+              variant: "rounded",
+              flexGrow: 1,
+              flexBasis: 140,
+              height: bone(64)
+            }, tile))
+          })]
+        })]
+      })
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_components.YStack, {
+      ...knobProps.gap,
+      children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.XStack, {
+        ...knobProps.gap,
+        ...{
+          "data-skeleton-part": "tabs"
+        },
+        children: [104, 88, 96].map((width, tab) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+          variant: "rounded",
+          width: bone(width),
+          height: bone(44)
+        }, tab))
+      }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton.Text, {
+        lines: 4
+      })]
+    })]
+  });
+}