@12-apps/ui 6.33.1 → 6.34.0

package/dist/chunk-SCQJV54H.js

@@ -0,0 +1,246 @@
+import {
+  BoardGlyph,
+  ColumnsGlyph,
+  GridGlyph,
+  ListGlyph,
+  RowsGlyph,
+  TableGlyph
+} from "./chunk-SNR537TI.js";
+import {
+  useDataViewsLayout
+} from "./chunk-2XGGHYEA.js";
+import {
+  useDataViewsCopy
+} from "./chunk-KHG57NAE.js";
+import {
+  default as default2
+} from "./chunk-6DPAWXZ3.js";
+import {
+  Text
+} from "./chunk-H57ZS6W2.js";
+
+// src/components/data-display/DataViews/data-views-display-tabs.tsx
+import ArrowDownwardRoundedIcon from "@mui/icons-material/ArrowDownwardRounded";
+import ArrowUpwardRoundedIcon from "@mui/icons-material/ArrowUpwardRounded";
+import useMediaQuery from "@mui/material/useMediaQuery/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+function Tile({
+  active,
+  label,
+  onClick,
+  testId,
+  children
+}) {
+  return /* @__PURE__ */ jsxs(
+    default2,
+    {
+      component: "button",
+      type: "button",
+      onClick,
+      "aria-pressed": active,
+      "data-testid": testId,
+      sx: {
+        flex: 1,
+        minWidth: 0,
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        gap: 0.75,
+        p: 1.25,
+        border: 1,
+        borderStyle: "solid",
+        borderColor: active ? "primary.main" : "divider",
+        bgcolor: active ? "action.selected" : "transparent",
+        borderRadius: 1,
+        cursor: "pointer",
+        font: "inherit",
+        fontSize: "0.75rem",
+        fontWeight: active ? 600 : 400,
+        color: active ? "primary.main" : "text.secondary",
+        "&:hover": { bgcolor: "action.hover" }
+      },
+      children: [
+        children,
+        label
+      ]
+    }
+  );
+}
+var DIRECTION_LABELS = {
+  number: ["Menor \u2192 maior", "Maior \u2192 menor"],
+  currency: ["Menor \u2192 maior", "Maior \u2192 menor"],
+  date: ["Mais antigo", "Mais recente"],
+  text: ["A \u2192 Z", "Z \u2192 A"]
+};
+function directionLabels(kind) {
+  return DIRECTION_LABELS[kind ?? "text"] ?? DIRECTION_LABELS.text;
+}
+function SortTab({
+  fields,
+  activeField,
+  activeOrder,
+  onChange,
+  sortKinds,
+  testIdPrefix
+}) {
+  const copy = useDataViewsCopy();
+  const [ascLabel, descLabel] = directionLabels(sortKinds?.[activeField]);
+  return /* @__PURE__ */ jsxs(default2, { sx: { p: 1 }, children: [
+    /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { px: 0.5, color: "text.secondary" }, children: copy.display.direction }) }),
+    /* @__PURE__ */ jsx(default2, { sx: { display: "flex", gap: 0.75, mb: 1.5, mt: 0.5 }, children: ["asc", "desc"].map((direction, index) => /* @__PURE__ */ jsx(
+      Tile,
+      {
+        active: activeOrder === direction,
+        label: index === 0 ? ascLabel : descLabel,
+        onClick: () => onChange(activeField || fields[0]?.value || "", direction),
+        testId: `${testIdPrefix}-sort-dir-${direction}`,
+        children: direction === "asc" ? /* @__PURE__ */ jsx(ArrowUpwardRoundedIcon, { fontSize: "small" }) : /* @__PURE__ */ jsx(ArrowDownwardRoundedIcon, { fontSize: "small" })
+      },
+      direction
+    )) }),
+    /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { px: 0.5, color: "text.secondary" }, children: copy.display.fieldHeading }) }),
+    fields.map((field) => /* @__PURE__ */ jsx(
+      SortFieldRow,
+      {
+        label: field.label,
+        active: field.value === activeField,
+        onClick: () => onChange(field.value, activeOrder),
+        testId: `${testIdPrefix}-sort-field-${field.value}`
+      },
+      field.value
+    ))
+  ] });
+}
+function SortFieldRow({
+  label,
+  active,
+  onClick,
+  testId
+}) {
+  return /* @__PURE__ */ jsxs(
+    default2,
+    {
+      component: "button",
+      type: "button",
+      onClick,
+      "data-testid": testId,
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        gap: 1,
+        width: "100%",
+        px: 1,
+        py: 0.75,
+        border: 0,
+        background: "none",
+        borderRadius: 1,
+        cursor: "pointer",
+        font: "inherit",
+        fontSize: "0.8125rem",
+        textAlign: "left",
+        fontWeight: active ? 600 : 400,
+        color: active ? "primary.main" : "text.primary",
+        "&:hover": { bgcolor: "action.hover" }
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          default2,
+          {
+            component: "span",
+            sx: { height: 6, width: 6, borderRadius: "50%", bgcolor: active ? "primary.main" : "action.disabled" }
+          }
+        ),
+        /* @__PURE__ */ jsx(default2, { component: "span", sx: { flex: 1, minWidth: 0 }, children: label })
+      ]
+    }
+  );
+}
+function densityTiles(layout, copy) {
+  const labels = copy.display.densityLabels[layout] ?? copy.display.densityLabels.table;
+  return [
+    { value: "compact", label: labels?.compact ?? "compact", gap: 2, columns: 4 },
+    { value: "cozy", label: labels?.cozy ?? "cozy", gap: 5, columns: 3 },
+    { value: "comfortable", label: labels?.comfortable ?? "comfortable", gap: 8, columns: 2 }
+  ];
+}
+function densityGlyph(layout, tile, active) {
+  if (layout === "cards") return /* @__PURE__ */ jsx(GridGlyph, { n: tile.columns, active });
+  if (layout === "board") return /* @__PURE__ */ jsx(ColumnsGlyph, { n: tile.columns, active });
+  return /* @__PURE__ */ jsx(RowsGlyph, { gap: tile.gap, active });
+}
+function layoutGlyph(layout, active) {
+  if (layout === "table") return /* @__PURE__ */ jsx(TableGlyph, { active });
+  if (layout === "list") return /* @__PURE__ */ jsx(ListGlyph, { active });
+  if (layout === "cards") return /* @__PURE__ */ jsx(GridGlyph, { active });
+  return /* @__PURE__ */ jsx(BoardGlyph, { active });
+}
+var LAYOUT_TILE_LABELS = {
+  table: "Tabela",
+  list: "Lista",
+  cards: "Grade",
+  board: "Quadro"
+};
+function DensityTiles({ testIdPrefix }) {
+  const copy = useDataViewsCopy();
+  const { layout, density, setDensity } = useDataViewsLayout();
+  const isOneColumn = useMediaQuery((t) => t.breakpoints.down("sm"));
+  if (layout === "cards" && isOneColumn) {
+    return /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { px: 0.5, pt: 0.5, display: "block", color: "text.disabled" }, children: copy.display.densityUnavailableNarrow }) });
+  }
+  return /* @__PURE__ */ jsx(default2, { sx: { display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: 0.75, mt: 0.5 }, children: densityTiles(layout, copy).map((tile) => /* @__PURE__ */ jsx(
+    Tile,
+    {
+      active: density === tile.value,
+      label: tile.label,
+      onClick: () => setDensity(tile.value),
+      testId: `${testIdPrefix}-density-${tile.value}`,
+      children: densityGlyph(layout, tile, density === tile.value)
+    },
+    tile.value
+  )) });
+}
+function DisplayTab({ testIdPrefix }) {
+  const copy = useDataViewsCopy();
+  const { layout, setLayout, canUseCards, canUseList, canUseBoard } = useDataViewsLayout();
+  const available = [
+    "table",
+    ...canUseList ? ["list"] : [],
+    ...canUseCards ? ["cards"] : [],
+    ...canUseBoard ? ["board"] : []
+  ];
+  return /* @__PURE__ */ jsxs(default2, { sx: { p: 1 }, children: [
+    /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { px: 0.5, color: "text.secondary" }, children: copy.display.formatHeading }) }),
+    /* @__PURE__ */ jsx(
+      default2,
+      {
+        sx: {
+          display: "grid",
+          gridTemplateColumns: available.length > 3 ? "repeat(2, 1fr)" : `repeat(${available.length}, 1fr)`,
+          gap: 0.75,
+          mt: 0.5
+        },
+        children: available.map((value) => /* @__PURE__ */ jsx(
+          Tile,
+          {
+            active: layout === value,
+            label: LAYOUT_TILE_LABELS[value],
+            onClick: () => setLayout(value),
+            testId: `${testIdPrefix}-layout-${value}`,
+            children: layoutGlyph(value, layout === value)
+          },
+          value
+        ))
+      }
+    ),
+    /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { px: 0.5, py: 1, display: "block", color: "text.disabled" }, children: copy.display.layoutHints[layout] }) }),
+    /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { px: 0.5, color: "text.secondary" }, children: copy.display.densityHeadings[layout] }) }),
+    /* @__PURE__ */ jsx(DensityTiles, { testIdPrefix }),
+    !canUseBoard && /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { px: 0.5, pt: 1.25, display: "block", color: "text.disabled" }, children: copy.display.boardUnavailable }) })
+  ] });
+}
+
+export {
+  SortTab,
+  DisplayTab
+};
+//# sourceMappingURL=chunk-SCQJV54H.js.map

