@12-apps/ui 6.11.0 → 6.12.0

package/dist/chunk-WQSL6MCA.js

@@ -0,0 +1,288 @@
+import {
+  TABLE_DEFAULTS,
+  definedProps
+} from "./chunk-MTFCPPZ5.js";
+import {
+  EmptyRow,
+  NoDataPlaceholder
+} from "./chunk-XIXR2L3L.js";
+import {
+  EnhancedTableBody,
+  EnhancedTableHeader
+} from "./chunk-ULTOQ6ZV.js";
+import {
+  useTableSelection
+} from "./chunk-DF4K5XVW.js";
+import {
+  tableStyles
+} from "./chunk-P2PDDFMM.js";
+
+// src/components/data-display/Table/Table.tsx
+import MoreVertIcon from "@mui/icons-material/MoreVert";
+import Box from "@mui/material/Box/index.js";
+import FormControlLabel from "@mui/material/FormControlLabel/index.js";
+import IconButton from "@mui/material/IconButton/index.js";
+import Menu from "@mui/material/Menu/index.js";
+import MenuItem from "@mui/material/MenuItem/index.js";
+import Skeleton from "@mui/material/Skeleton/index.js";
+import Switch from "@mui/material/Switch/index.js";
+import MuiTable from "@mui/material/Table/index.js";
+import TableBody from "@mui/material/TableBody/index.js";
+import TableCell from "@mui/material/TableCell/index.js";
+import TableContainer from "@mui/material/TableContainer/index.js";
+import TableRow from "@mui/material/TableRow/index.js";
+import { styled } from "@mui/material/styles/index.js";
+import React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var StyledTableContainer = styled(TableContainer, {
+  shouldForwardProp: (prop) => !["virtualScrolling", "containerHeight"].includes(prop)
+})(({ virtualScrolling, containerHeight }) => ({
+  ...virtualScrolling && {
+    height: containerHeight || 400,
+    overflow: "auto"
+  }
+}));
+var StyledTable = styled(MuiTable, {
+  shouldForwardProp: (prop) => !["customVariant", "glow", "pulse", "hoverable", "density", "stickyHeader", "stripeColor"].includes(prop)
+})(({ theme, customVariant, glow, pulse, hoverable, density, stickyHeader, stripeColor = "neutral" }) => {
+  return tableStyles({
+    theme,
+    customVariant,
+    glow,
+    pulse,
+    hoverable,
+    density,
+    stickyHeader,
+    stripeColor
+  });
+});
+var TableShell = ({
+  innerRef,
+  variant,
+  stripeColor,
+  glow,
+  pulse,
+  hoverable,
+  density,
+  stickyHeader,
+  header,
+  rest,
+  children
+}) => /* @__PURE__ */ jsx(StyledTableContainer, { children: /* @__PURE__ */ jsxs(
+  StyledTable,
+  {
+    ref: innerRef,
+    customVariant: variant,
+    stripeColor,
+    glow,
+    pulse,
+    hoverable,
+    density,
+    stickyHeader,
+    ...rest,
+    children: [
+      header,
+      children
+    ]
+  }
+) });
+var SKELETON_ROW_COUNT = 5;
+var LoadingSkeletonRows = ({ columns }) => /* @__PURE__ */ jsx(Fragment, { children: Array.from({ length: SKELETON_ROW_COUNT }, (_, index) => /* @__PURE__ */ jsx(TableRow, { children: columns?.map((column) => /* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Skeleton, { height: 20 }) }, column.key)) }, index)) });
+var ColumnToggleMenu = ({ columns, hiddenColumns, anchor, setAnchor, setHiddenColumns }) => /* @__PURE__ */ jsxs(Box, { position: "absolute", top: 8, right: 8, children: [
+  /* @__PURE__ */ jsx(IconButton, { onClick: (event) => setAnchor(event.currentTarget), size: "small", children: /* @__PURE__ */ jsx(MoreVertIcon, {}) }),
+  /* @__PURE__ */ jsx(Menu, { anchorEl: anchor, open: Boolean(anchor), onClose: () => setAnchor(null), children: columns.map((column, index) => /* @__PURE__ */ jsx(MenuItem, { children: /* @__PURE__ */ jsx(
+    FormControlLabel,
+    {
+      control: /* @__PURE__ */ jsx(
+        Switch,
+        {
+          checked: !hiddenColumns.includes(index),
+          onChange: (event) => setHiddenColumns(
+            event.target.checked ? hiddenColumns.filter((i) => i !== index) : [...hiddenColumns, index]
+          ),
+          size: "small"
+        }
+      ),
+      label: column.label
+    }
+  ) }, column.key)) })
+] });
+var columnsFor = (resolved, selection) => (resolved.responsive ? selection.visibleColumns : resolved.columns) ?? [];
+var showsColumnToggle = (resolved, selection) => Boolean(
+  resolved.responsive && selection.isMobile && resolved.showColumnToggle && selection.hiddenColumns.length > 0
+);
+var AdvancedTable = ({ resolved: p, selection, innerRef, rest }) => {
+  const finalColumns = columnsFor(p, selection);
+  const showToggle = showsColumnToggle(p, selection);
+  return /* @__PURE__ */ jsxs(Box, { position: "relative", children: [
+    /* @__PURE__ */ jsx(
+      StyledTableContainer,
+      {
+        virtualScrolling: p.virtualScrolling,
+        containerHeight: p.containerHeight,
+        children: /* @__PURE__ */ jsxs(
+          StyledTable,
+          {
+            ref: innerRef,
+            customVariant: p.variant,
+            stripeColor: p.stripeColor,
+            glow: p.glow,
+            pulse: p.pulse,
+            hoverable: p.hoverable,
+            density: p.density,
+            stickyHeader: p.stickyHeader,
+            ...rest,
+            children: [
+              /* @__PURE__ */ jsx(
+                EnhancedTableHeader,
+                {
+                  columns: finalColumns,
+                  data: p.data ?? [],
+                  sortable: p.sortable,
+                  sortConfig: p.sortConfig,
+                  onSortChange: p.onSortChange,
+                  selectable: p.selectable,
+                  selectedRows: p.selectedRows,
+                  onSelectAll: selection.handleSelectAll,
+                  density: p.density,
+                  stickyHeader: p.stickyHeader
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                EnhancedTableBody,
+                {
+                  data: p.data ?? [],
+                  columns: finalColumns,
+                  selectedRows: p.selectedRows,
+                  onRowClick: p.onRowClick,
+                  onRowFocus: p.onRowFocus,
+                  onRowBlur: p.onRowBlur,
+                  onSelectionChange: selection.handleSelectionChange,
+                  rowKeyExtractor: p.rowKeyExtractor,
+                  density: p.density,
+                  selectable: p.selectable,
+                  hoverable: p.hoverable,
+                  renderRow: p.renderRow,
+                  renderCell: p.renderCell,
+                  virtualScrolling: p.virtualScrolling,
+                  containerHeight: typeof p.containerHeight === "number" ? p.containerHeight : void 0,
+                  rowHeight: p.rowHeight,
+                  overscan: p.overscan
+                }
+              )
+            ]
+          }
+        )
+      }
+    ),
+    showToggle && /* @__PURE__ */ jsx(
+      ColumnToggleMenu,
+      {
+        columns: p.columns ?? [],
+        hiddenColumns: selection.hiddenColumns,
+        anchor: selection.columnMenuAnchor,
+        setAnchor: selection.setColumnMenuAnchor,
+        setHiddenColumns: selection.setHiddenColumns
+      }
+    )
+  ] });
+};
+var buildShell = ({
+  resolved,
+  selection,
+  innerRef,
+  rest,
+  finalColumns
+}) => ({
+  innerRef,
+  variant: resolved.variant,
+  stripeColor: resolved.stripeColor,
+  glow: resolved.glow,
+  pulse: resolved.pulse,
+  hoverable: resolved.hoverable,
+  density: resolved.density,
+  stickyHeader: resolved.stickyHeader,
+  header: resolved.columns ? /* @__PURE__ */ jsx(
+    EnhancedTableHeader,
+    {
+      columns: finalColumns ?? [],
+      data: [],
+      sortable: resolved.sortable,
+      sortConfig: resolved.sortConfig,
+      onSortChange: resolved.onSortChange,
+      selectable: resolved.selectable,
+      selectedRows: resolved.selectedRows,
+      onSelectAll: selection.handleSelectAll,
+      density: resolved.density,
+      stickyHeader: resolved.stickyHeader
+    }
+  ) : null,
+  rest
+});
+var TableLoadingState = ({ shell, loadingComponent, columns }) => /* @__PURE__ */ jsx(TableShell, { ...shell, children: /* @__PURE__ */ jsx(TableBody, { "data-testid": "table-loading", children: loadingComponent || /* @__PURE__ */ jsx(LoadingSkeletonRows, { columns }) }) });
+var TableEmptyState = ({ shell, emptyStateComponent, emptyText, colSpan }) => /* @__PURE__ */ jsx(TableShell, { ...shell, children: /* @__PURE__ */ jsx(EmptyRow, { colSpan, children: emptyStateComponent || /* @__PURE__ */ jsx(NoDataPlaceholder, { emptyText }) }) });
+var Table = React.forwardRef(
+  (tableProps, ref) => {
+    const resolved = { ...TABLE_DEFAULTS, ...definedProps(tableProps) };
+    const {
+      columns,
+      data,
+      responsive,
+      loading,
+      loadingComponent,
+      emptyStateComponent,
+      emptyText,
+      children,
+      ...props
+    } = resolved;
+    const selection = useTableSelection({
+      columns,
+      data,
+      responsive,
+      columnPriorities: resolved.columnPriorities,
+      selectedRows: resolved.selectedRows ?? [],
+      rowKeyExtractor: resolved.rowKeyExtractor,
+      onSelectionChange: resolved.onSelectionChange
+    });
+    const rest = props;
+    const renderer = { resolved, selection, innerRef: ref, rest };
+    const finalColumns = responsive ? selection.visibleColumns : columns;
+    const shell = buildShell({ ...renderer, finalColumns });
+    if (loading) {
+      return /* @__PURE__ */ jsx(TableLoadingState, { shell, loadingComponent, columns });
+    }
+    if (data && data.length === 0) {
+      return /* @__PURE__ */ jsx(
+        TableEmptyState,
+        {
+          shell,
+          emptyStateComponent,
+          emptyText,
+          colSpan: finalColumns?.length || 1
+        }
+      );
+    }
+    if (columns && data) return /* @__PURE__ */ jsx(AdvancedTable, { ...renderer });
+    return /* @__PURE__ */ jsx(
+      StyledTable,
+      {
+        ref,
+        customVariant: resolved.variant,
+        stripeColor: resolved.stripeColor,
+        glow: resolved.glow,
+        pulse: resolved.pulse,
+        hoverable: resolved.hoverable,
+        density: resolved.density,
+        stickyHeader: resolved.stickyHeader,
+        ...rest,
+        children
+      }
+    );
+  }
+);
+Table.displayName = "Table";
+
+export {
+  Table
+};
+//# sourceMappingURL=chunk-WQSL6MCA.js.map

package/dist/chunk-WQSL6MCA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/Table/Table.tsx"],"sourcesContent":["import MoreVertIcon from '@mui/icons-material/MoreVert';\nimport Box from '@mui/material/Box/index.js';\nimport FormControlLabel from '@mui/material/FormControlLabel/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport Menu from '@mui/material/Menu/index.js';\nimport MenuItem from '@mui/material/MenuItem/index.js';\nimport Skeleton from '@mui/material/Skeleton/index.js';\nimport Switch from '@mui/material/Switch/index.js';\nimport MuiTable from '@mui/material/Table/index.js';\nimport TableBody from '@mui/material/TableBody/index.js';\nimport TableCell from '@mui/material/TableCell/index.js';\nimport TableContainer from '@mui/material/TableContainer/index.js';\nimport TableRow from '@mui/material/TableRow/index.js';\nimport { styled } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport type {\n  ColumnConfig,\n  TableDensity,\n  TableProps,\n  TableStripeColor} from './Table.types';\nimport { TABLE_DEFAULTS, definedProps } from './Table.helpers';\nimport { useTableSelection } from './Table.hooks';\nimport { EnhancedTableBody, EnhancedTableHeader } from './TableParts';\nimport { EmptyRow, NoDataPlaceholder } from './TableStates';\nimport {\n  tableStyles } from './Table.styles';\n\n// Define pulse animation\nconst StyledTableContainer = styled(TableContainer, {\n  shouldForwardProp: (prop) => !['virtualScrolling', 'containerHeight'].includes(prop as string) })<{ \n  virtualScrolling?: boolean; \n  containerHeight?: number | string;\n}>(({ virtualScrolling, containerHeight }) => ({\n  ...(virtualScrolling && {\n    height: containerHeight || 400,\n    overflow: 'auto' }) }));\n\n// Helper function to get stripe color from theme\nconst StyledTable = styled(MuiTable, {\n  shouldForwardProp: (prop) =>\n    !['customVariant', 'glow', 'pulse', 'hoverable', 'density', 'stickyHeader', 'stripeColor'].includes(prop as string) })<{\n  customVariant?: string;\n  glow?: boolean;\n  pulse?: boolean;\n  hoverable?: boolean;\n  density?: TableDensity;\n  stickyHeader?: boolean;\n  stripeColor?: TableStripeColor;\n}>(({ theme, customVariant, glow, pulse, hoverable, density, stickyHeader, stripeColor = 'neutral' }) => {\n  return tableStyles({\n    theme,\n    customVariant,\n    glow,\n    pulse,\n    hoverable,\n    density,\n    stickyHeader,\n    stripeColor });\n});\n\n// Virtual Scrolling Hook\nconst TableShell: React.FC<{\n  innerRef: React.Ref<globalThis.HTMLTableElement>;\n  variant?: string;\n  stripeColor?: TableStripeColor;\n  glow?: boolean;\n  pulse?: boolean;\n  hoverable?: boolean;\n  density?: TableDensity;\n  stickyHeader?: boolean;\n  header: React.ReactNode;\n  rest: Record<string, unknown>;\n  children: React.ReactNode;\n}> = ({\n  innerRef,\n  variant,\n  stripeColor,\n  glow,\n  pulse,\n  hoverable,\n  density,\n  stickyHeader,\n  header,\n  rest,\n  children }) => (\n  <StyledTableContainer>\n    <StyledTable\n      ref={innerRef}\n      customVariant={variant}\n      stripeColor={stripeColor}\n      glow={glow}\n      pulse={pulse}\n      hoverable={hoverable}\n      density={density}\n      stickyHeader={stickyHeader}\n      {...rest}\n    >\n      {header}\n      {children}\n    </StyledTable>\n  </StyledTableContainer>\n);\n\nconst SKELETON_ROW_COUNT = 5;\n\nconst LoadingSkeletonRows: React.FC<{ columns?: ColumnConfig[] }> = ({ columns }) => (\n  <>\n    {Array.from({ length: SKELETON_ROW_COUNT }, (_, index) => (\n      <TableRow key={index}>\n        {columns?.map((column) => (\n          <TableCell key={column.key}>\n            <Skeleton height={20} />\n          </TableCell>\n        ))}\n      </TableRow>\n    ))}\n  </>\n);\n\nexport type TableShellProps = Omit<React.ComponentProps<typeof TableShell>, 'children'>;\n\ntype Selection = ReturnType<typeof useTableSelection>;\n\ninterface RendererProps {\n  resolved: TableProps;\n  selection: Selection;\n  innerRef: React.Ref<globalThis.HTMLTableElement>;\n  rest: Record<string, unknown>;\n}\n\n// The column-visibility control, shown only when responsive mode has actually\n// hidden something on a narrow viewport.\nconst ColumnToggleMenu: React.FC<{\n  columns: ColumnConfig[];\n  hiddenColumns: number[];\n  anchor: HTMLElement | null;\n  setAnchor: (element: HTMLElement | null) => void;\n  setHiddenColumns: (next: number[]) => void;\n}> = ({ columns, hiddenColumns, anchor, setAnchor, setHiddenColumns }) => (\n  <Box position=\"absolute\" top={8} right={8}>\n    <IconButton onClick={(event) => setAnchor(event.currentTarget)} size=\"small\">\n      <MoreVertIcon />\n    </IconButton>\n    <Menu anchorEl={anchor} open={Boolean(anchor)} onClose={() => setAnchor(null)}>\n      {columns.map((column, index) => (\n        <MenuItem key={column.key}>\n          <FormControlLabel\n            control={\n              <Switch\n                checked={!hiddenColumns.includes(index)}\n                onChange={(event) =>\n                  setHiddenColumns(\n                    event.target.checked\n                      ? hiddenColumns.filter((i: number) => i !== index)\n                      : [...hiddenColumns, index],\n                  )\n                }\n                size=\"small\"\n              />\n            }\n            label={column.label}\n          />\n        </MenuItem>\n      ))}\n    </Menu>\n  </Box>\n);\n\n// The populated table. Local because StyledTableContainer and StyledTable\n// cannot cross a module boundary (TS2742).\nconst columnsFor = (resolved: TableProps, selection: Selection): ColumnConfig[] =>\n  (resolved.responsive ? selection.visibleColumns : resolved.columns) ?? [];\n\n// The toggle only earns its place when responsive mode has actually hidden\n// something on a narrow viewport.\nconst showsColumnToggle = (resolved: TableProps, selection: Selection): boolean =>\n  Boolean(\n    resolved.responsive &&\n      selection.isMobile &&\n      resolved.showColumnToggle &&\n      selection.hiddenColumns.length > 0,\n  );\n\nconst AdvancedTable: React.FC<RendererProps> = ({ resolved: p, selection, innerRef, rest }) => {\n  const finalColumns = columnsFor(p, selection);\n  const showToggle = showsColumnToggle(p, selection);\n\n  return (\n    <Box position=\"relative\">\n      <StyledTableContainer\n        virtualScrolling={p.virtualScrolling}\n        containerHeight={p.containerHeight}\n      >\n        <StyledTable\n          ref={innerRef}\n          customVariant={p.variant}\n          stripeColor={p.stripeColor}\n          glow={p.glow}\n          pulse={p.pulse}\n          hoverable={p.hoverable}\n          density={p.density}\n          stickyHeader={p.stickyHeader}\n          {...rest}\n        >\n          <EnhancedTableHeader\n            columns={finalColumns}\n            data={p.data ?? []}\n            sortable={p.sortable}\n            sortConfig={p.sortConfig}\n            onSortChange={p.onSortChange}\n            selectable={p.selectable}\n            selectedRows={p.selectedRows}\n            onSelectAll={selection.handleSelectAll}\n            density={p.density}\n            stickyHeader={p.stickyHeader}\n          />\n          <EnhancedTableBody\n            data={p.data ?? []}\n            columns={finalColumns}\n            selectedRows={p.selectedRows}\n            onRowClick={p.onRowClick}\n            onRowFocus={p.onRowFocus}\n            onRowBlur={p.onRowBlur}\n            onSelectionChange={selection.handleSelectionChange}\n            rowKeyExtractor={p.rowKeyExtractor}\n            density={p.density}\n            selectable={p.selectable}\n            hoverable={p.hoverable}\n            renderRow={p.renderRow}\n            renderCell={p.renderCell}\n            virtualScrolling={p.virtualScrolling}\n            containerHeight={typeof p.containerHeight === 'number' ? p.containerHeight : undefined}\n            rowHeight={p.rowHeight}\n            overscan={p.overscan}\n          />\n        </StyledTable>\n      </StyledTableContainer>\n\n      {showToggle && (\n        <ColumnToggleMenu\n          columns={p.columns ?? []}\n          hiddenColumns={selection.hiddenColumns}\n          anchor={selection.columnMenuAnchor}\n          setAnchor={selection.setColumnMenuAnchor}\n          setHiddenColumns={selection.setHiddenColumns}\n        />\n      )}\n    </Box>\n  );\n};\n\n// The loading and empty states render the same shell as the populated table, so\n// they share TableShell rather than repeating it three times.\nconst buildShell = ({\n  resolved,\n  selection,\n  innerRef,\n  rest,\n  finalColumns }: RendererProps & { finalColumns?: ColumnConfig[] }) => ({\n  innerRef,\n  variant: resolved.variant,\n  stripeColor: resolved.stripeColor,\n  glow: resolved.glow,\n  pulse: resolved.pulse,\n  hoverable: resolved.hoverable,\n  density: resolved.density,\n  stickyHeader: resolved.stickyHeader,\n  header: resolved.columns ? (\n    <EnhancedTableHeader\n      columns={finalColumns ?? []}\n      data={[]}\n      sortable={resolved.sortable}\n      sortConfig={resolved.sortConfig}\n      onSortChange={resolved.onSortChange}\n      selectable={resolved.selectable}\n      selectedRows={resolved.selectedRows}\n      onSelectAll={selection.handleSelectAll}\n      density={resolved.density}\n      stickyHeader={resolved.stickyHeader}\n    />\n  ) : null,\n  rest: rest as Record<string, unknown> });\n\nconst TableLoadingState: React.FC<{\n  shell: TableShellProps;\n  loadingComponent?: React.ReactNode;\n  columns?: ColumnConfig[];\n}> = ({ shell, loadingComponent, columns }) => (\n  <TableShell {...shell}>\n    <TableBody data-testid=\"table-loading\">\n      {loadingComponent || <LoadingSkeletonRows columns={columns} />}\n    </TableBody>\n  </TableShell>\n);\n\nconst TableEmptyState: React.FC<{\n  shell: TableShellProps;\n  emptyStateComponent?: React.ReactNode;\n  emptyText: string;\n  colSpan: number;\n}> = ({ shell, emptyStateComponent, emptyText, colSpan }) => (\n  <TableShell {...shell}>\n    <EmptyRow colSpan={colSpan}>\n      {emptyStateComponent || <NoDataPlaceholder emptyText={emptyText} />}\n    </EmptyRow>\n  </TableShell>\n);\n\nexport const Table = React.forwardRef<globalThis.HTMLTableElement, TableProps>(\n  (tableProps, ref) => {\n    const resolved = { ...TABLE_DEFAULTS, ...definedProps(tableProps) } as TableProps;\n    const {\n      columns,\n      data,\n      responsive,\n      loading,\n      loadingComponent,\n      emptyStateComponent,\n      emptyText,\n      children,\n      ...props\n    } = resolved;\n\n    const selection = useTableSelection({\n      columns,\n      data,\n      responsive,\n      columnPriorities: resolved.columnPriorities,\n      selectedRows: resolved.selectedRows ?? [],\n      rowKeyExtractor: resolved.rowKeyExtractor,\n      onSelectionChange: resolved.onSelectionChange });\n\n    const rest = props as unknown as Record<string, unknown>;\n    const renderer: RendererProps = { resolved, selection, innerRef: ref, rest };\n    const finalColumns = responsive ? selection.visibleColumns : columns;\n    const shell = buildShell({ ...renderer, finalColumns });\n\n    if (loading) {\n      return (\n        <TableLoadingState shell={shell} loadingComponent={loadingComponent} columns={columns} />\n      );\n    }\n\n    if (data && data.length === 0) {\n      return (\n        <TableEmptyState\n          shell={shell}\n          emptyStateComponent={emptyStateComponent}\n          emptyText={emptyText}\n          colSpan={finalColumns?.length || 1}\n        />\n      );\n    }\n\n    if (columns && data) return <AdvancedTable {...renderer} />;\n\n    // Basic table (backward compatibility)\n    return (\n      <StyledTable\n        ref={ref}\n        customVariant={resolved.variant}\n        stripeColor={resolved.stripeColor}\n        glow={resolved.glow}\n        pulse={resolved.pulse}\n        hoverable={resolved.hoverable}\n        density={resolved.density}\n        stickyHeader={resolved.stickyHeader}\n        {...rest}\n      >\n        {children}\n      </StyledTable>\n    );\n  },\n);\n\nTable.displayName = 'Table';"],"mappings":"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","names":[]}

package/dist/chunk-WR7ELCIL.js

@@ -0,0 +1,168 @@
+// src/components/data-display/LazyImage/LazyImage.hooks.ts
+import { useCallback, useEffect, useRef, useState } from "react";
+var LAZY_IMAGE_DEFAULTS = {
+  height: "auto",
+  loadingState: "skeleton",
+  objectFit: "cover",
+  objectPosition: "center",
+  lazy: true,
+  rootMargin: "100px",
+  threshold: 0,
+  fadeIn: true,
+  fadeInDuration: 300,
+  retryOnError: false,
+  maxRetries: 3,
+  retryDelay: 1e3,
+  decoding: "async",
+  skeletonProps: {},
+  spinnerProps: {},
+  sx: {},
+  role: "img"
+};
+var definedProps = (props) => Object.fromEntries(
+  Object.entries(props).filter(([, value]) => value !== void 0)
+);
+var resolveLazyImageProps = (props) => ({ ...LAZY_IMAGE_DEFAULTS, ...definedProps(props) });
+var OWN_PROPS = /* @__PURE__ */ new Set([
+  "src",
+  "alt",
+  "width",
+  "height",
+  "placeholder",
+  "fallback",
+  "loadingState",
+  "showSpinner",
+  "objectFit",
+  "objectPosition",
+  "borderRadius",
+  "lazy",
+  "rootMargin",
+  "threshold",
+  "fadeIn",
+  "fadeInDuration",
+  "onLoad",
+  "onError",
+  "onLoadStart",
+  "retryOnError",
+  "maxRetries",
+  "retryDelay",
+  "decoding",
+  "loading",
+  "fetchPriority",
+  "skeletonProps",
+  "spinnerProps",
+  "sx",
+  "className",
+  "data-testid",
+  "aria-label",
+  "aria-describedby",
+  "role"
+]);
+var imgPassThrough = (props) => Object.fromEntries(Object.entries(props).filter(([key]) => !OWN_PROPS.has(key)));
+var useVisibility = (props, containerRef, isVisible, onVisible) => {
+  const { lazy, src, rootMargin, threshold, onLoadStart } = props;
+  useEffect(() => {
+    if (!lazy || isVisible) {
+      return;
+    }
+    const observer = new IntersectionObserver(
+      (entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            onVisible();
+            onLoadStart?.();
+            observer.unobserve(entry.target);
+          }
+        });
+      },
+      { rootMargin, threshold }
+    );
+    if (containerRef.current) {
+      observer.observe(containerRef.current);
+    }
+    return () => {
+      if (containerRef.current) {
+        observer.unobserve(containerRef.current);
+      }
+    };
+  }, [lazy, src, rootMargin, threshold, isVisible, onLoadStart, onVisible, containerRef]);
+};
+var useRetryTimeout = () => {
+  const ref = useRef(void 0);
+  useEffect(
+    () => () => {
+      if (ref.current) {
+        clearTimeout(ref.current);
+      }
+    },
+    []
+  );
+  return ref;
+};
+var useLazyImage = (props) => {
+  const { src, placeholder, lazy, loadingState, showSpinner } = props;
+  const { onLoad, onError, retryOnError, maxRetries, retryDelay } = props;
+  const containerRef = useRef(null);
+  const retryTimeoutRef = useRetryTimeout();
+  const effectiveLoadingState = showSpinner ? "spinner" : loadingState;
+  const [state, setState] = useState({
+    isLoading: true,
+    hasError: false,
+    isVisible: !lazy,
+    // If not lazy, load immediately
+    retryCount: 0,
+    currentSrc: lazy ? placeholder || null : src
+  });
+  const markVisible = useCallback(
+    () => setState((prev) => ({ ...prev, isVisible: true, currentSrc: src })),
+    [src]
+  );
+  useVisibility(props, containerRef, state.isVisible, markVisible);
+  useEffect(() => {
+    if (!state.isVisible || !src || state.currentSrc === src) {
+      return;
+    }
+    setState((prev) => ({ ...prev, currentSrc: src, isLoading: true, hasError: false }));
+  }, [state.isVisible, src, state.currentSrc]);
+  const handleImageLoad = useCallback(
+    (event) => {
+      setState((prev) => ({ ...prev, isLoading: false, hasError: false, retryCount: 0 }));
+      onLoad?.(event);
+    },
+    [onLoad]
+  );
+  const handleImageError = useCallback(
+    (event) => {
+      if (!retryOnError || state.retryCount >= maxRetries) {
+        setState((prev) => ({ ...prev, isLoading: false, hasError: true }));
+        onError?.(event);
+        return;
+      }
+      retryTimeoutRef.current = setTimeout(() => {
+        setState((prev) => ({
+          ...prev,
+          retryCount: prev.retryCount + 1,
+          currentSrc: `${src}?retry=${prev.retryCount + 1}`
+          // Force reload with cache buster
+        }));
+      }, retryDelay);
+    },
+    [onError, retryOnError, state.retryCount, maxRetries, retryDelay, src]
+  );
+  return {
+    state,
+    containerRef,
+    effectiveLoadingState,
+    handleImageLoad,
+    handleImageError,
+    showImage: Boolean(state.currentSrc) && !state.hasError,
+    showLoading: state.isLoading && (!state.currentSrc || effectiveLoadingState !== "placeholder")
+  };
+};
+
+export {
+  resolveLazyImageProps,
+  imgPassThrough,
+  useLazyImage
+};
+//# sourceMappingURL=chunk-WR7ELCIL.js.map

package/dist/chunk-WR7ELCIL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/LazyImage/LazyImage.hooks.ts"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from 'react';\n\nimport type { LazyImageProps, LazyImageState } from './LazyImage.types';\n\ntype LazyImageDefaultedKeys =\n  | 'height'\n  | 'loadingState'\n  | 'objectFit'\n  | 'objectPosition'\n  | 'lazy'\n  | 'rootMargin'\n  | 'threshold'\n  | 'fadeIn'\n  | 'fadeInDuration'\n  | 'retryOnError'\n  | 'maxRetries'\n  | 'retryDelay'\n  | 'decoding'\n  | 'skeletonProps'\n  | 'spinnerProps'\n  | 'sx'\n  | 'role';\n\nexport type ResolvedLazyImageProps = LazyImageProps &\n  Required<Pick<LazyImageProps, LazyImageDefaultedKeys>>;\n\nconst LAZY_IMAGE_DEFAULTS: Pick<LazyImageProps, LazyImageDefaultedKeys> = {\n  height: 'auto',\n  loadingState: 'skeleton',\n  objectFit: 'cover',\n  objectPosition: 'center',\n  lazy: true,\n  rootMargin: '100px',\n  threshold: 0,\n  fadeIn: true,\n  fadeInDuration: 300,\n  retryOnError: false,\n  maxRetries: 3,\n  retryDelay: 1000,\n  decoding: 'async',\n  skeletonProps: {},\n  spinnerProps: {},\n  sx: {},\n  role: 'img',\n};\n\n// Strips explicitly-undefined props before the merge, so `lazy={undefined}` still\n// falls back to the default exactly as a destructuring default would.\nconst definedProps = (props: LazyImageProps): Partial<LazyImageProps> =>\n  Object.fromEntries(\n    Object.entries(props).filter(([, value]) => value !== undefined),\n  ) as Partial<LazyImageProps>;\n\nexport const resolveLazyImageProps = (props: LazyImageProps): ResolvedLazyImageProps =>\n  ({ ...LAZY_IMAGE_DEFAULTS, ...definedProps(props) }) as ResolvedLazyImageProps;\n\n// Props this component consumes itself. Anything else the caller passed is an\n// ordinary <img> attribute and is forwarded untouched.\nconst OWN_PROPS = new Set([\n  'src', 'alt', 'width', 'height', 'placeholder', 'fallback', 'loadingState',\n  'showSpinner', 'objectFit', 'objectPosition', 'borderRadius', 'lazy', 'rootMargin',\n  'threshold', 'fadeIn', 'fadeInDuration', 'onLoad', 'onError', 'onLoadStart',\n  'retryOnError', 'maxRetries', 'retryDelay', 'decoding', 'loading', 'fetchPriority',\n  'skeletonProps', 'spinnerProps', 'sx', 'className', 'data-testid', 'aria-label',\n  'aria-describedby', 'role',\n]);\n\nexport const imgPassThrough = (props: ResolvedLazyImageProps): Record<string, unknown> =>\n  Object.fromEntries(Object.entries(props).filter(([key]) => !OWN_PROPS.has(key)));\n\n/**\n * Flips `isVisible` the first time the container nears the viewport, then stops\n * observing. Does nothing when `lazy` is off — the caller wants the request now.\n */\nconst useVisibility = (\n  props: ResolvedLazyImageProps,\n  containerRef: React.RefObject<HTMLDivElement | null>,\n  isVisible: boolean,\n  onVisible: () => void,\n) => {\n  const { lazy, src, rootMargin, threshold, onLoadStart } = props;\n\n  useEffect(() => {\n    if (!lazy || isVisible) {\n      return;\n    }\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        entries.forEach((entry) => {\n          if (entry.isIntersecting) {\n            onVisible();\n            onLoadStart?.();\n            observer.unobserve(entry.target);\n          }\n        });\n      },\n      { rootMargin, threshold },\n    );\n\n    if (containerRef.current) {\n      observer.observe(containerRef.current);\n    }\n\n    return () => {\n      if (containerRef.current) {\n        observer.unobserve(containerRef.current);\n      }\n    };\n  }, [lazy, src, rootMargin, threshold, isVisible, onLoadStart, onVisible, containerRef]);\n};\n\n/** A pending retry has to be cancelled on unmount, or it sets state on a dead component. */\nconst useRetryTimeout = () => {\n  const ref = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n  useEffect(\n    () => () => {\n      if (ref.current) {\n        clearTimeout(ref.current);\n      }\n    },\n    [],\n  );\n\n  return ref;\n};\n\n/**\n * Owns whether the real image has been requested yet and how it went: the\n * observer above, the load/error handlers, and the retry timer.\n */\nexport const useLazyImage = (props: ResolvedLazyImageProps) => {\n  const { src, placeholder, lazy, loadingState, showSpinner } = props;\n  const { onLoad, onError, retryOnError, maxRetries, retryDelay } = props;\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const retryTimeoutRef = useRetryTimeout();\n\n  // Handle deprecated showSpinner prop\n  const effectiveLoadingState = showSpinner ? 'spinner' : loadingState;\n\n  const [state, setState] = useState<LazyImageState>({\n    isLoading: true,\n    hasError: false,\n    isVisible: !lazy, // If not lazy, load immediately\n    retryCount: 0,\n    currentSrc: lazy ? placeholder || null : src,\n  });\n\n  const markVisible = useCallback(\n    () => setState((prev) => ({ ...prev, isVisible: true, currentSrc: src })),\n    [src],\n  );\n  useVisibility(props, containerRef, state.isVisible, markVisible);\n\n  // Load image when it becomes visible\n  useEffect(() => {\n    if (!state.isVisible || !src || state.currentSrc === src) {\n      return;\n    }\n\n    setState((prev) => ({ ...prev, currentSrc: src, isLoading: true, hasError: false }));\n  }, [state.isVisible, src, state.currentSrc]);\n\n  const handleImageLoad = useCallback(\n    (event: React.SyntheticEvent<HTMLImageElement>) => {\n      setState((prev) => ({ ...prev, isLoading: false, hasError: false, retryCount: 0 }));\n      onLoad?.(event);\n    },\n    [onLoad],\n  );\n\n  const handleImageError = useCallback(\n    (event: React.SyntheticEvent<HTMLImageElement>) => {\n      if (!retryOnError || state.retryCount >= maxRetries) {\n        setState((prev) => ({ ...prev, isLoading: false, hasError: true }));\n        onError?.(event);\n        return;\n      }\n\n      retryTimeoutRef.current = setTimeout(() => {\n        setState((prev) => ({\n          ...prev,\n          retryCount: prev.retryCount + 1,\n          currentSrc: `${src}?retry=${prev.retryCount + 1}`, // Force reload with cache buster\n        }));\n      }, retryDelay);\n    },\n    [onError, retryOnError, state.retryCount, maxRetries, retryDelay, src],\n  );\n\n  return {\n    state,\n    containerRef,\n    effectiveLoadingState,\n    handleImageLoad,\n    handleImageError,\n    showImage: Boolean(state.currentSrc) && !state.hasError,\n    showLoading:\n      state.isLoading && (!state.currentSrc || effectiveLoadingState !== 'placeholder'),\n  };\n};\n"],"mappings":"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","names":[]}

package/dist/chunk-WTOTWP6A.js

@@ -0,0 +1,27 @@
+// src/components/data-display/DataViews/data-views-selection.ts
+import { useMemo, useState } from "react";
+function useSelection(matched, getRowId) {
+  const [selectedIds, setSelectedIds] = useState(/* @__PURE__ */ new Set());
+  const selectedRows = useMemo(
+    () => matched.filter((row) => selectedIds.has(getRowId(row))),
+    [matched, selectedIds, getRowId]
+  );
+  return {
+    selectedIds,
+    setSelectedIds,
+    toggleId: (id) => setSelectedIds((prev) => {
+      const next = new Set(prev);
+      if (next.has(id)) next.delete(id);
+      else next.add(id);
+      return next;
+    }),
+    selectedRows,
+    clearSelection: () => setSelectedIds(/* @__PURE__ */ new Set()),
+    selectAll: () => setSelectedIds(new Set(matched.map((row) => getRowId(row))))
+  };
+}
+
+export {
+  useSelection
+};
+//# sourceMappingURL=chunk-WTOTWP6A.js.map

package/dist/chunk-WTOTWP6A.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/data-display/DataViews/data-views-selection.ts"],"sourcesContent":["\"use client\";\n\nimport { useMemo, useState } from \"react\";\n\n/** The multi-select model, identical in every layout (table, cards, board). */\ninterface DataViewsSelection<T> {\n  selectedIds: Set<string | number>;\n  setSelectedIds: (ids: Set<string | number>) => void;\n  /** Add/remove ONE id — what a card's or board card's checkbox calls. */\n  toggleId: (id: string | number) => void;\n  /** The selected rows, narrowed to what is currently rendered. */\n  selectedRows: T[];\n  clearSelection: () => void;\n  selectAll: () => void;\n}\n\n/**\n * Owns the DataViews selection. ONE set of ids across every layout, so switching\n * from the board to the table (or to the cards) keeps exactly the same rows\n * selected and offers exactly the same bulk actions.\n *\n * Extracted from {@link useDataViewsState} for that hook's size budget, and\n * because `toggleId` needs a functional update: two cards toggled in the same\n * tick would otherwise both read the pre-render set and the second would drop\n * the first's change.\n */\nexport function useSelection<T>(\n  matched: T[],\n  getRowId: (row: T) => string | number,\n): DataViewsSelection<T> {\n  const [selectedIds, setSelectedIds] = useState<Set<string | number>>(new Set());\n  const selectedRows = useMemo(\n    () => matched.filter((row) => selectedIds.has(getRowId(row))),\n    [matched, selectedIds, getRowId],\n  );\n  return {\n    selectedIds,\n    setSelectedIds,\n    toggleId: (id) =>\n      setSelectedIds((prev) => {\n        const next = new Set(prev);\n        if (next.has(id)) next.delete(id);\n        else next.add(id);\n        return next;\n      }),\n    selectedRows,\n    clearSelection: () => setSelectedIds(new Set()),\n    selectAll: () => setSelectedIds(new Set(matched.map((row) => getRowId(row)))),\n  };\n}\n"],"mappings":";AAEA,SAAS,SAAS,gBAAgB;AAwB3B,SAAS,aACd,SACA,UACuB;AACvB,QAAM,CAAC,aAAa,cAAc,IAAI,SAA+B,oBAAI,IAAI,CAAC;AAC9E,QAAM,eAAe;AAAA,IACnB,MAAM,QAAQ,OAAO,CAAC,QAAQ,YAAY,IAAI,SAAS,GAAG,CAAC,CAAC;AAAA,IAC5D,CAAC,SAAS,aAAa,QAAQ;AAAA,EACjC;AACA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,UAAU,CAAC,OACT,eAAe,CAAC,SAAS;AACvB,YAAM,OAAO,IAAI,IAAI,IAAI;AACzB,UAAI,KAAK,IAAI,EAAE,EAAG,MAAK,OAAO,EAAE;AAAA,UAC3B,MAAK,IAAI,EAAE;AAChB,aAAO;AAAA,IACT,CAAC;AAAA,IACH;AAAA,IACA,gBAAgB,MAAM,eAAe,oBAAI,IAAI,CAAC;AAAA,IAC9C,WAAW,MAAM,eAAe,IAAI,IAAI,QAAQ,IAAI,CAAC,QAAQ,SAAS,GAAG,CAAC,CAAC,CAAC;AAAA,EAC9E;AACF;","names":[]}

