@lockin90/ui-native 0.0.0-stage → 1.0.0

package/lib/commonjs/components/Input.js

@@ -0,0 +1,142 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Input = Input;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _tokens = require("@lockin90/tokens");
+var _jsxRuntime = require("react/jsx-runtime");
+/** Dark glassy text input — mono label, faint unit suffix, accent focus border. */
+function Input({
+  label,
+  unit,
+  invalid = false,
+  inputSize = 'md',
+  leading,
+  variant = 'default',
+  style,
+  onFocus,
+  onBlur,
+  ...rest
+}) {
+  const [focused, setFocused] = (0, _react.useState)(false);
+  const sm = inputSize === 'sm';
+  const numeral = variant === 'numeral';
+  const borderColor = invalid ? _tokens.colors.zoneLow : focused ? _tokens.colors.accent : _tokens.colors.border2;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: styles.wrap,
+    children: [label ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: styles.label,
+      children: label.toUpperCase()
+    }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: [styles.field, sm && styles.fieldSm, numeral && styles.fieldNumeral, {
+        borderColor
+      }],
+      children: [leading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: styles.lead,
+        children: leading
+      }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TextInput, {
+        style: [styles.input, sm && styles.inputSm, numeral && styles.inputNumeral, style],
+        placeholderTextColor: _tokens.colors.textFaint,
+        onFocus: e => {
+          setFocused(true);
+          onFocus?.(e);
+        },
+        onBlur: e => {
+          setFocused(false);
+          onBlur?.(e);
+        },
+        ...rest
+      }), unit ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: [styles.unit, sm && styles.unitSm, numeral && styles.unitNumeral],
+        children: unit
+      }) : null]
+    })]
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  wrap: {
+    gap: 6,
+    minWidth: 0
+  },
+  label: {
+    fontFamily: _tokens.fonts.mono,
+    fontSize: 10,
+    fontWeight: '500',
+    letterSpacing: 1.2,
+    color: _tokens.colors.textFaint
+  },
+  field: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 8,
+    minWidth: 0,
+    paddingVertical: 9,
+    paddingHorizontal: 12,
+    borderRadius: _tokens.radii.sm,
+    borderWidth: 1,
+    backgroundColor: _tokens.colors.glass2
+  },
+  fieldSm: {
+    paddingVertical: 6,
+    paddingHorizontal: 10
+  },
+  // design `.strow .sv` — glass-2 fill (already the field default), border-2
+  // (already default), 9px radius, roomier centered padding.
+  fieldNumeral: {
+    justifyContent: 'center',
+    paddingVertical: 10,
+    paddingHorizontal: 10,
+    borderRadius: 9
+  },
+  lead: {
+    flexShrink: 0
+  },
+  input: {
+    flex: 1,
+    minWidth: 0,
+    padding: 0,
+    color: _tokens.colors.text,
+    fontFamily: _tokens.fonts.ui,
+    fontSize: 14,
+    // Center the value/placeholder: drop the explicit lineHeight (it top/bottom-biases
+    // the glyph in a single-line TextInput) + Android font-padding/vertical-align props.
+    textAlignVertical: 'center',
+    includeFontPadding: false
+  },
+  inputSm: {
+    fontSize: 12.5
+  },
+  // design `.strow .sv` — 20px bold display-font numeral, centered, tabular.
+  // Content-hugging (not flex:1) so it groups tightly with the unit suffix
+  // instead of stretching to the field's full width.
+  inputNumeral: {
+    flex: 0,
+    minWidth: 20,
+    fontFamily: _tokens.fonts.display,
+    fontWeight: '700',
+    fontSize: 20,
+    textAlign: 'center',
+    fontVariant: ['tabular-nums']
+  },
+  unit: {
+    flexShrink: 0,
+    fontFamily: _tokens.fonts.mono,
+    fontSize: 11,
+    color: _tokens.colors.textFaint
+  },
+  unitSm: {
+    fontSize: 10
+  },
+  // design `.strow .sv small` — dim, sits right after the numeral
+  unitNumeral: {
+    fontFamily: _tokens.fonts.ui,
+    fontSize: 11,
+    fontWeight: '400',
+    color: _tokens.colors.textDim,
+    marginLeft: 1
+  }
+});
+//# sourceMappingURL=Input.js.map