package/dist/chunk-SNBCAH62.js

@@ -0,0 +1,138 @@
+import {
+  SettingsPanel
+} from "./chunk-B443IIQG.js";
+import {
+  SettingsRail
+} from "./chunk-A4JH5FAL.js";
+import {
+  activeItemLabel,
+  filterGroups
+} from "./chunk-BXC6GRLE.js";
+import {
+  atLeastRail
+} from "./chunk-LIG7TKIB.js";
+import {
+  withDefaults
+} from "./chunk-HPK33ACY.js";
+
+// src/components/layout/SettingsLayout/SettingsLayout.tsx
+import Box from "@mui/material/Box/index.js";
+import { useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DEFAULTS = {
+  searchPlaceholder: "Search settings",
+  defaultQuery: "",
+  emptySearchLabel: "No settings match your search.",
+  testIdPrefix: "settings",
+  railBreakpoint: "md",
+  navVariant: "switcher",
+  atIndex: false,
+  backLabel: "Back"
+};
+function shellSx(breakpoint, fillHeight) {
+  return (theme) => ({
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "stretch",
+    gap: 1.5,
+    width: "100%",
+    minWidth: 0,
+    // Only ever at the wide shape. Narrow, the rail is a disclosure or the page
+    // itself, and two independent scrollbars on a phone is a trap rather than a
+    // convenience.
+    [atLeastRail(theme, breakpoint ?? "md")]: {
+      flexDirection: "row",
+      gap: 3,
+      ...fillHeight ? { height: "100%", minHeight: 0 } : {}
+    }
+  });
+}
+var SettingsLayout = (props) => {
+  const {
+    title,
+    groups,
+    activeItemId,
+    onSelectItem,
+    searchPlaceholder,
+    defaultQuery,
+    emptySearchLabel,
+    emptySearchAction,
+    linkComponent,
+    children,
+    testIdPrefix,
+    railBreakpoint,
+    fillHeight = false,
+    navVariant,
+    atIndex,
+    indexHref,
+    backLabel,
+    sectionChips
+  } = withDefaults(props, DEFAULTS);
+  const [query, setQuery] = useState(defaultQuery);
+  const [navOpen, setNavOpen] = useState(false);
+  const filteredGroups = useMemo(() => filterGroups(groups, query), [groups, query]);
+  const activeLabel = useMemo(() => activeItemLabel(groups, activeItemId), [groups, activeItemId]);
+  const drilldown = navVariant === "drilldown";
+  const ariaLabel = typeof title === "string" ? title : "Settings";
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      "data-testid": testIdPrefix,
+      "data-nav-variant": navVariant,
+      "data-at-index": atIndex ? "true" : "false",
+      sx: shellSx(railBreakpoint, fillHeight),
+      children: [
+        /* @__PURE__ */ jsx(
+          SettingsRail,
+          {
+            title,
+            activeLabel,
+            navOpen,
+            onToggleNav: () => setNavOpen((open) => !open),
+            query,
+            onQueryChange: setQuery,
+            searchPlaceholder,
+            emptySearchLabel,
+            emptySearchAction,
+            filteredGroups,
+            activeItemId,
+            linkComponent,
+            onSelectItem,
+            onNavigate: () => setNavOpen(false),
+            testIdPrefix,
+            variant: navVariant,
+            breakpoint: railBreakpoint,
+            atIndex,
+            fillHeight
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          SettingsPanel,
+          {
+            inSection: drilldown && !atIndex,
+            hideOnNarrow: drilldown && atIndex,
+            breakpoint: railBreakpoint,
+            indexHref,
+            sectionTitle: props.sectionTitle,
+            sectionDescription: props.sectionDescription,
+            backLabel,
+            ariaLabel,
+            sectionChips,
+            activeItemId,
+            linkComponent,
+            onSelectItem,
+            testIdPrefix,
+            fillHeight,
+            children
+          }
+        )
+      ]
+    }
+  );
+};
+SettingsLayout.displayName = "SettingsLayout";
+
+export {
+  SettingsLayout
+};
+//# sourceMappingURL=chunk-SNBCAH62.js.map

