@multiplatform.one/frappe-ui 7.23.1 → 7.24.0

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

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

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

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

package/dist/esm/record/RecordGallery.mjs

@@ -0,0 +1,42 @@
+import { Carousel, YStack } from "@multiplatform.one/components";
+import { useState } from "react";
+import { ImageWell } from "../list/ImageWell.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+function RecordGallery({
+  images,
+  slides = [],
+  alt,
+  tints
+}) {
+  const [width, setWidth] = useState(0);
+  const first = /* @__PURE__ */jsx(ImageWell, {
+    sources: images,
+    alt,
+    tints,
+    inset: 0.08
+  });
+  return /* @__PURE__ */jsx(YStack, {
+    onLayout: event => setWidth(Math.round(event.nativeEvent.layout.width)),
+    width: "100%",
+    children: width > 0 && slides.length > 0 ? /* @__PURE__ */jsxs(Carousel, {
+      gap: 0,
+      children: [/* @__PURE__ */jsx(ImageWell, {
+        sources: images,
+        alt,
+        tints,
+        inset: 0.08,
+        width
+      }), slides.map(slide => /* @__PURE__ */jsx(ImageWell, {
+        sources: [slide.src],
+        alt: `${alt}, ${slide.label}`,
+        pixelated: slide.pixelated,
+        inset: 0.14,
+        backgroundColor: "$color2",
+        width,
+        lazy: true
+      }, slide.src))]
+    }) : first
+  });
+}
+export { RecordGallery };
+//# sourceMappingURL=RecordGallery.mjs.map

package/dist/esm/record/RecordGallery.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["Carousel","YStack","useState","ImageWell","jsx","jsxs","RecordGallery","images","slides","alt","tints","width","setWidth","first","sources","inset","onLayout","event","Math","round","nativeEvent","layout","children","length","gap","map","slide","src","label","pixelated","backgroundColor","lazy"],"sources":["../../../src/record/RecordGallery.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,QAAA,EAAUC,MAAA,QAAc;AACjC,SAASC,QAAA,QAAgB;AACzB,SAASC,SAAA,QAAiB;AAoBV,SAAAC,GAAA,EAIRC,IAAA,QAJQ;AAFT,SAASC,cAAc;EAAEC,MAAA;EAAQC,MAAA,GAAS,EAAC;EAAGC,GAAA;EAAKC;AAAM,GAAuB;EACrF,MAAM,CAACC,KAAA,EAAOC,QAAQ,IAAIV,QAAA,CAAS,CAAC;EACpC,MAAMW,KAAA,GAAQ,eAAAT,GAAA,CAACD,SAAA;IAAUW,OAAA,EAASP,MAAA;IAAQE,GAAA;IAAUC,KAAA;IAAcK,KAAA,EAAO;EAAA,CAAM;EAC/E,OACE,eAAAX,GAAA,CAACH,MAAA;IAAOe,QAAA,EAAWC,KAAA,IAAUL,QAAA,CAASM,IAAA,CAAKC,KAAA,CAAMF,KAAA,CAAMG,WAAA,CAAYC,MAAA,CAAOV,KAAK,CAAC;IAAGA,KAAA,EAAM;IACtFW,QAAA,EAAAX,KAAA,GAAQ,KAAKH,MAAA,CAAOe,MAAA,GAAS,IAC5B,eAAAlB,IAAA,CAACL,QAAA;MAASwB,GAAA,EAAK;MACbF,QAAA,kBAAAlB,GAAA,CAACD,SAAA;QAAUW,OAAA,EAASP,MAAA;QAAQE,GAAA;QAAUC,KAAA;QAAcK,KAAA,EAAO;QAAMJ;MAAA,CAAc,GAC9EH,MAAA,CAAOiB,GAAA,CAAKC,KAAA,IACX,eAAAtB,GAAA,CAACD,SAAA;QAECW,OAAA,EAAS,CAACY,KAAA,CAAMC,GAAG;QACnBlB,GAAA,EAAK,GAAGA,GAAG,KAAKiB,KAAA,CAAME,KAAK;QAC3BC,SAAA,EAAWH,KAAA,CAAMG,SAAA;QACjBd,KAAA,EAAO;QACPe,eAAA,EAAgB;QAChBnB,KAAA;QACAoB,IAAA,EAAI;MAAA,GAPCL,KAAA,CAAMC,GAQb,CACD;IAAA,CACH,IAEAd;EAAA,CAEJ;AAEJ","ignoreList":[]}

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