package/lib/commonjs/components/Input.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_tokens","_jsxRuntime","Input","label","unit","invalid","inputSize","leading","variant","style","onFocus","onBlur","rest","focused","setFocused","useState","sm","numeral","borderColor","colors","zoneLow","accent","border2","jsxs","View","styles","wrap","children","jsx","Text","toUpperCase","field","fieldSm","fieldNumeral","lead","TextInput","input","inputSm","inputNumeral","placeholderTextColor","textFaint","e","unitSm","unitNumeral","StyleSheet","create","gap","minWidth","fontFamily","fonts","mono","fontSize","fontWeight","letterSpacing","color","flexDirection","alignItems","paddingVertical","paddingHorizontal","borderRadius","radii","borderWidth","backgroundColor","glass2","justifyContent","flexShrink","flex","padding","text","ui","textAlignVertical","includeFontPadding","display","textAlign","fontVariant","textDim","marginLeft"],"sourceRoot":"../../../src","sources":["components/Input.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/components/InsightCard.js

@@ -0,0 +1,119 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InsightCard = InsightCard;
+var _reactNative = require("react-native");
+var _tokens = require("@lockin90/tokens");
+var _Card = require("./Card");
+var _Icon = require("./Icon");
+var _Sparkline = require("./Sparkline");
+var _Chip = require("./Chip");
+var _jsxRuntime = require("react/jsx-runtime");
+/** Tone → accent color for the icon + sparkline (matches the mockup). */
+const TONE_COLOR = {
+  default: _tokens.colors.textDim,
+  positive: _tokens.colors.ok,
+  negative: _tokens.colors.bad,
+  accent: _tokens.colors.accent
+};
+
+/**
+ * InsightCard — a glass panel surfacing a detected pattern: a leading icon +
+ * title row, the insight prose, a row of small stat Chips (p-value / n /
+ * confidence), and an optional tone-tinted Sparkline. Composed from Card + Icon
+ * + Sparkline + Chip; `tone` drives the icon and sparkline accent. Mirrors the
+ * web `@lockin90/ui` InsightCard and the `.insight` cards in the design mockup.
+ */
+function InsightCard({
+  title,
+  body,
+  data,
+  stats,
+  tone = 'default',
+  accentColor,
+  sparkFill = true,
+  icon = 'sparkle',
+  style
+}) {
+  const color = accentColor ?? TONE_COLOR[tone];
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Card.Card, {
+    style: style,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.row,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+        style: styles.main,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+          style: styles.head,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
+            name: icon,
+            size: 18,
+            color: color
+          }), title ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.title,
+            children: title
+          }) : null]
+        }), typeof body === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.body,
+          children: body
+        }) : body, stats && stats.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+          style: styles.meta,
+          children: stats.map((s, i) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.Chip, {
+            label: `${s.label} = ${s.value}`
+          }, `${s.label}-${i}`))
+        }) : null]
+      }), data && data.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: styles.right,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Sparkline.Sparkline, {
+          data: data,
+          color: color,
+          width: 120,
+          height: 56,
+          fill: sparkFill
+        })
+      }) : null]
+    })
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  row: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 18
+  },
+  main: {
+    flex: 1,
+    minWidth: 0
+  },
+  head: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 10,
+    marginBottom: 7
+  },
+  title: {
+    flex: 1,
+    fontFamily: _tokens.fonts.display,
+    fontSize: 17,
+    fontWeight: '700',
+    letterSpacing: -0.2,
+    color: _tokens.colors.text
+  },
+  body: {
+    fontSize: 13.5,
+    lineHeight: 21,
+    color: _tokens.colors.textDim
+  },
+  meta: {
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    alignItems: 'center',
+    gap: 8,
+    marginTop: 12
+  },
+  right: {
+    alignItems: 'flex-end'
+  }
+});
+//# sourceMappingURL=InsightCard.js.map