package/dist/chunk-SNTDLS4A.js

@@ -0,0 +1,140 @@
+import {
+  ACTIVE,
+  HOVER
+} from "./chunk-P2UIXDEG.js";
+import {
+  modeInk
+} from "./chunk-FQ6UW7IY.js";
+
+// src/components/data-display/Banner/Banner.styles.ts
+import { alpha, keyframes } from "@mui/material/styles/index.js";
+var fadeInSlide = keyframes`
+  from {
+    opacity: 0;
+    transform: translateY(-10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+`;
+var pulseAnimation = keyframes`
+  0% {
+    box-shadow: 0 0 0 0 currentColor;
+    opacity: 0.7;
+  }
+  70% {
+    box-shadow: 0 0 0 8px currentColor;
+    opacity: 0;
+  }
+  100% {
+    box-shadow: 0 0 0 0 currentColor;
+    opacity: 0;
+  }
+`;
+var getVariantColor = (theme, variant) => {
+  const colorMap = {
+    info: theme.palette.info,
+    success: theme.palette.success,
+    warning: theme.palette.warning,
+    critical: theme.palette.error
+  };
+  return colorMap[variant];
+};
+var bannerPartStyles = (theme, colorPalette) => ({
+  // Icon container
+  ".banner-icon": {
+    flexShrink: 0,
+    marginTop: theme.spacing(0.25),
+    color: colorPalette.main,
+    fontSize: "1.25rem",
+    display: "flex",
+    alignItems: "center",
+    position: "relative",
+    "&::before": {
+      content: '""',
+      position: "absolute",
+      inset: -4,
+      borderRadius: "50%",
+      background: alpha(colorPalette.main, 0.1),
+      animation: `${pulseAnimation} 3s infinite`
+    }
+  },
+  // Content area
+  ".banner-content": {
+    flex: 1,
+    minWidth: 0
+    // Prevents flex item overflow
+  },
+  // Title styles
+  ".banner-title": {
+    fontWeight: 600,
+    fontSize: "1rem",
+    lineHeight: 1.4,
+    marginBottom: theme.spacing(0.5),
+    color: colorPalette.dark || colorPalette.main
+  },
+  // Description styles  
+  ".banner-description": {
+    fontSize: "0.875rem",
+    lineHeight: 1.5,
+    opacity: 0.9,
+    color: "inherit"
+  },
+  // Actions area
+  ".banner-actions": {
+    display: "flex",
+    flexShrink: 0,
+    gap: theme.spacing(1),
+    alignItems: "center",
+    marginTop: theme.spacing(1),
+    [theme.breakpoints.up("sm")]: {
+      marginTop: 0,
+      marginLeft: theme.spacing(2)
+    }
+  },
+  // Dismiss button
+  ".banner-dismiss": {
+    color: "inherit",
+    opacity: 0.7,
+    marginLeft: theme.spacing(1),
+    flexShrink: 0,
+    // Opacity and a wash only: the dismiss used to spin 90deg, which drew the
+    // eye to the way out rather than to the message. Same fix as `Alert`'s
+    // close button, which is the sibling surface (FUT-1458).
+    "&:hover": {
+      opacity: 1,
+      backgroundColor: alpha(colorPalette.main, 0.1)
+    },
+    "&:focus-visible": {
+      opacity: 1,
+      outline: `2px solid ${colorPalette.main}`,
+      outlineOffset: "2px"
+    }
+  }
+});
+var tint = (theme, a) => `inset 0 0 0 100vmax ${alpha(modeInk(theme), a)}`;
+var bannerPointerStates = (theme) => ({
+  "&:hover": {
+    boxShadow: tint(theme, HOVER.tintAlpha)
+  },
+  // The `:not(:has(…))` names CONTROLS, not any descendant: `:active` matches
+  // an ancestor of whatever is pressed, so without it pressing the dismiss or
+  // an action dimmed the message that owns it. Excluding `:has(:active)`
+  // wholesale does not work — pressing the TEXT makes that text `:active` too,
+  // so the guard matched on every press and the state never fired.
+  '&:active:not(:has(button:active, a:active, [role="button"]:active))': {
+    boxShadow: tint(theme, ACTIVE.tintAlpha),
+    transition: "none"
+  }
+});
+var BANNER_TINT_S = ACTIVE.ms / 1e3;
+
+export {
+  fadeInSlide,
+  getVariantColor,
+  bannerPartStyles,
+  bannerPointerStates,
+  BANNER_TINT_S
+};
+//# sourceMappingURL=chunk-SNTDLS4A.js.map