package/dist/chunk-WUE5EK42.js

@@ -0,0 +1,79 @@
+// src/pt-BR.shared.ts
+var PT_BR_SECTION_ONBOARDING_COPY = {
+  edit: "Editar",
+  collapse: "Ocultar",
+  start: "Come\xE7ar"
+};
+var PT_BR_CONFIRM_ACTION_COPY = {
+  cancel: "Cancelar",
+  defaultError: "N\xE3o foi poss\xEDvel concluir a a\xE7\xE3o. Tente novamente.",
+  irreversible: "Esta a\xE7\xE3o n\xE3o pode ser desfeita.",
+  typeToConfirm: (expected) => `Digite "${expected}" para confirmar.`
+};
+var PT_BR_CATEGORY_SELECT_COPY = {
+  purpose: "Categorias organizam o card\xE1pio e os filtros da loja.",
+  clearSelection: "Limpar sele\xE7\xE3o",
+  selectAll: "Marcar tudo",
+  deselectAll: "Desmarcar tudo",
+  expandAll: "Expandir tudo",
+  collapseAll: "Recolher tudo",
+  expandCategory: (name) => `Expandir ${name}`,
+  collapseCategory: (name) => `Recolher ${name}`,
+  placeholderSingle: "Mover para\u2026",
+  placeholderMulti: "Categoria",
+  emptyTitle: "Nenhuma categoria ainda",
+  createCategory: "Criar categoria",
+  noResults: {
+    title: (query) => `Nada encontrado para \u201C${query}\u201D`,
+    hint: "Tente outro termo ou verifique a grafia.",
+    clearSearch: "Limpar busca",
+    create: (query) => `Criar \u201C${query}\u201D`
+  },
+  search: {
+    placeholderSingle: "Buscar categoria\u2026",
+    placeholderMulti: "Buscar categoria ou subcategoria",
+    clear: "Limpar busca",
+    removeChip: (label) => `Remover ${label}`,
+    pinnedLabel: (count) => `Selecionadas \xB7 ${count}`
+  },
+  footer: {
+    selectedCount: (count) => `${count} selecionada${count === 1 ? "" : "s"}`,
+    clear: "Limpar",
+    apply: "Aplicar",
+    close: "Fechar",
+    singleHint: "Escolha uma categoria",
+    cancel: "Cancelar"
+  }
+};
+var PT_BR_CEP_FIELD_COPY = {
+  loading: "Buscando endere\xE7o\u2026",
+  found: "Endere\xE7o preenchido pelo CEP.",
+  notfound: "CEP n\xE3o encontrado \u2014 preencha o endere\xE7o manualmente."
+};
+var PT_BR_SAVED_VIEWS_LABELS = {
+  trigger: "Vis\xF5es",
+  mainView: "Vis\xE3o principal",
+  pinned: "Fixadas",
+  recent: "Recentes",
+  empty: "Nenhuma vis\xE3o salva ainda.",
+  saveCurrent: "+ Salvar vis\xE3o atual",
+  manageAll: "Gerenciar vis\xF5es",
+  apply: "Aplicar",
+  setDefault: "Definir como padr\xE3o",
+  pin: "Fixar na barra lateral",
+  unpin: "Desafixar",
+  share: "Compartilhar com a equipe",
+  unshare: "Tornar privada",
+  edit: "Editar",
+  remove: "Excluir",
+  defaultTag: "Padr\xE3o"
+};
+
+export {
+  PT_BR_SECTION_ONBOARDING_COPY,
+  PT_BR_CONFIRM_ACTION_COPY,
+  PT_BR_CATEGORY_SELECT_COPY,
+  PT_BR_CEP_FIELD_COPY,
+  PT_BR_SAVED_VIEWS_LABELS
+};
+//# sourceMappingURL=chunk-WUE5EK42.js.map