package/lib/commonjs/components/InsightCard.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_tokens","_Card","_Icon","_Sparkline","_Chip","_jsxRuntime","TONE_COLOR","default","colors","textDim","positive","ok","negative","bad","accent","InsightCard","title","body","data","stats","tone","accentColor","sparkFill","icon","style","color","jsx","Card","children","jsxs","View","styles","row","main","head","Icon","name","size","Text","length","meta","map","s","i","Chip","label","value","right","Sparkline","width","height","fill","StyleSheet","create","flexDirection","alignItems","gap","flex","minWidth","marginBottom","fontFamily","fonts","display","fontSize","fontWeight","letterSpacing","text","lineHeight","flexWrap","marginTop"],"sourceRoot":"../../../src","sources":["components/InsightCard.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/components/KeyValue.js

@@ -0,0 +1,93 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.KeyValue = KeyValue;
+var _reactNative = require("react-native");
+var _tokens = require("@lockin90/tokens");
+var _jsxRuntime = require("react/jsx-runtime");
+/** A single label↔value row in a {@link KeyValue} list. */
+
+const DEFAULT_ROWS = [{
+  key: 'Plan',
+  value: 'Pro'
+}, {
+  key: 'MRR',
+  value: '$29.00'
+}, {
+  key: 'Member since',
+  value: 'Jan 2026'
+}];
+
+/** Definition list of key↔value rows — used in detail panels & settings.
+ *  spread = key (mono faint) left / value right with hairline borders between
+ *  rows; inline = key then value side by side with a small gap. */
+function KeyValue({
+  rows = DEFAULT_ROWS,
+  align = 'spread',
+  style,
+  ...rest
+}) {
+  const spread = align === 'spread';
+  const last = rows.length - 1;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: [styles.list, style],
+    ...rest,
+    children: rows.map((row, i) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: [spread ? styles.rowSpread : styles.rowInline, spread && i === 0 && styles.rowSpreadFirst, spread && i !== last && styles.rowSpreadBorder],
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.key,
+        children: row.key
+      }), typeof row.value === 'string' || typeof row.value === 'number' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: [styles.val, spread && styles.valSpread],
+        children: row.value
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: spread && styles.valSpread,
+        children: row.value
+      })]
+    }, `${row.key}-${i}`))
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  list: {
+    flexDirection: 'column'
+  },
+  rowSpread: {
+    flexDirection: 'row',
+    alignItems: 'baseline',
+    justifyContent: 'space-between',
+    gap: 16,
+    paddingVertical: 9
+  },
+  rowSpreadFirst: {
+    paddingTop: 0
+  },
+  rowSpreadBorder: {
+    borderBottomWidth: 1,
+    borderBottomColor: _tokens.colors.border
+  },
+  rowInline: {
+    flexDirection: 'row',
+    alignItems: 'baseline',
+    gap: 8,
+    paddingVertical: 3
+  },
+  key: {
+    fontFamily: _tokens.fonts.mono,
+    fontSize: 11.5,
+    fontWeight: '500',
+    letterSpacing: 0.46,
+    color: _tokens.colors.textFaint
+  },
+  val: {
+    fontFamily: _tokens.fonts.ui,
+    fontSize: 13,
+    color: _tokens.colors.text
+  },
+  valSpread: {
+    flexShrink: 1,
+    textAlign: 'right'
+  }
+});
+//# sourceMappingURL=KeyValue.js.map

package/lib/commonjs/components/KeyValue.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_tokens","_jsxRuntime","DEFAULT_ROWS","key","value","KeyValue","rows","align","style","rest","spread","last","length","jsx","View","styles","list","children","map","row","i","jsxs","rowSpread","rowInline","rowSpreadFirst","rowSpreadBorder","Text","val","valSpread","StyleSheet","create","flexDirection","alignItems","justifyContent","gap","paddingVertical","paddingTop","borderBottomWidth","borderBottomColor","colors","border","fontFamily","fonts","mono","fontSize","fontWeight","letterSpacing","color","textFaint","ui","text","flexShrink","textAlign"],"sourceRoot":"../../../src","sources":["components/KeyValue.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/components/LeaderboardRow.js