package/dist/chunk-SNTDLS4A.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Banner/Banner.styles.ts"],"sourcesContent":["import { alpha, keyframes } from '@mui/material/styles/index.js';\nimport type { CSSObject, PaletteColor, Theme } from '@mui/material/styles/index.js';\n\nimport type { BannerVariant } from './Banner.types';\nimport { ACTIVE, HOVER } from '../Alert/Alert.metrics';\nimport { modeInk } from '../../../tokens/ink';\n\n// Animations\nexport const fadeInSlide = keyframes`\n  from {\n    opacity: 0;\n    transform: translateY(-10px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n`;\n\nconst pulseAnimation = keyframes`\n  0% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 0.7;\n  }\n  70% {\n    box-shadow: 0 0 0 8px currentColor;\n    opacity: 0;\n  }\n  100% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 0;\n  }\n`;\n\nexport const getVariantColor = (theme: Theme, variant: BannerVariant) => {\n  const colorMap = {\n    info: theme.palette.info,\n    success: theme.palette.success,\n    warning: theme.palette.warning,\n    critical: theme.palette.error,\n  };\n  return colorMap[variant];\n};\n\nexport const bannerPartStyles = (theme: Theme, colorPalette: PaletteColor): CSSObject => ({\n  // Icon container\n  '.banner-icon': {\n    flexShrink: 0,\n    marginTop: theme.spacing(0.25),\n    color: colorPalette.main,\n    fontSize: '1.25rem',\n    display: 'flex',\n    alignItems: 'center',\n    position: 'relative',\n\n    '&::before': {\n      content: '\"\"',\n      position: 'absolute',\n      inset: -4,\n      borderRadius: '50%',\n      background: alpha(colorPalette.main, 0.1),\n      animation: `${pulseAnimation} 3s infinite`,\n    },\n  },\n\n  // Content area\n  '.banner-content': {\n    flex: 1,\n    minWidth: 0, // Prevents flex item overflow\n  },\n\n  // Title styles\n  '.banner-title': {\n    fontWeight: 600,\n    fontSize: '1rem',\n    lineHeight: 1.4,\n    marginBottom: theme.spacing(0.5),\n    color: colorPalette.dark || colorPalette.main,\n  },\n\n  // Description styles  \n  '.banner-description': {\n    fontSize: '0.875rem',\n    lineHeight: 1.5,\n    opacity: 0.9,\n    color: 'inherit',\n  },\n\n  // Actions area\n  '.banner-actions': {\n    display: 'flex',\n    flexShrink: 0,\n    gap: theme.spacing(1),\n    alignItems: 'center',\n    marginTop: theme.spacing(1),\n\n    [theme.breakpoints.up('sm')]: {\n      marginTop: 0,\n      marginLeft: theme.spacing(2),\n    },\n  },\n\n  // Dismiss button\n  '.banner-dismiss': {\n    color: 'inherit',\n    opacity: 0.7,\n    marginLeft: theme.spacing(1),\n    flexShrink: 0,\n\n    // Opacity and a wash only: the dismiss used to spin 90deg, which drew the\n    // eye to the way out rather than to the message. Same fix as `Alert`'s\n    // close button, which is the sibling surface (FUT-1458).\n    '&:hover': {\n      opacity: 1,\n      backgroundColor: alpha(colorPalette.main, 0.1),\n    },\n\n    '&:focus-visible': {\n      opacity: 1,\n      outline: `2px solid ${colorPalette.main}`,\n      outlineOffset: '2px',\n    },\n  },\n});\n\n/**\n * The pointer states, from `Alert`'s own table.\n *\n * Banner had NO hover at all — measured ΔE76 0.00 on every variant in both\n * modes — so moving between the two surfaces gave feedback on one and silence\n * on the other. They are the same kind of thing and now answer a pointer the\n * same way.\n *\n * Neither block may declare `transition`: `:active` under a mouse always\n * implies `:hover`, so a shorthand here would outrank the root's and reset the\n * opacity fade the press is built on.\n */\n/** The same flat inset tint `Alert` paints; see `ACTIVE` for why it is a layer. */\nconst tint = (theme: Theme, a: number): string =>\n  `inset 0 0 0 100vmax ${alpha(modeInk(theme), a)}`;\n\nexport const bannerPointerStates = (theme: Theme): CSSObject => ({\n  '&:hover': {\n    boxShadow: tint(theme, HOVER.tintAlpha),\n  },\n\n  // The `:not(:has(…))` names CONTROLS, not any descendant: `:active` matches\n  // an ancestor of whatever is pressed, so without it pressing the dismiss or\n  // an action dimmed the message that owns it. Excluding `:has(:active)`\n  // wholesale does not work — pressing the TEXT makes that text `:active` too,\n  // so the guard matched on every press and the state never fired.\n  '&:active:not(:has(button:active, a:active, [role=\"button\"]:active))': {\n    boxShadow: tint(theme, ACTIVE.tintAlpha),\n    transition: 'none',\n  },\n});\n\n/** The seconds the tint takes easing back, shared with `Alert`. */\nexport const BANNER_TINT_S = ACTIVE.ms / 1000;\n"],"mappings":";;;;;;;;;AAAA,SAAS,OAAO,iBAAiB;AAQ1B,IAAM,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAW3B,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAehB,IAAM,kBAAkB,CAAC,OAAc,YAA2B;AACvE,QAAM,WAAW;AAAA,IACf,MAAM,MAAM,QAAQ;AAAA,IACpB,SAAS,MAAM,QAAQ;AAAA,IACvB,SAAS,MAAM,QAAQ;AAAA,IACvB,UAAU,MAAM,QAAQ;AAAA,EAC1B;AACA,SAAO,SAAS,OAAO;AACzB;AAEO,IAAM,mBAAmB,CAAC,OAAc,kBAA2C;AAAA;AAAA,EAExF,gBAAgB;AAAA,IACd,YAAY;AAAA,IACZ,WAAW,MAAM,QAAQ,IAAI;AAAA,IAC7B,OAAO,aAAa;AAAA,IACpB,UAAU;AAAA,IACV,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IAEV,aAAa;AAAA,MACX,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO;AAAA,MACP,cAAc;AAAA,MACd,YAAY,MAAM,aAAa,MAAM,GAAG;AAAA,MACxC,WAAW,GAAG,cAAc;AAAA,IAC9B;AAAA,EACF;AAAA;AAAA,EAGA,mBAAmB;AAAA,IACjB,MAAM;AAAA,IACN,UAAU;AAAA;AAAA,EACZ;AAAA;AAAA,EAGA,iBAAiB;AAAA,IACf,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,cAAc,MAAM,QAAQ,GAAG;AAAA,IAC/B,OAAO,aAAa,QAAQ,aAAa;AAAA,EAC3C;AAAA;AAAA,EAGA,uBAAuB;AAAA,IACrB,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,OAAO;AAAA,EACT;AAAA;AAAA,EAGA,mBAAmB;AAAA,IACjB,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,KAAK,MAAM,QAAQ,CAAC;AAAA,IACpB,YAAY;AAAA,IACZ,WAAW,MAAM,QAAQ,CAAC;AAAA,IAE1B,CAAC,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG;AAAA,MAC5B,WAAW;AAAA,MACX,YAAY,MAAM,QAAQ,CAAC;AAAA,IAC7B;AAAA,EACF;AAAA;AAAA,EAGA,mBAAmB;AAAA,IACjB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,YAAY,MAAM,QAAQ,CAAC;AAAA,IAC3B,YAAY;AAAA;AAAA;AAAA;AAAA,IAKZ,WAAW;AAAA,MACT,SAAS;AAAA,MACT,iBAAiB,MAAM,aAAa,MAAM,GAAG;AAAA,IAC/C;AAAA,IAEA,mBAAmB;AAAA,MACjB,SAAS;AAAA,MACT,SAAS,aAAa,aAAa,IAAI;AAAA,MACvC,eAAe;AAAA,IACjB;AAAA,EACF;AACF;AAeA,IAAM,OAAO,CAAC,OAAc,MAC1B,uBAAuB,MAAM,QAAQ,KAAK,GAAG,CAAC,CAAC;AAE1C,IAAM,sBAAsB,CAAC,WAA6B;AAAA,EAC/D,WAAW;AAAA,IACT,WAAW,KAAK,OAAO,MAAM,SAAS;AAAA,EACxC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,uEAAuE;AAAA,IACrE,WAAW,KAAK,OAAO,OAAO,SAAS;AAAA,IACvC,YAAY;AAAA,EACd;AACF;AAGO,IAAM,gBAAgB,OAAO,KAAK;","names":[]}