@12-apps/ui 6.33.1 → 6.34.0

package/dist/chunk-AL6Z2JYR.js

@@ -0,0 +1,241 @@
+import {
+  GridMain
+} from "./chunk-XOL2QCSP.js";
+import {
+  FilterDialog,
+  GridFilterPanel
+} from "./chunk-5QTMJ2RU.js";
+import {
+  DataViewsEmpty
+} from "./chunk-YA4YH6WP.js";
+import {
+  InlineFilterControls
+} from "./chunk-7VIINULX.js";
+import {
+  GridHeaderRow
+} from "./chunk-ECZXTIDR.js";
+import {
+  DataViewsPagination
+} from "./chunk-UXWU5NRC.js";
+import {
+  toOverflowFields,
+  useFilterOverflow
+} from "./chunk-TQ6FPOPD.js";
+import {
+  resolveSelectionExtra
+} from "./chunk-KX75HM5U.js";
+import {
+  ScopeTabsSlot
+} from "./chunk-27DLUKDF.js";
+import {
+  ShellToolbar
+} from "./chunk-46ADSOCF.js";
+import {
+  togglePillValues
+} from "./chunk-TNDV33LP.js";
+import {
+  DataViewsLayoutProvider,
+  useDataViewsLayout
+} from "./chunk-2XGGHYEA.js";
+import {
+  useDataViewsCopy
+} from "./chunk-KHG57NAE.js";
+import {
+  TableFilter
+} from "./chunk-NMX3JAAB.js";
+import {
+  default as default2
+} from "./chunk-WEBEOBN5.js";
+
+// src/components/data-display/DataViews/data-views-grid-parts.tsx
+import { useEffect, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+function LayoutStateSync({
+  c
+}) {
+  const { layout } = useDataViewsLayout();
+  const stored = c.state.layout;
+  useEffect(() => {
+    if (stored !== layout) c.patch({ layout });
+  }, [layout, stored]);
+  return null;
+}
+function useGridShellFilters({
+  c,
+  inlineFilters,
+  fields,
+  rangeFields,
+  testIdPrefix,
+  alwaysShowSearch,
+  hasExport
+}) {
+  const { state } = c;
+  const [openControls, setOpenControls] = useState(0);
+  const split = useFilterOverflow(
+    toOverflowFields(fields, rangeFields),
+    state.pills,
+    c.ranges,
+    openControls > 0,
+    hasExport
+  );
+  const showInline = inlineFilters;
+  const useModal = false;
+  const inlineVisible = showInline && (alwaysShowSearch || fields.length > 0 || rangeFields.length > 0 || state.search !== "");
+  const filterProps = {
+    testIdPrefix,
+    search: state.search,
+    fields,
+    rangeFields,
+    pills: state.pills,
+    ranges: c.ranges,
+    onSearchChange: (value) => c.patch({ search: value }),
+    // Updater, never the render's `state` — see {@link DataViewStatePatch}.
+    onTogglePill: (fieldId, value, checked) => c.patch(({ pills }) => ({ pills: { ...pills, [fieldId]: togglePillValues(pills[fieldId], value, checked) } })),
+    onChangeRange: (fieldId, range) => c.patch({ ranges: { ...c.ranges, [fieldId]: range } }),
+    onClearField: (fieldId) => c.patch({ pills: { ...state.pills, [fieldId]: [] } }),
+    onClearAll: () => c.patch({ search: "", pills: {}, ranges: {} })
+  };
+  return {
+    showInline,
+    useModal,
+    inlineVisible,
+    filterProps,
+    split,
+    onControlOpenChange: (open) => setOpenControls((count) => Math.max(0, count + (open ? 1 : -1)))
+  };
+}
+function ShellStack({
+  props,
+  filters
+}) {
+  const copy = useDataViewsCopy();
+  const { c, testIdPrefix, dataTestId, scopes = [], emptyState, inlineFilters = false } = props;
+  const { showInline, useModal, inlineVisible, filterProps, split, onControlOpenChange } = filters;
+  const body = /* @__PURE__ */ jsx(
+    DataViewsEmpty,
+    {
+      filtered: c.activeFilterCount > 0 || c.state.search !== "",
+      onClearFilters: () => c.patch({ search: "", pills: {}, ranges: {} }),
+      emptyState,
+      testIdPrefix
+    }
+  );
+  return /* @__PURE__ */ jsx(
+    TableFilter,
+    {
+      copy: copy.tableFilter,
+      open: c.filterOpen,
+      onOpenChange: c.setFilterOpen,
+      hasActiveFilters: c.activeFilterCount > 0,
+      children: /* @__PURE__ */ jsxs(default2, { spacing: 0, "data-testid": dataTestId ? `${dataTestId}-container` : void 0, children: [
+        /* @__PURE__ */ jsx(GridHeaderRow, { title: props.title, headerActions: props.headerActions, testIdPrefix }),
+        /* @__PURE__ */ jsx(
+          ShellToolbar,
+          {
+            c,
+            rows: props.rows,
+            sortKinds: props.sortKinds,
+            displayView: props.displayView,
+            exportConfig: props.exportConfig,
+            filterControls: inlineVisible ? /* @__PURE__ */ jsx(
+              InlineFilterControls,
+              {
+                ...filterProps,
+                split,
+                activeFilterCount: c.activeFilterCount,
+                onControlOpenChange
+              }
+            ) : void 0,
+            barRef: split.barRef,
+            testIdPrefix,
+            rowActions: props.rowActions,
+            bulkActions: props.bulkActions,
+            selectionExtra: resolveSelectionExtra(props),
+            toolbarRightSlot: props.toolbarRightSlot,
+            compactControls: showInline && split.compactControls,
+            counterHidden: showInline && split.counterHidden,
+            showInline
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ScopeTabsSlot,
+          {
+            scopes,
+            scopeFieldId: props.scopeFieldId,
+            board: props.board,
+            value: c.scope,
+            onChange: c.setScope,
+            counts: c.scopeCounts,
+            testIdPrefix
+          }
+        ),
+        /* @__PURE__ */ jsxs(TableFilter.Layout, { children: [
+          /* @__PURE__ */ jsxs(TableFilter.Main, { children: [
+            /* @__PURE__ */ jsx(
+              GridMain,
+              {
+                c,
+                getRowId: props.getRowId,
+                renderCard: props.renderCard,
+                renderListRow: props.renderListRow,
+                listGroup: props.listGroup,
+                board: props.board,
+                rowDetail: props.rowDetail,
+                dataTestId,
+                testIdPrefix,
+                emptyState: body
+              }
+            ),
+            /* @__PURE__ */ jsx(DataViewsPagination, { c, testIdPrefix })
+          ] }),
+          inlineFilters ? null : /* @__PURE__ */ jsx(GridFilterPanel, { ...filterProps })
+        ] }),
+        useModal && /* @__PURE__ */ jsx(FilterDialog, { open: c.filterOpen, onClose: () => c.setFilterOpen(false), ...filterProps })
+      ] })
+    }
+  );
+}
+function GridShell(props) {
+  const {
+    c,
+    fields,
+    rangeFields,
+    testIdPrefix,
+    renderCard,
+    renderListRow,
+    board,
+    defaultLayout,
+    ignoreStoredLayout,
+    inlineFilters = false,
+    alwaysShowSearch = false
+  } = props;
+  const filters = useGridShellFilters({
+    c,
+    inlineFilters,
+    fields,
+    rangeFields,
+    testIdPrefix,
+    alwaysShowSearch,
+    hasExport: props.exportConfig !== void 0
+  });
+  return /* @__PURE__ */ jsxs(
+    DataViewsLayoutProvider,
+    {
+      canUseCards: Boolean(renderCard),
+      canUseList: Boolean(renderListRow),
+      canUseBoard: Boolean(board && renderCard),
+      defaultLayout,
+      ignoreStoredLayout,
+      viewLayout: c.state.layout,
+      children: [
+        /* @__PURE__ */ jsx(LayoutStateSync, { c }),
+        /* @__PURE__ */ jsx(ShellStack, { props, filters })
+      ]
+    }
+  );
+}
+
+export {
+  GridShell
+};
+//# sourceMappingURL=chunk-AL6Z2JYR.js.map

package/dist/chunk-AMTFP7QA.js

@@ -0,0 +1,94 @@
+import {
+  fieldEdge
+} from "./chunk-7FDU3FIN.js";
+import {
+  absoluteInk,
+  controlNeutral
+} from "./chunk-FQ6UW7IY.js";
+
+// src/components/form/Textarea/Textarea.styles.ts
+import { alpha, keyframes } from "@mui/material/styles/index.js";
+var glowAnimation = keyframes`
+  0% {
+    box-shadow: 0 0 5px currentColor;
+  }
+  50% {
+    box-shadow: 0 0 20px currentColor, 0 0 30px currentColor;
+  }
+  100% {
+    box-shadow: 0 0 5px currentColor;
+  }
+`;
+var floatAnimation = keyframes`
+  0% {
+    transform: translateY(0px);
+  }
+  50% {
+    transform: translateY(-3px);
+  }
+  100% {
+    transform: translateY(0px);
+  }
+`;
+var neutralPalette = (theme) => controlNeutral(theme);
+var pick = (...candidates) => candidates.find(Boolean) ?? "";
+var withFallbacks = (theme, palette) => ({
+  main: pick(palette?.main, theme.palette.primary.main),
+  dark: pick(palette?.dark, palette?.main, theme.palette.primary.dark),
+  light: pick(palette?.light, palette?.main, theme.palette.primary.light),
+  contrastText: pick(palette?.contrastText, absoluteInk(theme).white)
+});
+var getColorFromTheme = (theme, color) => {
+  if (color === "neutral") return neutralPalette(theme);
+  const colorMap = {
+    primary: theme.palette.primary,
+    secondary: theme.palette.secondary,
+    success: theme.palette.success,
+    warning: theme.palette.warning,
+    info: theme.palette.info,
+    danger: theme.palette.error
+  };
+  return withFallbacks(theme, colorMap[color] || theme.palette.primary);
+};
+var textareaEmphasisStyles = ({
+  theme,
+  colorPalette,
+  glass,
+  gradient,
+  glow
+}) => {
+  const glassStyles = glass ? {
+    backgroundColor: alpha(theme.palette.background.paper, 0.1),
+    backdropFilter: "blur(20px)",
+    border: `1px solid ${fieldEdge(theme)}`,
+    "&:hover": {
+      backgroundColor: alpha(theme.palette.background.paper, 0.15),
+      backdropFilter: "blur(25px)"
+    },
+    "&:focus": {
+      backgroundColor: alpha(theme.palette.background.paper, 0.2),
+      backdropFilter: "blur(30px)"
+    }
+  } : {};
+  const gradientStyles = gradient ? {
+    background: `linear-gradient(${theme.palette.background.paper}, ${theme.palette.background.paper}) padding-box,
+               linear-gradient(135deg, ${colorPalette.main}, ${colorPalette.light}) border-box`,
+    border: "2px solid transparent",
+    "&:focus": {
+      background: `linear-gradient(${theme.palette.background.paper}, ${theme.palette.background.paper}) padding-box,
+                 linear-gradient(135deg, ${colorPalette.main}, ${colorPalette.dark}) border-box`
+    }
+  } : {};
+  const glowStyles = glow ? {
+    animation: `${glowAnimation} 2s ease-in-out infinite`,
+    boxShadow: `0 0 10px ${alpha(colorPalette.main, 0.3)}`
+  } : {};
+  return { ...glassStyles, ...gradientStyles, ...glowStyles };
+};
+
+export {
+  floatAnimation,
+  getColorFromTheme,
+  textareaEmphasisStyles
+};
+//# sourceMappingURL=chunk-AMTFP7QA.js.map

package/dist/chunk-AMTFP7QA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/form/Textarea/Textarea.styles.ts"],"sourcesContent":["import { alpha, keyframes } from '@mui/material/styles/index.js';\nimport type { CSSObject, Theme } from '@mui/material/styles/index.js';\n\nimport { fieldEdge } from '../../../tokens/field-edge';\nimport { absoluteInk, controlNeutral } from '../../../tokens/ink';\n\nconst glowAnimation = keyframes`\n  0% {\n    box-shadow: 0 0 5px currentColor;\n  }\n  50% {\n    box-shadow: 0 0 20px currentColor, 0 0 30px currentColor;\n  }\n  100% {\n    box-shadow: 0 0 5px currentColor;\n  }\n`;\n\n// Ripple animation for buttons (commented out - not currently used)\n// const rippleAnimation = keyframes`\n//   0% {\n//     transform: scale(0);\n//     opacity: 1;\n//   }\n//   100% {\n//     transform: scale(4);\n//     opacity: 0;\n//   }\n// `;\n\n// Float animation for rich text toolbar\nexport const floatAnimation = keyframes`\n  0% {\n    transform: translateY(0px);\n  }\n  50% {\n    transform: translateY(-3px);\n  }\n  100% {\n    transform: translateY(0px);\n  }\n`;\n\ntype ResolvedPalette = {\n  main: string;\n  dark: string;\n  light: string;\n  contrastText: string;\n};\n\ntype PartialPalette = { main: string; dark?: string; light?: string; contrastText?: string };\n\n// `neutral` is not a MUI palette entry, so it is the controls' neutral tone.\nconst neutralPalette = (theme: Theme): ResolvedPalette => controlNeutral(theme);\n\n// Each slot falls back to the palette's own main, then to primary — a custom\n// theme can define main without dark or light.\nconst pick = (...candidates: Array<string | undefined>): string =>\n  candidates.find(Boolean) ?? '';\n\nconst withFallbacks = (theme: Theme, palette: PartialPalette): ResolvedPalette => ({\n  main: pick(palette?.main, theme.palette.primary.main),\n  dark: pick(palette?.dark, palette?.main, theme.palette.primary.dark),\n  light: pick(palette?.light, palette?.main, theme.palette.primary.light),\n  contrastText: pick(palette?.contrastText, absoluteInk(theme).white),\n});\n\nexport const getColorFromTheme = (theme: Theme, color: string): ResolvedPalette => {\n  if (color === 'neutral') return neutralPalette(theme);\n\n  const colorMap: Record<string, PartialPalette> = {\n    primary: theme.palette.primary,\n    secondary: theme.palette.secondary,\n    success: theme.palette.success,\n    warning: theme.palette.warning,\n    info: theme.palette.info,\n    danger: theme.palette.error,\n  };\n\n  return withFallbacks(theme, colorMap[color] || theme.palette.primary);\n};\n\n// glass, gradient and glow are independent flags that each layer styles onto the\n// base. Spelled out here rather than inline so the styled() callback keeps one\n// branch instead of three.\nexport const textareaEmphasisStyles = ({\n  theme,\n  colorPalette,\n  glass,\n  gradient,\n  glow,\n}: {\n  theme: Theme;\n  colorPalette: { main: string; light?: string; dark?: string };\n  glass?: boolean;\n  gradient?: boolean;\n  glow?: boolean;\n}): CSSObject => {\nconst glassStyles = glass\n  ? {\n      backgroundColor: alpha(theme.palette.background.paper, 0.1),\n      backdropFilter: 'blur(20px)',\n      border: `1px solid ${fieldEdge(theme)}`,\n      '&:hover': {\n        backgroundColor: alpha(theme.palette.background.paper, 0.15),\n        backdropFilter: 'blur(25px)',\n      },\n      '&:focus': {\n        backgroundColor: alpha(theme.palette.background.paper, 0.2),\n        backdropFilter: 'blur(30px)',\n      },\n    }\n  : {};\n\n// Gradient border effect\nconst gradientStyles = gradient\n  ? {\n      background: `linear-gradient(${theme.palette.background.paper}, ${theme.palette.background.paper}) padding-box,\n               linear-gradient(135deg, ${colorPalette.main}, ${colorPalette.light}) border-box`,\n      border: '2px solid transparent',\n      '&:focus': {\n        background: `linear-gradient(${theme.palette.background.paper}, ${theme.palette.background.paper}) padding-box,\n                 linear-gradient(135deg, ${colorPalette.main}, ${colorPalette.dark}) border-box`,\n      },\n    }\n  : {};\n\n// Glow effect\nconst glowStyles = glow\n  ? {\n      animation: `${glowAnimation} 2s ease-in-out infinite`,\n      boxShadow: `0 0 10px ${alpha(colorPalette.main, 0.3)}`,\n    }\n  : {};\n\n  return { ...glassStyles, ...gradientStyles, ...glowStyles };\n};\n"],"mappings":";;;;;;;;;AAAA,SAAS,OAAO,iBAAiB;AAMjC,IAAM,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBf,IAAM,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAsB9B,IAAM,iBAAiB,CAAC,UAAkC,eAAe,KAAK;AAI9E,IAAM,OAAO,IAAI,eACf,WAAW,KAAK,OAAO,KAAK;AAE9B,IAAM,gBAAgB,CAAC,OAAc,aAA8C;AAAA,EACjF,MAAM,KAAK,SAAS,MAAM,MAAM,QAAQ,QAAQ,IAAI;AAAA,EACpD,MAAM,KAAK,SAAS,MAAM,SAAS,MAAM,MAAM,QAAQ,QAAQ,IAAI;AAAA,EACnE,OAAO,KAAK,SAAS,OAAO,SAAS,MAAM,MAAM,QAAQ,QAAQ,KAAK;AAAA,EACtE,cAAc,KAAK,SAAS,cAAc,YAAY,KAAK,EAAE,KAAK;AACpE;AAEO,IAAM,oBAAoB,CAAC,OAAc,UAAmC;AACjF,MAAI,UAAU,UAAW,QAAO,eAAe,KAAK;AAEpD,QAAM,WAA2C;AAAA,IAC/C,SAAS,MAAM,QAAQ;AAAA,IACvB,WAAW,MAAM,QAAQ;AAAA,IACzB,SAAS,MAAM,QAAQ;AAAA,IACvB,SAAS,MAAM,QAAQ;AAAA,IACvB,MAAM,MAAM,QAAQ;AAAA,IACpB,QAAQ,MAAM,QAAQ;AAAA,EACxB;AAEA,SAAO,cAAc,OAAO,SAAS,KAAK,KAAK,MAAM,QAAQ,OAAO;AACtE;AAKO,IAAM,yBAAyB,CAAC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAMiB;AACjB,QAAM,cAAc,QAChB;AAAA,IACE,iBAAiB,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG;AAAA,IAC1D,gBAAgB;AAAA,IAChB,QAAQ,aAAa,UAAU,KAAK,CAAC;AAAA,IACrC,WAAW;AAAA,MACT,iBAAiB,MAAM,MAAM,QAAQ,WAAW,OAAO,IAAI;AAAA,MAC3D,gBAAgB;AAAA,IAClB;AAAA,IACA,WAAW;AAAA,MACT,iBAAiB,MAAM,MAAM,QAAQ,WAAW,OAAO,GAAG;AAAA,MAC1D,gBAAgB;AAAA,IAClB;AAAA,EACF,IACA,CAAC;AAGL,QAAM,iBAAiB,WACnB;AAAA,IACE,YAAY,mBAAmB,MAAM,QAAQ,WAAW,KAAK,KAAK,MAAM,QAAQ,WAAW,KAAK;AAAA,yCAC7D,aAAa,IAAI,KAAK,aAAa,KAAK;AAAA,IAC3E,QAAQ;AAAA,IACR,WAAW;AAAA,MACT,YAAY,mBAAmB,MAAM,QAAQ,WAAW,KAAK,KAAK,MAAM,QAAQ,WAAW,KAAK;AAAA,2CAC7D,aAAa,IAAI,KAAK,aAAa,IAAI;AAAA,IAC5E;AAAA,EACF,IACA,CAAC;AAGL,QAAM,aAAa,OACf;AAAA,IACE,WAAW,GAAG,aAAa;AAAA,IAC3B,WAAW,YAAY,MAAM,aAAa,MAAM,GAAG,CAAC;AAAA,EACtD,IACA,CAAC;AAEH,SAAO,EAAE,GAAG,aAAa,GAAG,gBAAgB,GAAG,WAAW;AAC5D;","names":[]}

package/dist/chunk-B443IIQG.js

@@ -0,0 +1,167 @@
+import {
+  SettingsSectionChips
+} from "./chunk-SVSOUC5S.js";
+import {
+  SettingsSectionHeader
+} from "./chunk-4M6CEQVK.js";
+import {
+  TOUCH_TARGET,
+  atLeastRail,
+  displayAcrossRail
+} from "./chunk-LIG7TKIB.js";
+
+// src/components/layout/SettingsLayout/SettingsPanel.tsx
+import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
+import Box from "@mui/material/Box/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+function BackLink({
+  href,
+  label,
+  breakpoint,
+  linkComponent,
+  testIdPrefix
+}) {
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      component: linkComponent,
+      href,
+      "aria-label": label,
+      "data-testid": `${testIdPrefix}-back`,
+      sx: (theme) => ({
+        ...displayAcrossRail(theme, breakpoint, "inline-flex", "none"),
+        alignItems: "center",
+        gap: 0.5,
+        minHeight: TOUCH_TARGET,
+        pr: 1,
+        textDecoration: "none",
+        color: "text.secondary",
+        font: "inherit",
+        fontSize: "0.875rem"
+      }),
+      children: [
+        /* @__PURE__ */ jsx(ChevronLeftIcon, { fontSize: "small" }),
+        label
+      ]
+    }
+  );
+}
+function PanelBack({
+  href,
+  backLabel,
+  sectionTitle,
+  sectionDescription,
+  breakpoint,
+  linkComponent,
+  testIdPrefix
+}) {
+  if (sectionTitle === void 0) {
+    return /* @__PURE__ */ jsx(
+      BackLink,
+      {
+        href,
+        label: backLabel,
+        breakpoint,
+        linkComponent,
+        testIdPrefix
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    SettingsSectionHeader,
+    {
+      href,
+      backLabel,
+      title: sectionTitle,
+      description: sectionDescription,
+      breakpoint,
+      linkComponent,
+      testIdPrefix
+    }
+  );
+}
+function panelSx(breakpoint, hideOnNarrow, fillHeight) {
+  return (theme) => ({
+    display: hideOnNarrow ? "none" : "block",
+    flex: "1 1 auto",
+    minWidth: 0,
+    width: "100%",
+    [atLeastRail(theme, breakpoint)]: {
+      ...hideOnNarrow ? { display: "block" } : {},
+      ...fillHeight ? {
+        height: "100%",
+        minHeight: 0,
+        overflowY: "auto",
+        overscrollBehavior: "contain"
+      } : {}
+    }
+  });
+}
+function SettingsPanel({
+  inSection,
+  hideOnNarrow,
+  breakpoint,
+  indexHref,
+  backLabel,
+  sectionTitle,
+  sectionDescription,
+  ariaLabel,
+  sectionChips,
+  activeItemId,
+  linkComponent,
+  onSelectItem,
+  testIdPrefix,
+  fillHeight = false,
+  children
+}) {
+  const showBack = inSection && indexHref !== void 0 && linkComponent !== void 0;
+  const showChips = inSection && sectionChips !== void 0 && sectionChips.length > 0;
+  return /* @__PURE__ */ jsxs(
+    Box,
+    {
+      "data-testid": `${testIdPrefix}-panel`,
+      sx: panelSx(breakpoint, hideOnNarrow, fillHeight),
+      children: [
+        showBack ? /* @__PURE__ */ jsx(
+          PanelBack,
+          {
+            href: indexHref,
+            backLabel,
+            sectionTitle,
+            sectionDescription,
+            breakpoint,
+            linkComponent,
+            testIdPrefix
+          }
+        ) : null,
+        showChips ? /* @__PURE__ */ jsx(
+          Box,
+          {
+            sx: (theme) => ({
+              ...displayAcrossRail(theme, breakpoint, "block", "none"),
+              mb: 1,
+              minWidth: 0
+            }),
+            children: /* @__PURE__ */ jsx(
+              SettingsSectionChips,
+              {
+                items: sectionChips,
+                activeItemId,
+                ariaLabel,
+                linkComponent,
+                onSelectItem,
+                testIdPrefix
+              }
+            )
+          }
+        ) : null,
+        children
+      ]
+    }
+  );
+}
+
+export {
+  SettingsPanel
+};
+//# sourceMappingURL=chunk-B443IIQG.js.map