@@ -0,0 +1,140 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.LeaderboardRow = LeaderboardRow;
+var _reactNative = require("react-native");
+var _tokens = require("@lockin90/tokens");
+var _Avatar = require("./Avatar");
+var _Icon = require("./Icon");
+var _jsxRuntime = require("react/jsx-runtime");
+/** Podium tint per medal rank: gold (1) · silver (2) · bronze (3). */
+const MEDAL_COLOR = {
+  1: _tokens.colors.warn,
+  // gold #FFB020
+  2: _tokens.colors.textDim,
+  // silver
+  3: '#C77B3A' // bronze amber
+};
+
+/**
+ * LeaderboardRow — one ranked entry in a standings list: rank (display font) +
+ * avatar + name (+ optional sublabel) on the left, the ranked value on the
+ * right. Ranks 1–3 swap the number for a gold/silver/bronze crown glyph.
+ * `highlight` accent-tints the row to mark the current user ("you"). Mirrors
+ * the web `@lockin90/ui` `LeaderboardRow`. Composed from `Avatar` + `Icon`.
+ */
+function LeaderboardRow({
+  rank,
+  name,
+  avatar,
+  value,
+  sublabel,
+  highlight,
+  divider = true,
+  style,
+  ...rest
+}) {
+  const medalColor = MEDAL_COLOR[rank];
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: [styles.row, divider && styles.divider, highlight && styles.highlight, style],
+    ...rest,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: styles.rank,
+      children: medalColor ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.Icon, {
+        name: "star",
+        size: 20,
+        color: medalColor
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: [styles.rankNum, highlight && styles.rankNumHighlight],
+        children: rank
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Avatar.Avatar, {
+      name: name,
+      src: avatar,
+      size: 40
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.main,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.name,
+        numberOfLines: 1,
+        children: name
+      }), sublabel != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+        style: styles.sub,
+        numberOfLines: 1,
+        children: sublabel
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: [styles.value, highlight && styles.valueHighlight],
+      children: value
+    })]
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  row: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: 12,
+    paddingVertical: 12,
+    paddingHorizontal: 14,
+    borderWidth: 1,
+    borderColor: 'transparent',
+    borderRadius: _tokens.radii.md
+  },
+  divider: {
+    borderTopColor: _tokens.colors.border
+  },
+  highlight: {
+    // accent tint ~12% + ~45% border — RN has no color-mix; use translucent accent.
+    backgroundColor: 'rgba(124,92,255,0.12)',
+    borderColor: 'rgba(124,92,255,0.45)'
+  },
+  rank: {
+    width: 28,
+    flexShrink: 0,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  rankNum: {
+    fontFamily: _tokens.fonts.display,
+    fontWeight: '700',
+    fontSize: 17,
+    letterSpacing: -0.3,
+    color: _tokens.colors.textDim
+  },
+  rankNumHighlight: {
+    color: _tokens.colors.accent
+  },
+  main: {
+    flex: 1,
+    minWidth: 0
+  },
+  name: {
+    fontFamily: _tokens.fonts.ui,
+    fontSize: 14.5,
+    fontWeight: '600',
+    lineHeight: 18,
+    color: _tokens.colors.text
+  },
+  sub: {
+    marginTop: 1,
+    fontFamily: _tokens.fonts.ui,
+    fontSize: 12.5,
+    lineHeight: 16,
+    color: _tokens.colors.textFaint
+  },
+  value: {
+    marginLeft: 'auto',
+    flexShrink: 0,
+    fontFamily: _tokens.fonts.display,
+    fontWeight: '700',
+    fontSize: 16,
+    letterSpacing: -0.3,
+    color: _tokens.colors.text
+  },
+  valueHighlight: {
+    color: _tokens.colors.accent
+  }
+});
+//# sourceMappingURL=LeaderboardRow.js.map