@@ -0,0 +1,47 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Carousel, YStack } from "@multiplatform.one/components";
+import { useState } from "react";
+import { ImageWell } from "../list/ImageWell.native.js";
+function RecordGallery(param) {
+  var {
+    images,
+    slides = [],
+    alt,
+    tints
+  } = param;
+  var [width, setWidth] = useState(0);
+  var first = /* @__PURE__ */_jsx(ImageWell, {
+    sources: images,
+    alt,
+    tints,
+    inset: 0.08
+  });
+  return /* @__PURE__ */_jsx(YStack, {
+    onLayout: function onLayout(event) {
+      return setWidth(Math.round(event.nativeEvent.layout.width));
+    },
+    width: "100%",
+    children: width > 0 && slides.length > 0 ? /* @__PURE__ */_jsxs(Carousel, {
+      gap: 0,
+      children: [/* @__PURE__ */_jsx(ImageWell, {
+        sources: images,
+        alt,
+        tints,
+        inset: 0.08,
+        width
+      }), slides.map(function (slide) {
+        return /* @__PURE__ */_jsx(ImageWell, {
+          sources: [slide.src],
+          alt: `${alt}, ${slide.label}`,
+          pixelated: slide.pixelated,
+          inset: 0.14,
+          backgroundColor: "$color2",
+          width,
+          lazy: true
+        }, slide.src);
+      })]
+    }) : first
+  });
+}
+export { RecordGallery };
+//# sourceMappingURL=RecordGallery.native.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","Carousel","YStack","useState","ImageWell","RecordGallery","param","images","slides","alt","tints","width","setWidth","first","sources","inset","onLayout","event","Math","round","nativeEvent","layout","children","length","gap"],"sources":["../../../src/record/RecordGallery.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,GAAA,IAAAC,IAAU,EAAAC,IAAA,IAAAC,KAAc;AACjC,SAASC,QAAA,EAAAC,MAAgB;AACzB,SAASC,QAAA,eAAiB;AAoBV,SAAAC,SAIR,QAJQ;AAFT,SAASC,cAAcC,KAAE;EAC9B;IAAMC,MAAC;IAAOC,MAAA,GAAQ;IAAIC,GAAA;IAAAC;EAAU,IAAAJ,KAAA;EACpC,KAAAK,KAAM,EAAAC,QAAQ,IAAAT,QAAA,EAAC;EACf,IAAAU,KACE,kBAACf,IAAA,CAAAM,SAAO;IAGFU,OAAA,EAAAP,MAAA;IACCE,GAAA;IACCC,KAAC;IAAAK,KAAA;EAAA;EAEoB,OACnB,eAAgBjB,IAAA,CAAMI,MAAK;IAAAc,QAC3B,WAAWA,QAAMA,CAAAC,KAAA;MAAA,OACjBL,QAAO,CAAAM,IAAA,CAAAC,KAAA,CAAAF,KAAA,CAAAG,WAAA,CAAAC,MAAA,CAAAV,KAAA;IAAA;IACSA,KAChB;IAAAW,QACA,EAAIX,KAAA,QAAAH,MAAA,CAAAe,MAAA,sBAAAvB,KAAA,CAAAC,QAAA;MAAAuB,GAAA;MAPCF,QAAM,GASd,eAAAxB,IAAA,CAAAM,SAAA;QAGHU,OAEJ,EAAAP,MAAA;QAEJE,GAAA","ignoreList":[]}