package/dist/chunk-WUE5EK42.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/pt-BR.shared.ts"],"sourcesContent":["/**\n * The pt-BR pack for the shared family. Split out of `pt-BR.ts`, which is a\n * barrel over this folder — see that file for why.\n */\nimport type { SavedViewsLabels } from \"./components/layout/ContentToolbar/ContentToolbar.types\";\nimport type {\n  CategorySelectCopy,\n  CepFieldCopy,\n  ConfirmActionCopy,\n  SectionOnboardingCopy,\n} from './copy';\n\nexport const PT_BR_SECTION_ONBOARDING_COPY: SectionOnboardingCopy = {\n  edit: \"Editar\",\n  collapse: \"Ocultar\",\n  start: \"Começar\",\n};\n\nexport const PT_BR_CONFIRM_ACTION_COPY: ConfirmActionCopy = {\n  cancel: \"Cancelar\",\n  defaultError: \"Não foi possível concluir a ação. Tente novamente.\",\n  irreversible: \"Esta ação não pode ser desfeita.\",\n  typeToConfirm: (expected) => `Digite \"${expected}\" para confirmar.`,\n};\n\nexport const PT_BR_CATEGORY_SELECT_COPY: CategorySelectCopy = {\n  purpose: \"Categorias organizam o cardápio e os filtros da loja.\",\n  clearSelection: \"Limpar seleção\",\n  selectAll: \"Marcar tudo\",\n  deselectAll: \"Desmarcar tudo\",\n  expandAll: \"Expandir tudo\",\n  collapseAll: \"Recolher tudo\",\n  expandCategory: (name) => `Expandir ${name}`,\n  collapseCategory: (name) => `Recolher ${name}`,\n  placeholderSingle: \"Mover para…\",\n  placeholderMulti: \"Categoria\",\n  emptyTitle: \"Nenhuma categoria ainda\",\n  createCategory: \"Criar categoria\",\n  noResults: {\n    title: (query) => `Nada encontrado para “${query}”`,\n    hint: \"Tente outro termo ou verifique a grafia.\",\n    clearSearch: \"Limpar busca\",\n    create: (query) => `Criar “${query}”`,\n  },\n  search: {\n    placeholderSingle: \"Buscar categoria…\",\n    placeholderMulti: \"Buscar categoria ou subcategoria\",\n    clear: \"Limpar busca\",\n    removeChip: (label) => `Remover ${label}`,\n    pinnedLabel: (count) => `Selecionadas · ${count}`,\n  },\n  footer: {\n    selectedCount: (count) => `${count} selecionada${count === 1 ? \"\" : \"s\"}`,\n    clear: \"Limpar\",\n    apply: \"Aplicar\",\n    close: \"Fechar\",\n    singleHint: \"Escolha uma categoria\",\n    cancel: \"Cancelar\",\n  },\n};\n\nexport const PT_BR_CEP_FIELD_COPY: CepFieldCopy = {\n  loading: \"Buscando endereço…\",\n  found: \"Endereço preenchido pelo CEP.\",\n  notfound: \"CEP não encontrado — preencha o endereço manualmente.\",\n};\n\n/**\n * The saved-views dropdown's labels.\n *\n * Typed as the package's OWN `SavedViewsLabels` rather than a parallel shape:\n * that interface already named every string, including the seven with no\n * diacritics the copy gate could not see (`Aplicar`, `Fixar na barra lateral`,\n * `Editar`…). The prop was `Partial<SavedViewsLabels>` with a pt-BR default —\n * configurable in the type, inherited in practice.\n */\nexport const PT_BR_SAVED_VIEWS_LABELS: SavedViewsLabels = {\n  trigger: \"Visões\",\n  mainView: \"Visão principal\",\n  pinned: \"Fixadas\",\n  recent: \"Recentes\",\n  empty: \"Nenhuma visão salva ainda.\",\n  saveCurrent: \"+ Salvar visão atual\",\n  manageAll: \"Gerenciar visões\",\n  apply: \"Aplicar\",\n  setDefault: \"Definir como padrão\",\n  pin: \"Fixar na barra lateral\",\n  unpin: \"Desafixar\",\n  share: \"Compartilhar com a equipe\",\n  unshare: \"Tornar privada\",\n  edit: \"Editar\",\n  remove: \"Excluir\",\n  defaultTag: \"Padrão\",\n};\n"],"mappings":";AAYO,IAAM,gCAAuD;AAAA,EAClE,MAAM;AAAA,EACN,UAAU;AAAA,EACV,OAAO;AACT;AAEO,IAAM,4BAA+C;AAAA,EAC1D,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,cAAc;AAAA,EACd,eAAe,CAAC,aAAa,WAAW,QAAQ;AAClD;AAEO,IAAM,6BAAiD;AAAA,EAC5D,SAAS;AAAA,EACT,gBAAgB;AAAA,EAChB,WAAW;AAAA,EACX,aAAa;AAAA,EACb,WAAW;AAAA,EACX,aAAa;AAAA,EACb,gBAAgB,CAAC,SAAS,YAAY,IAAI;AAAA,EAC1C,kBAAkB,CAAC,SAAS,YAAY,IAAI;AAAA,EAC5C,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,WAAW;AAAA,IACT,OAAO,CAAC,UAAU,8BAAyB,KAAK;AAAA,IAChD,MAAM;AAAA,IACN,aAAa;AAAA,IACb,QAAQ,CAAC,UAAU,eAAU,KAAK;AAAA,EACpC;AAAA,EACA,QAAQ;AAAA,IACN,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,OAAO;AAAA,IACP,YAAY,CAAC,UAAU,WAAW,KAAK;AAAA,IACvC,aAAa,CAAC,UAAU,qBAAkB,KAAK;AAAA,EACjD;AAAA,EACA,QAAQ;AAAA,IACN,eAAe,CAAC,UAAU,GAAG,KAAK,eAAe,UAAU,IAAI,KAAK,GAAG;AAAA,IACvE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAY;AAAA,IACZ,QAAQ;AAAA,EACV;AACF;AAEO,IAAM,uBAAqC;AAAA,EAChD,SAAS;AAAA,EACT,OAAO;AAAA,EACP,UAAU;AACZ;AAWO,IAAM,2BAA6C;AAAA,EACxD,SAAS;AAAA,EACT,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,aAAa;AAAA,EACb,WAAW;AAAA,EACX,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,KAAK;AAAA,EACL,OAAO;AAAA,EACP,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,YAAY;AACd;","names":[]}