@12-apps/ui 6.19.1 → 6.21.0

package/dist/chunk-GO4MVQGC.js

@@ -0,0 +1,184 @@
+import {
+  useDataViewsCopy
+} from "./chunk-KHG57NAE.js";
+import {
+  default as default2
+} from "./chunk-6DPAWXZ3.js";
+import {
+  Text
+} from "./chunk-26Z7QWID.js";
+
+// src/components/data-display/DataViews/data-views-columns-tab.tsx
+import ArrowDownwardRoundedIcon from "@mui/icons-material/ArrowDownwardRounded";
+import ArrowUpwardRoundedIcon from "@mui/icons-material/ArrowUpwardRounded";
+import DragIndicatorRoundedIcon from "@mui/icons-material/DragIndicatorRounded";
+import Checkbox from "@mui/material/Checkbox/index.js";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function moved(order, id, delta) {
+  const from = order.indexOf(id);
+  const to = from + delta;
+  if (from < 0 || to < 0 || to >= order.length) return order;
+  const next = [...order];
+  [next[from], next[to]] = [next[to], next[from]];
+  return next;
+}
+function ColumnsTab({
+  columns,
+  order,
+  visibleColumns,
+  onToggle,
+  onReorder,
+  onShowAll,
+  onReset,
+  testIdPrefix
+}) {
+  const copy = useDataViewsCopy();
+  const [dragId, setDragId] = useState(null);
+  const byId = new Map(columns.map((column) => [column.id, column]));
+  const ordered = order.map((id) => byId.get(id)).filter((column) => Boolean(column));
+  const visibleHideableCount = visibleColumns.filter((id) => byId.has(id)).length;
+  const dropOn = (id) => {
+    if (!dragId || dragId === id) return;
+    const without = order.filter((key) => key !== dragId);
+    without.splice(without.indexOf(id), 0, dragId);
+    onReorder(without);
+    setDragId(null);
+  };
+  return /* @__PURE__ */ jsxs(default2, { children: [
+    /* @__PURE__ */ jsxs(default2, { sx: { display: "flex", alignItems: "center", justifyContent: "space-between", px: 1.5, py: 1 }, children: [
+      /* @__PURE__ */ jsx(Text, { variant: "caption", as: "span", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { color: "text.secondary" }, "data-testid": `${testIdPrefix}-columns-count`, children: copy.columns.visibleCount(visibleHideableCount, columns.length) }) }),
+      /* @__PURE__ */ jsxs(default2, { sx: { display: "flex", gap: 1 }, children: [
+        /* @__PURE__ */ jsx(LinkButton, { label: copy.columns.showAll, onClick: onShowAll, testId: `${testIdPrefix}-columns-show-all` }),
+        /* @__PURE__ */ jsx(LinkButton, { label: copy.columns.reset, onClick: onReset, testId: `${testIdPrefix}-columns-reset`, muted: true })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(Text, { variant: "caption", as: "p", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { px: 1.5, pb: 0.5, display: "block", color: "text.disabled" }, children: copy.columns.dragHint }) }),
+    /* @__PURE__ */ jsx(default2, { sx: { px: 0.75, pb: 0.75 }, children: ordered.map((column) => /* @__PURE__ */ jsx(
+      ColumnRow,
+      {
+        column,
+        visible: visibleColumns.includes(column.id),
+        dragging: dragId === column.id,
+        onToggle,
+        onDragStart: () => setDragId(column.id),
+        onDragEnd: () => setDragId(null),
+        onDrop: () => dropOn(column.id),
+        onMove: (delta) => onReorder(moved(order, column.id, delta)),
+        testIdPrefix
+      },
+      column.id
+    )) })
+  ] });
+}
+function LinkButton({
+  label,
+  onClick,
+  testId,
+  muted
+}) {
+  return /* @__PURE__ */ jsx(
+    default2,
+    {
+      component: "button",
+      type: "button",
+      onClick,
+      "data-testid": testId,
+      sx: {
+        border: 0,
+        background: "none",
+        cursor: "pointer",
+        font: "inherit",
+        fontSize: "0.75rem",
+        p: 0,
+        color: muted ? "text.secondary" : "primary.main",
+        "&:hover": { textDecoration: "underline" }
+      },
+      children: label
+    }
+  );
+}
+function ColumnRow({
+  column,
+  visible,
+  dragging,
+  onToggle,
+  onDragStart,
+  onDragEnd,
+  onDrop,
+  onMove,
+  testIdPrefix
+}) {
+  const copy = useDataViewsCopy();
+  return /* @__PURE__ */ jsxs(
+    default2,
+    {
+      draggable: true,
+      onDragStart,
+      onDragEnd,
+      onDragOver: (event) => event.preventDefault(),
+      onDrop,
+      "data-testid": `${testIdPrefix}-column-row-${column.id}`,
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        gap: 0.5,
+        px: 0.75,
+        py: 0.25,
+        borderRadius: 1,
+        opacity: dragging ? 0.4 : 1,
+        "&:hover": { bgcolor: "action.hover" },
+        "&:hover .dv-col-move": { opacity: 1 }
+      },
+      children: [
+        /* @__PURE__ */ jsx(default2, { component: "span", "aria-hidden": true, sx: { display: "flex", color: "action.disabled", cursor: "grab" }, children: /* @__PURE__ */ jsx(DragIndicatorRoundedIcon, { fontSize: "small" }) }),
+        /* @__PURE__ */ jsx(
+          Checkbox,
+          {
+            size: "small",
+            checked: visible,
+            onChange: (event) => onToggle(column.id, event.target.checked),
+            inputProps: { "aria-label": column.label },
+            "data-testid": `${testIdPrefix}-column-toggle-${column.id}`
+          }
+        ),
+        /* @__PURE__ */ jsx(Text, { variant: "caption", as: "span", children: /* @__PURE__ */ jsx(default2, { component: "span", sx: { flex: 1, color: visible ? "text.primary" : "text.disabled" }, children: column.label }) }),
+        /* @__PURE__ */ jsxs(default2, { className: "dv-col-move", sx: { ml: "auto", display: "flex", opacity: 0, transition: "opacity .15s" }, children: [
+          /* @__PURE__ */ jsx(MoveButton, { label: copy.columns.moveUp(column.label), onClick: () => onMove(-1), up: true }),
+          /* @__PURE__ */ jsx(MoveButton, { label: copy.columns.moveDown(column.label), onClick: () => onMove(1) })
+        ] })
+      ]
+    }
+  );
+}
+function MoveButton({
+  label,
+  onClick,
+  up
+}) {
+  return /* @__PURE__ */ jsx(
+    default2,
+    {
+      component: "button",
+      type: "button",
+      "aria-label": label,
+      onClick,
+      sx: {
+        display: "flex",
+        border: 0,
+        p: 0.25,
+        background: "none",
+        borderRadius: 0.5,
+        cursor: "pointer",
+        color: "text.secondary",
+        "&:hover": { bgcolor: "action.selected" }
+      },
+      children: up ? /* @__PURE__ */ jsx(ArrowUpwardRoundedIcon, { sx: { fontSize: 14 } }) : /* @__PURE__ */ jsx(ArrowDownwardRoundedIcon, { sx: { fontSize: 14 } })
+    }
+  );
+}
+
+export {
+  ColumnsTab
+};
+//# sourceMappingURL=chunk-GO4MVQGC.js.map

package/dist/chunk-GT7C6TSM.js

@@ -0,0 +1,170 @@
+import {
+  NavigationMegaSection
+} from "./chunk-RRX6ZTNX.js";
+import {
+  NavigationStandardBody
+} from "./chunk-ZDWU52DJ.js";
+import {
+  LogoBar,
+  NavigationShell
+} from "./chunk-Q444G5X7.js";
+
+// src/components/navigation/NavigationMenu/NavigationMenu.tsx
+import Box from "@mui/material/Box/index.js";
+import Paper from "@mui/material/Paper/index.js";
+import React, { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var MegaMenuLayout = React.forwardRef(
+  ({
+    variant,
+    logo,
+    items,
+    size,
+    minimal,
+    dataTestId: _dataTestId,
+    className,
+    maxWidth,
+    style,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsx(
+      NavigationShell,
+      {
+        ref,
+        variant,
+        minimal,
+        className,
+        style: { maxWidth, ...style },
+        ...props,
+        children: /* @__PURE__ */ jsxs(
+          Paper,
+          {
+            elevation: minimal ? 0 : 1,
+            sx: {
+              width: "100%",
+              overflow: "hidden",
+              background: minimal ? "transparent" : void 0
+            },
+            children: [
+              logo && /* @__PURE__ */ jsx(LogoBar, { children: logo }),
+              /* @__PURE__ */ jsx(
+                Box,
+                {
+                  sx: {
+                    display: "grid",
+                    gridTemplateColumns: "repeat(auto-fit, minmax(280px, 1fr))",
+                    gap: 3,
+                    p: 3
+                  },
+                  children: items.map((section, sectionIndex) => /* @__PURE__ */ jsx(
+                    NavigationMegaSection,
+                    {
+                      section,
+                      sectionIndex,
+                      variant,
+                      size,
+                      minimal
+                    },
+                    section.id
+                  ))
+                }
+              )
+            ]
+          }
+        )
+      }
+    );
+  }
+);
+MegaMenuLayout.displayName = "MegaMenuLayout";
+var NAVIGATION_DEFAULTS = {
+  variant: "vertical",
+  size: "md",
+  minimal: false,
+  collapsible: false,
+  showDividers: false
+};
+var resolveProps = (props) => ({
+  ...NAVIGATION_DEFAULTS,
+  ...Object.fromEntries(
+    Object.entries(props).filter(([, value]) => value !== void 0)
+  )
+});
+var NavigationMenu = React.forwardRef(
+  (componentProps, ref) => {
+    const {
+      variant,
+      items,
+      size,
+      minimal,
+      collapsible,
+      collapsed: controlledCollapsed,
+      onCollapseChange,
+      logo,
+      endContent,
+      maxWidth,
+      showDividers,
+      className,
+      style,
+      ...props
+    } = resolveProps(componentProps);
+    const [internalCollapsed, setInternalCollapsed] = useState(false);
+    const isControlled = controlledCollapsed !== void 0;
+    const collapsed = isControlled ? controlledCollapsed : internalCollapsed;
+    const handleCollapseToggle = () => {
+      if (!isControlled) setInternalCollapsed(!collapsed);
+      onCollapseChange?.(!collapsed);
+    };
+    if (variant === "mega") {
+      return /* @__PURE__ */ jsx(
+        MegaMenuLayout,
+        {
+          ref,
+          variant,
+          collapsed,
+          logo,
+          items,
+          size,
+          minimal,
+          className,
+          maxWidth,
+          style,
+          ...props
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx(
+      NavigationShell,
+      {
+        ref,
+        variant,
+        minimal,
+        collapsed,
+        className,
+        style,
+        ...props,
+        children: /* @__PURE__ */ jsx(
+          NavigationStandardBody,
+          {
+            variant,
+            size,
+            minimal,
+            collapsed,
+            collapsible,
+            showDividers,
+            items,
+            logo,
+            endContent,
+            onCollapseToggle: handleCollapseToggle
+          }
+        )
+      }
+    );
+  }
+);
+NavigationMenu.displayName = "NavigationMenu";
+
+export {
+  NavigationMenu
+};
+//# sourceMappingURL=chunk-GT7C6TSM.js.map

package/dist/chunk-GY6KNVMI.js

@@ -0,0 +1,39 @@
+import {
+  ICON_SIZES
+} from "./chunk-RTSK5OZT.js";
+
+// src/components/form/Select/Select.metrics.ts
+var inputVariantFor = (variant) => variant === "default" ? "outlined" : variant;
+var selectInputSize = (size) => size === "sm" ? "sm" : "md";
+var SELECT_ICON = {
+  size: ICON_SIZES.md,
+  right: 7,
+  displayPaddingRight: 32,
+  openRotateDeg: 180
+};
+var SELECT_ICON_GAP = SELECT_ICON.displayPaddingRight - SELECT_ICON.size - SELECT_ICON.right;
+var SELECT_DISPLAY_MIN_HEIGHT = 23;
+var SELECT_MENU = {
+  itemMinHeight: 48,
+  itemPaddingVertical: 6,
+  itemPaddingHorizontal: 16,
+  listPaddingVertical: 8,
+  selectedAlpha: { light: 0.08, dark: 0.16 },
+  disabledOpacity: 0.38,
+  /** MUI's `Menu` paper is `calc(100% - 96px)` tall at most. */
+  maxHeightInset: 96
+};
+var MUI_MENU_SHADOW = "0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)";
+var selectedWashAlpha = (theme) => theme.mode === "dark" ? SELECT_MENU.selectedAlpha.dark : SELECT_MENU.selectedAlpha.light;
+
+export {
+  inputVariantFor,
+  selectInputSize,
+  SELECT_ICON,
+  SELECT_ICON_GAP,
+  SELECT_DISPLAY_MIN_HEIGHT,
+  SELECT_MENU,
+  MUI_MENU_SHADOW,
+  selectedWashAlpha
+};
+//# sourceMappingURL=chunk-GY6KNVMI.js.map

package/dist/chunk-GY6KNVMI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/Select/Select.metrics.ts"],"sourcesContent":["import type { SelectVariant } from './Select.base';\nimport type { InputVariant } from '../Input/Input.base';\nimport { ICON_SIZES } from '../../../icons/Icon.types';\nimport type { UiTheme } from '../../../tokens/theme';\nimport type { SizeValue } from '../../../tokens/vocabulary';\n\n/**\n * THE NUMBERS BOTH `Select` RENDERERS DRAW WITH.\n *\n * A `Select` on the web IS an `OutlinedInput` with a display slot and an arrow\n * where the value would be typed, so the box's own numbers — the padding, the\n * border, the radius, the field edge — are `Input.metrics.ts`'s, read through\n * {@link inputVariantFor} rather than restated. What is here is what a select\n * has and a text field does not: the arrow, the option list, and the two\n * heights MUI's `FormControl` offers.\n */\n\n/** Our three variants onto the `Input` variant that draws the same box. */\nexport const inputVariantFor = (variant: SelectVariant): InputVariant =>\n  variant === 'default' ? 'outlined' : variant;\n\n/**\n * The house scale as a `FormControl` size.\n *\n * Not `muiSize`: that collapses five onto MUI's three, and a FormControl takes\n * only two — `sm` draws small and EVERY other step, `xs` included, draws\n * medium. Restated from `Select.tsx`'s `formControlSize` so the native side\n * reads the same lossy map rather than inventing a kinder one.\n */\nexport const selectInputSize = (size: SizeValue | undefined): 'sm' | 'md' =>\n  size === 'sm' ? 'sm' : 'md';\n\n/**\n * The arrow: MUI's `ArrowDropDown` at `SvgIcon`'s medium size, 7px from the\n * right edge, turned over while the list is open. The display slot reserves\n * 32px for it, so the flow-laid glyph takes the difference as a margin.\n */\nexport const SELECT_ICON = {\n  size: ICON_SIZES.md,\n  right: 7,\n  displayPaddingRight: 32,\n  openRotateDeg: 180,\n} as const;\n\n/** What the glyph leaves between itself and the value: 32 - 24 - 7. */\nexport const SELECT_ICON_GAP =\n  SELECT_ICON.displayPaddingRight - SELECT_ICON.size - SELECT_ICON.right;\n\n/** `.MuiSelect-select`'s floor, MUI's `1.4375em` at the 16px body size. */\nexport const SELECT_DISPLAY_MIN_HEIGHT = 23;\n\n/**\n * The option list: MUI's `Menu` over a `MenuList` of `MenuItem`s.\n *\n * `selectedAlpha` is `palette.action.selectedOpacity`, which MUI doubles in\n * dark mode; `disabledOpacity` is `palette.action.disabledOpacity`. Neither is\n * on `UiTheme`, whose `action` carries colours rather than opacities.\n */\nexport const SELECT_MENU = {\n  itemMinHeight: 48,\n  itemPaddingVertical: 6,\n  itemPaddingHorizontal: 16,\n  listPaddingVertical: 8,\n  selectedAlpha: { light: 0.08, dark: 0.16 },\n  disabledOpacity: 0.38,\n  /** MUI's `Menu` paper is `calc(100% - 96px)` tall at most. */\n  maxHeightInset: 96,\n} as const;\n\n/** MUI's `theme.shadows[8]`, the elevation a `Menu` paper rests at. */\nexport const MUI_MENU_SHADOW =\n  '0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12)';\n\n/** The wash behind the option the value currently names. */\nexport const selectedWashAlpha = (theme: UiTheme): number =>\n  theme.mode === 'dark' ? SELECT_MENU.selectedAlpha.dark : SELECT_MENU.selectedAlpha.light;\n\n/**\n * The box a select draws IS the input's box, so these are the input's tables\n * under this component's names — the border widths, the glass and gradient\n * alphas, the halo and the pulse. Restating them here is how the two controls\n * would come to disagree about what an outlined field looks like.\n */\nexport {\n  INPUT_BORDER as SELECT_BORDER,\n  INPUT_GLASS as SELECT_GLASS,\n  INPUT_GLOW as SELECT_GLOW,\n  INPUT_GRADIENT as SELECT_GRADIENT,\n  INPUT_PULSE as SELECT_PULSE,\n} from '../Input/Input.metrics';\n"],"mappings":";;;;;AAkBO,IAAM,kBAAkB,CAAC,YAC9B,YAAY,YAAY,aAAa;AAUhC,IAAM,kBAAkB,CAAC,SAC9B,SAAS,OAAO,OAAO;AAOlB,IAAM,cAAc;AAAA,EACzB,MAAM,WAAW;AAAA,EACjB,OAAO;AAAA,EACP,qBAAqB;AAAA,EACrB,eAAe;AACjB;AAGO,IAAM,kBACX,YAAY,sBAAsB,YAAY,OAAO,YAAY;AAG5D,IAAM,4BAA4B;AASlC,IAAM,cAAc;AAAA,EACzB,eAAe;AAAA,EACf,qBAAqB;AAAA,EACrB,uBAAuB;AAAA,EACvB,qBAAqB;AAAA,EACrB,eAAe,EAAE,OAAO,MAAM,MAAM,KAAK;AAAA,EACzC,iBAAiB;AAAA;AAAA,EAEjB,gBAAgB;AAClB;AAGO,IAAM,kBACX;AAGK,IAAM,oBAAoB,CAAC,UAChC,MAAM,SAAS,SAAS,YAAY,cAAc,OAAO,YAAY,cAAc;","names":[]}

package/dist/chunk-HI2OFZSZ.js

@@ -0,0 +1,75 @@
+import {
+  BOUNCE,
+  FADE_IN_SCALE,
+  GLOW_PULSE,
+  PULSE
+} from "./chunk-KVEHH4SA.js";
+
+// src/components/data-display/Badge/Badge.animations.ts
+import { keyframes } from "@mui/material/styles/index.js";
+var pulseAnimation = keyframes`
+  0% {
+    transform: scale(1);
+    opacity: 1;
+  }
+  70% {
+    transform: scale(${PULSE.scale});
+    opacity: ${PULSE.opacity};
+  }
+  100% {
+    transform: scale(1);
+    opacity: 1;
+  }
+`;
+var bounceAnimation = keyframes`
+  0%, 20%, 50%, 80%, 100% {
+    transform: translateY(0) scale(1);
+  }
+  40% {
+    transform: translateY(-${BOUNCE.lift}px) scale(${BOUNCE.scale});
+  }
+  60% {
+    transform: translateY(-${BOUNCE.secondLift}px) scale(${BOUNCE.secondScale});
+  }
+`;
+var shimmerAnimation = keyframes`
+  0% {
+    background-position: -1000px 0;
+  }
+  100% {
+    background-position: 1000px 0;
+  }
+`;
+var fadeInScaleAnimation = keyframes`
+  0% {
+    opacity: 0;
+    transform: scale(${FADE_IN_SCALE.from});
+  }
+  50% {
+    transform: scale(${FADE_IN_SCALE.overshoot});
+  }
+  100% {
+    opacity: 1;
+    transform: scale(1);
+  }
+`;
+var glowPulseAnimation = keyframes`
+  0% {
+    box-shadow: 0 0 ${GLOW_PULSE.fromBlur}px ${GLOW_PULSE.fromSpread}px rgba(var(--glow-color), ${GLOW_PULSE.fromAlpha});
+  }
+  50% {
+    box-shadow: 0 0 ${GLOW_PULSE.toBlur}px ${GLOW_PULSE.toSpread}px rgba(var(--glow-color), ${GLOW_PULSE.toAlpha});
+  }
+  100% {
+    box-shadow: 0 0 ${GLOW_PULSE.fromBlur}px ${GLOW_PULSE.fromSpread}px rgba(var(--glow-color), ${GLOW_PULSE.fromAlpha});
+  }
+`;
+
+export {
+  pulseAnimation,
+  bounceAnimation,
+  shimmerAnimation,
+  fadeInScaleAnimation,
+  glowPulseAnimation
+};
+//# sourceMappingURL=chunk-HI2OFZSZ.js.map

package/dist/chunk-HI2OFZSZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Badge/Badge.animations.ts"],"sourcesContent":["import { keyframes } from '@mui/material/styles/index.js';\n\nimport { BOUNCE, FADE_IN_SCALE, GLOW_PULSE, PULSE } from './Badge.metrics';\n\nexport const pulseAnimation = keyframes`\n  0% {\n    transform: scale(1);\n    opacity: 1;\n  }\n  70% {\n    transform: scale(${PULSE.scale});\n    opacity: ${PULSE.opacity};\n  }\n  100% {\n    transform: scale(1);\n    opacity: 1;\n  }\n`;\n\n// Define bounce animation\nexport const bounceAnimation = keyframes`\n  0%, 20%, 50%, 80%, 100% {\n    transform: translateY(0) scale(1);\n  }\n  40% {\n    transform: translateY(-${BOUNCE.lift}px) scale(${BOUNCE.scale});\n  }\n  60% {\n    transform: translateY(-${BOUNCE.secondLift}px) scale(${BOUNCE.secondScale});\n  }\n`;\n\n// Define shimmer animation\nexport const shimmerAnimation = keyframes`\n  0% {\n    background-position: -1000px 0;\n  }\n  100% {\n    background-position: 1000px 0;\n  }\n`;\n\n// Define fade in animation with scale\nexport const fadeInScaleAnimation = keyframes`\n  0% {\n    opacity: 0;\n    transform: scale(${FADE_IN_SCALE.from});\n  }\n  50% {\n    transform: scale(${FADE_IN_SCALE.overshoot});\n  }\n  100% {\n    opacity: 1;\n    transform: scale(1);\n  }\n`;\n\n// Define glow pulse animation\nexport const glowPulseAnimation = keyframes`\n  0% {\n    box-shadow: 0 0 ${GLOW_PULSE.fromBlur}px ${GLOW_PULSE.fromSpread}px rgba(var(--glow-color), ${GLOW_PULSE.fromAlpha});\n  }\n  50% {\n    box-shadow: 0 0 ${GLOW_PULSE.toBlur}px ${GLOW_PULSE.toSpread}px rgba(var(--glow-color), ${GLOW_PULSE.toAlpha});\n  }\n  100% {\n    box-shadow: 0 0 ${GLOW_PULSE.fromBlur}px ${GLOW_PULSE.fromSpread}px rgba(var(--glow-color), ${GLOW_PULSE.fromAlpha});\n  }\n`;\n"],"mappings":";;;;;;;;AAAA,SAAS,iBAAiB;AAInB,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAMP,MAAM,KAAK;AAAA,eACnB,MAAM,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASrB,IAAM,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA,6BAKF,OAAO,IAAI,aAAa,OAAO,KAAK;AAAA;AAAA;AAAA,6BAGpC,OAAO,UAAU,aAAa,OAAO,WAAW;AAAA;AAAA;AAKtE,IAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUzB,IAAM,uBAAuB;AAAA;AAAA;AAAA,uBAGb,cAAc,IAAI;AAAA;AAAA;AAAA,uBAGlB,cAAc,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvC,IAAM,qBAAqB;AAAA;AAAA,sBAEZ,WAAW,QAAQ,MAAM,WAAW,UAAU,8BAA8B,WAAW,SAAS;AAAA;AAAA;AAAA,sBAGhG,WAAW,MAAM,MAAM,WAAW,QAAQ,8BAA8B,WAAW,OAAO;AAAA;AAAA;AAAA,sBAG1F,WAAW,QAAQ,MAAM,WAAW,UAAU,8BAA8B,WAAW,SAAS;AAAA;AAAA;","names":[]}

package/dist/chunk-HKKSZ7HG.js

@@ -0,0 +1,59 @@
+import {
+  AddressTextField
+} from "./chunk-3W7IEWEL.js";
+
+// src/components/form/AddressAutocomplete/AddressFallbackField.tsx
+import Alert from "@mui/material/Alert/index.js";
+import Box from "@mui/material/Box/index.js";
+import CircularProgress from "@mui/material/CircularProgress/index.js";
+import InputAdornment from "@mui/material/InputAdornment/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+var AddressFallbackField = ({
+  copy,
+  variant,
+  label,
+  placeholder,
+  icon,
+  floating,
+  fullWidth,
+  mapsError
+}) => {
+  const startAdornment = icon ? /* @__PURE__ */ jsx(InputAdornment, { position: "start", children: icon }) : void 0;
+  if (!mapsError) {
+    return /* @__PURE__ */ jsx(
+      AddressTextField,
+      {
+        addressVariant: variant,
+        label: floating ? void 0 : label,
+        placeholder: copy.loadingMaps,
+        disabled: true,
+        fullWidth,
+        InputProps: {
+          startAdornment,
+          endAdornment: /* @__PURE__ */ jsx(CircularProgress, { color: "inherit", size: 20 })
+        }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(
+      AddressTextField,
+      {
+        addressVariant: variant,
+        label: floating ? void 0 : label,
+        placeholder,
+        error: true,
+        disabled: true,
+        fullWidth,
+        helperText: mapsError,
+        InputProps: { startAdornment }
+      }
+    ),
+    /* @__PURE__ */ jsx(Alert, { severity: "error", sx: { mt: 1 }, children: copy.mapsLoadFailed })
+  ] });
+};
+
+export {
+  AddressFallbackField
+};
+//# sourceMappingURL=chunk-HKKSZ7HG.js.map