package/dist/esm/record/RecordHero.mjs

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

package/dist/esm/record/RecordHero.mjs.map

@@ -0,0 +1 @@
+{"version":3,"names":["Skeleton","Text","XStack","YStack","Progress","sizeRecipeEscape","useResolvedKnobs","useTranslation","jsx","jsxs","recordHeroArtBasis","recordHeroArtMax","recordHeroIdentityBasis","RecordHeroFrame","tint","children","rest","knobProps","borderRadius","panelPadding","backgroundColor","width","RecordHeroRow","gapLg","flexWrap","alignItems","RecordHeroArtColumn","flexGrow","flexBasis","maxWidth","minWidth","gap","RecordHeroIdentityColumn","RecordVitals","tiles","compact","length","map","tile","borderWidth","label","body","color","fontSize","fontWeight","value","percent","max","size","intent","progressProps","id","bone","px","RecordBreadcrumbBone","minHeight","height","RecordSkeleton","testID","t","variant","aspectRatio","tab","lines"],"sources":["../../../src/record/RecordHero.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,QAAA,EAAUC,IAAA,EAAMC,MAAA,EAAQC,MAAA,QAAgC;AACjE,SAASC,QAAA,QAAgB;AACzB,SAASC,gBAAA,EAAkBC,gBAAA,QAAwB;AAEnD,SAASC,cAAA,QAAsB;AAmB3B,SAAAC,GAAA,EAsEIC,IAAA,QAtEJ;AAbG,MAAMC,kBAAA,GAAqB;AAC3B,MAAMC,gBAAA,GAAmB;AACzB,MAAMC,uBAAA,GAA0B;AAQhC,SAASC,gBAAgB;EAAEC,IAAA;EAAMC,QAAA;EAAU,GAAGC;AAAK,GAAyB;EACjF,MAAM;IAAEC;EAAU,IAAIX,gBAAA,CAAiB;EACvC,OACE,eAAAE,GAAA,CAACL,MAAA;IACE,GAAGc,SAAA,CAAUC,YAAA;IACb,GAAGD,SAAA,CAAUE,YAAA;IACdC,eAAA,EAAiBN,IAAA,GAAQ,IAAIA,IAAI,MAAgB;IACjDO,KAAA,EAAM;IACL,GAAGL,IAAA;IAEHD;EAAA,CACH;AAEJ;AAEO,SAASO,cAAc;EAAEP;AAAS,GAA4B;EACnE,MAAM;IAAEE;EAAU,IAAIX,gBAAA,CAAiB;EACvC,OACE,eAAAE,GAAA,CAACN,MAAA;IAAQ,GAAGe,SAAA,CAAUM,KAAA;IAAOC,QAAA,EAAS;IAAOC,UAAA,EAAW;IACrDV;EAAA,CACH;AAEJ;AAEO,SAASW,oBAAoB;EAAEX,QAAA;EAAU,GAAGC;AAAK,GAA0C;EAChG,MAAM;IAAEC;EAAU,IAAIX,gBAAA,CAAiB;EACvC,OACE,eAAAE,GAAA,CAACL,MAAA;IACCwB,QAAA,EAAU;IACVC,SAAA,EAAWlB,kBAAA;IACXmB,QAAA,EAAUlB,gBAAA;IACVmB,QAAA,EAAU;IACT,GAAGb,SAAA,CAAUc,GAAA;IACb,GAAGf,IAAA;IAEHD;EAAA,CACH;AAEJ;AAEO,SAASiB,yBAAyB;EACvCjB,QAAA;EACA,GAAGC;AACL,GAA0C;EACxC,MAAM;IAAEC;EAAU,IAAIX,gBAAA,CAAiB;EACvC,OACE,eAAAE,GAAA,CAACL,MAAA;IACCwB,QAAA,EAAU;IACVC,SAAA,EAAWhB,uBAAA;IACXkB,QAAA,EAAU;IACT,GAAGb,SAAA,CAAUc,GAAA;IACb,GAAGf,IAAA;IAEHD;EAAA,CACH;AAEJ;AAWO,SAASkB,aAAa;EAAEC;AAAM,GAA0C;EAC7E,MAAM;IAAEjB;EAAU,IAAIX,gBAAA,CAAiB;IAAE6B,OAAA,EAAS;EAAK,CAAC;EACxD,IAAID,KAAA,CAAME,MAAA,KAAW,GAAG,OAAO;EAC/B,OACE,eAAA5B,GAAA,CAACN,MAAA;IAAQ,GAAGe,SAAA,CAAUc,GAAA;IAAKP,QAAA,EAAS;IACjCT,QAAA,EAAAmB,KAAA,CAAMG,GAAA,CAAKC,IAAA,IACV,eAAA7B,IAAA,CAACN,MAAA;MAEE,GAAGc,SAAA,CAAUC,YAAA;MACb,GAAGD,SAAA,CAAUE,YAAA;MACdC,eAAA,EAAgB;MAChBmB,WAAA,EAAa;MACbZ,QAAA,EAAU;MACVC,SAAA,EAAW;MACXG,GAAA,EAAI;MAEJhB,QAAA,kBAAAP,GAAA,CAACP,IAAA;QAAM,GAAGgB,SAAA,CAAUuB,KAAA;QAAQ,GAAGvB,SAAA,CAAUwB,IAAA;QAAMC,KAAA,EAAM;QAClD3B,QAAA,EAAAuB,IAAA,CAAKE;MAAA,CACR,GACA,eAAAhC,GAAA,CAACP,IAAA;QAAK0C,QAAA,EAAS;QAAKC,UAAA,EAAW;QAC5B7B,QAAA,EAAAuB,IAAA,CAAKO;MAAA,CACR,GACCP,IAAA,CAAKQ,OAAA,KAAY,SAAY,OAC5B,eAAAtC,GAAA,CAACJ,QAAA;QACCyC,KAAA,EAAOP,IAAA,CAAKQ,OAAA;QACZC,GAAA,EAAK;QACLC,IAAA,EAAK;QACLC,MAAA,EAAO;QACPC,aAAA,EAAe;UAAE,cAAcZ,IAAA,CAAKE;QAAM;MAAA,CAC5C;IAAA,GAtBGF,IAAA,CAAKa,EAwBZ,CACD;EAAA,CACH;AAEJ;AAEA,MAAMC,IAAA,GAAQC,EAAA,IACZhD,gBAAA,CAAiBgD,EAAA,EAAI,0DAA0D;AAG1E,SAASC,qBAAA,EAAuB;EACrC,OACE,eAAA9C,GAAA,CAACN,MAAA;IAAOuB,UAAA,EAAW;IAAS8B,SAAA,EAAWH,IAAA,CAAK,EAAE;IAC5CrC,QAAA,iBAAAP,GAAA,CAACR,QAAA;MAASqB,KAAA,EAAO+B,IAAA,CAAK,GAAG;MAAGI,MAAA,EAAQJ,IAAA,CAAK,EAAE;IAAA,CAAG;EAAA,CAChD;AAEJ;AAGO,SAASK,eAAe;EAAEC;AAAO,GAAwB;EAC9D,MAAM;IAAEC;EAAE,IAAIpD,cAAA,CAAe;EAC7B,MAAM;IAAEU;EAAU,IAAIX,gBAAA,CAAiB;EACvC,OACE,eAAAG,IAAA,CAACN,MAAA;IACE,GAAGc,SAAA,CAAUM,KAAA;IACdmC,MAAA;IACA,uBAAoB;IACpB,aAAS;IACT,cAAYC,CAAA,CAAE,SAAS;IAEvB5C,QAAA,kBAAAP,GAAA,CAACK,eAAA;MACCE,QAAA,iBAAAN,IAAA,CAACa,aAAA;QACCP,QAAA,kBAAAP,GAAA,CAACkB,mBAAA;UAAqB,GAAG;YAAE,sBAAsB;UAAM;UACrDX,QAAA,iBAAAP,GAAA,CAACR,QAAA;YAAS4D,OAAA,EAAQ;YAAUvC,KAAA,EAAM;YAAOwC,WAAA,EAAa;UAAA,CAAG;QAAA,CAC3D,GACA,eAAApD,IAAA,CAACuB,wBAAA;UAA0B,GAAG;YAAE,sBAAsB;UAAW;UAC/DjB,QAAA,kBAAAP,GAAA,CAACR,QAAA;YAASqB,KAAA,EAAO+B,IAAA,CAAK,EAAE;YAAGI,MAAA,EAAQJ,IAAA,CAAK,EAAE;UAAA,CAAG,GAC7C,eAAA5C,GAAA,CAACR,QAAA;YAASqB,KAAA,EAAO+B,IAAA,CAAK,GAAG;YAAGI,MAAA,EAAQJ,IAAA,CAAK,EAAE;UAAA,CAAG,GAC9C,eAAA5C,GAAA,CAACR,QAAA;YAASqB,KAAA,EAAO+B,IAAA,CAAK,GAAG;YAAGI,MAAA,EAAQJ,IAAA,CAAK,EAAE;UAAA,CAAG,GAC9C,eAAA3C,IAAA,CAACP,MAAA;YAAO6B,GAAA,EAAI;YACVhB,QAAA,kBAAAP,GAAA,CAACR,QAAA;cAAS4D,OAAA,EAAQ;cAAUvC,KAAA,EAAO+B,IAAA,CAAK,EAAE;cAAGI,MAAA,EAAQJ,IAAA,CAAK,EAAE;YAAA,CAAG,GAC/D,eAAA5C,GAAA,CAACR,QAAA;cAAS4D,OAAA,EAAQ;cAAUvC,KAAA,EAAO+B,IAAA,CAAK,EAAE;cAAGI,MAAA,EAAQJ,IAAA,CAAK,EAAE;YAAA,CAAG;UAAA,CACjE,GACA,eAAA5C,GAAA,CAACN,MAAA;YAAQ,GAAGe,SAAA,CAAUc,GAAA;YAAKP,QAAA,EAAS;YACjCT,QAAA,GAAC,GAAG,GAAG,CAAC,EAAEsB,GAAA,CAAKC,IAAA,IACd,eAAA9B,GAAA,CAACR,QAAA;cAEC4D,OAAA,EAAQ;cACRjC,QAAA,EAAU;cACVC,SAAA,EAAW;cACX4B,MAAA,EAAQJ,IAAA,CAAK,EAAE;YAAA,GAJVd,IAKP,CACD;UAAA,CACH;QAAA,CACF;MAAA,CACF;IAAA,CACF,GACA,eAAA7B,IAAA,CAACN,MAAA;MAAQ,GAAGc,SAAA,CAAUc,GAAA;MACpBhB,QAAA,kBAAAP,GAAA,CAACN,MAAA;QAAQ,GAAGe,SAAA,CAAUc,GAAA;QAAM,GAAG;UAAE,sBAAsB;QAAO;QAC3DhB,QAAA,GAAC,KAAK,IAAI,EAAE,EAAEsB,GAAA,CAAI,CAAChB,KAAA,EAAOyC,GAAA,KACzB,eAAAtD,GAAA,CAACR,QAAA;UAAmB4D,OAAA,EAAQ;UAAUvC,KAAA,EAAO+B,IAAA,CAAK/B,KAAK;UAAGmC,MAAA,EAAQJ,IAAA,CAAK,EAAE;QAAA,GAA1DU,GAA6D,CAC7E;MAAA,CACH,GACA,eAAAtD,GAAA,CAACR,QAAA,CAASC,IAAA,EAAT;QAAc8D,KAAA,EAAO;MAAA,CAAG;IAAA,CAC3B;EAAA,CACF;AAEJ","ignoreList":[]}