package/lib/commonjs/components/LeaderboardRow.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_tokens","_Avatar","_Icon","_jsxRuntime","MEDAL_COLOR","colors","warn","textDim","LeaderboardRow","rank","name","avatar","value","sublabel","highlight","divider","style","rest","medalColor","jsxs","View","styles","row","children","jsx","Icon","size","color","Text","rankNum","rankNumHighlight","Avatar","src","main","numberOfLines","sub","valueHighlight","StyleSheet","create","flexDirection","alignItems","gap","paddingVertical","paddingHorizontal","borderWidth","borderColor","borderRadius","radii","md","borderTopColor","border","backgroundColor","width","flexShrink","justifyContent","fontFamily","fonts","display","fontWeight","fontSize","letterSpacing","accent","flex","minWidth","ui","lineHeight","text","marginTop","textFaint","marginLeft"],"sourceRoot":"../../../src","sources":["components/LeaderboardRow.tsx"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAA8B,IAAAI,WAAA,GAAAJ,OAAA;AAwB9B;AACA,MAAMK,WAAmC,GAAG;EAC1C,CAAC,EAAEC,cAAM,CAACC,IAAI;EAAE;EAChB,CAAC,EAAED,cAAM,CAACE,OAAO;EAAE;EACnB,CAAC,EAAE,SAAS,CAAE;AAChB,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,cAAcA,CAAC;EAC7BC,IAAI;EACJC,IAAI;EACJC,MAAM;EACNC,KAAK;EACLC,QAAQ;EACRC,SAAS;EACTC,OAAO,GAAG,IAAI;EACdC,KAAK;EACL,GAAGC;AACgB,CAAC,EAAE;EACtB,MAAMC,UAAU,GAAGd,WAAW,CAACK,IAAI,CAAC;EAEpC,oBACE,IAAAN,WAAA,CAAAgB,IAAA,EAACrB,YAAA,CAAAsB,IAAI;IACHJ,KAAK,EAAE,CACLK,MAAM,CAACC,GAAG,EACVP,OAAO,IAAIM,MAAM,CAACN,OAAO,EACzBD,SAAS,IAAIO,MAAM,CAACP,SAAS,EAC7BE,KAAK,CACL;IAAA,GACEC,IAAI;IAAAM,QAAA,gBAER,IAAApB,WAAA,CAAAqB,GAAA,EAAC1B,YAAA,CAAAsB,IAAI;MAACJ,KAAK,EAAEK,MAAM,CAACZ,IAAK;MAAAc,QAAA,EACtBL,UAAU,gBACT,IAAAf,WAAA,CAAAqB,GAAA,EAACtB,KAAA,CAAAuB,IAAI;QAACf,IAAI,EAAC,MAAM;QAACgB,IAAI,EAAE,EAAG;QAACC,KAAK,EAAET;MAAW,CAAE,CAAC,gBAEjD,IAAAf,WAAA,CAAAqB,GAAA,EAAC1B,YAAA,CAAA8B,IAAI;QAACZ,KAAK,EAAE,CAACK,MAAM,CAACQ,OAAO,EAAEf,SAAS,IAAIO,MAAM,CAACS,gBAAgB,CAAE;QAAAP,QAAA,EAAEd;MAAI,CAAO;IAClF,CACG,CAAC,eAEP,IAAAN,WAAA,CAAAqB,GAAA,EAACvB,OAAA,CAAA8B,MAAM;MAACrB,IAAI,EAAEA,IAAK;MAACsB,GAAG,EAAErB,MAAO;MAACe,IAAI,EAAE;IAAG,CAAE,CAAC,eAE7C,IAAAvB,WAAA,CAAAgB,IAAA,EAACrB,YAAA,CAAAsB,IAAI;MAACJ,KAAK,EAAEK,MAAM,CAACY,IAAK;MAAAV,QAAA,gBACvB,IAAApB,WAAA,CAAAqB,GAAA,EAAC1B,YAAA,CAAA8B,IAAI;QAACZ,KAAK,EAAEK,MAAM,CAACX,IAAK;QAACwB,aAAa,EAAE,CAAE;QAAAX,QAAA,EACxCb;MAAI,CACD,CAAC,EACNG,QAAQ,IAAI,IAAI,iBACf,IAAAV,WAAA,CAAAqB,GAAA,EAAC1B,YAAA,CAAA8B,IAAI;QAACZ,KAAK,EAAEK,MAAM,CAACc,GAAI;QAACD,aAAa,EAAE,CAAE;QAAAX,QAAA,EACvCV;MAAQ,CACL,CACP;IAAA,CACG,CAAC,eAEP,IAAAV,WAAA,CAAAqB,GAAA,EAAC1B,YAAA,CAAA8B,IAAI;MAACZ,KAAK,EAAE,CAACK,MAAM,CAACT,KAAK,EAAEE,SAAS,IAAIO,MAAM,CAACe,cAAc,CAAE;MAAAb,QAAA,EAAEX;IAAK,CAAO,CAAC;EAAA,CAC3E,CAAC;AAEX;AAEA,MAAMS,MAAM,GAAGgB,uBAAU,CAACC,MAAM,CAAC;EAC/BhB,GAAG,EAAE;IACHiB,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,GAAG,EAAE,EAAE;IACPC,eAAe,EAAE,EAAE;IACnBC,iBAAiB,EAAE,EAAE;IACrBC,WAAW,EAAE,CAAC;IACdC,WAAW,EAAE,aAAa;IAC1BC,YAAY,EAAEC,aAAK,CAACC;EACtB,CAAC;EACDjC,OAAO,EAAE;IACPkC,cAAc,EAAE5C,cAAM,CAAC6C;EACzB,CAAC;EACDpC,SAAS,EAAE;IACT;IACAqC,eAAe,EAAE,uBAAuB;IACxCN,WAAW,EAAE;EACf,CAAC;EACDpC,IAAI,EAAE;IACJ2C,KAAK,EAAE,EAAE;IACTC,UAAU,EAAE,CAAC;IACbb,UAAU,EAAE,QAAQ;IACpBc,cAAc,EAAE;EAClB,CAAC;EACDzB,OAAO,EAAE;IACP0B,UAAU,EAAEC,aAAK,CAACC,OAAO;IACzBC,UAAU,EAAE,KAAK;IACjBC,QAAQ,EAAE,EAAE;IACZC,aAAa,EAAE,CAAC,GAAG;IACnBjC,KAAK,EAAEtB,cAAM,CAACE;EAChB,CAAC;EACDuB,gBAAgB,EAAE;IAChBH,KAAK,EAAEtB,cAAM,CAACwD;EAChB,CAAC;EACD5B,IAAI,EAAE;IACJ6B,IAAI,EAAE,CAAC;IACPC,QAAQ,EAAE;EACZ,CAAC;EACDrD,IAAI,EAAE;IACJ6C,UAAU,EAAEC,aAAK,CAACQ,EAAE;IACpBL,QAAQ,EAAE,IAAI;IACdD,UAAU,EAAE,KAAK;IACjBO,UAAU,EAAE,EAAE;IACdtC,KAAK,EAAEtB,cAAM,CAAC6D;EAChB,CAAC;EACD/B,GAAG,EAAE;IACHgC,SAAS,EAAE,CAAC;IACZZ,UAAU,EAAEC,aAAK,CAACQ,EAAE;IACpBL,QAAQ,EAAE,IAAI;IACdM,UAAU,EAAE,EAAE;IACdtC,KAAK,EAAEtB,cAAM,CAAC+D;EAChB,CAAC;EACDxD,KAAK,EAAE;IACLyD,UAAU,EAAE,MAAM;IAClBhB,UAAU,EAAE,CAAC;IACbE,UAAU,EAAEC,aAAK,CAACC,OAAO;IACzBC,UAAU,EAAE,KAAK;IACjBC,QAAQ,EAAE,EAAE;IACZC,aAAa,EAAE,CAAC,GAAG;IACnBjC,KAAK,EAAEtB,cAAM,CAAC6D;EAChB,CAAC;EACD9B,cAAc,EAAE;IACdT,KAAK,EAAEtB,cAAM,CAACwD;EAChB;AACF,CAAC,CAAC","ignoreList":[]}