@12-apps/ui 6.35.0 → 6.37.0

package/dist/chunk-J4NXTSJY.js

@@ -1,223 +0,0 @@
-import {
-  onTrackInk,
-  switchSx
-} from "./chunk-2PBT2HQH.js";
-import {
-  LABEL_GAP_UNITS,
-  SWITCH_ICON_SIZES,
-  TAP_TARGET_MIN
-} from "./chunk-D5SZXH7Q.js";
-import {
-  sxRem
-} from "./chunk-YKCAJ2TN.js";
-
-// src/components/form/Switch/Switch.parts.tsx
-import Box from "@mui/material/Box/index.js";
-import FormHelperText from "@mui/material/FormHelperText/index.js";
-import MuiSwitch from "@mui/material/Switch/index.js";
-import Typography from "@mui/material/Typography/index.js";
-import { styled, useTheme } from "@mui/material/styles/index.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var StyledSwitch = styled(MuiSwitch, {
-  shouldForwardProp: (prop) => ![
-    "customVariant",
-    "customColor",
-    "customSize",
-    "glow",
-    "glass",
-    "gradient",
-    "trackWidth",
-    "trackHeight",
-    "onText",
-    "offText",
-    "loading",
-    "ripple",
-    "pulse"
-  ].includes(prop)
-})(({ theme, ...flags }) => ({ ...switchSx(theme, flags) }));
-var StyledLabelContainer = styled(Box, {
-  shouldForwardProp: (prop) => !["labelPosition", "error"].includes(prop)
-})(({ theme, labelPosition, error }) => {
-  const stacked = labelPosition === "top" || labelPosition === "bottom";
-  return {
-    display: "flex",
-    alignItems: stacked ? "flex-start" : "center",
-    flexDirection: labelPosition === "top" ? "column" : labelPosition === "bottom" ? "column-reverse" : "row",
-    gap: theme.spacing(stacked ? LABEL_GAP_UNITS.stacked : LABEL_GAP_UNITS.beside),
-    width: "100%",
-    ...error && { "& .MuiTypography-root": { color: theme.palette.error.main } }
-  };
-});
-var LabelContainer = ({ labelPosition, error, children }) => /* @__PURE__ */ jsx(StyledLabelContainer, { labelPosition, error, children });
-var SwitchIcon = ({
-  icon,
-  shown,
-  animated,
-  size,
-  side,
-  onInk
-}) => {
-  const isOn = side === "on";
-  const translate = isOn ? "translate(-50%, -50%)" : "translate(50%, -50%)";
-  return /* @__PURE__ */ jsx(
-    Box,
-    {
-      sx: {
-        position: "absolute",
-        top: "50%",
-        ...isOn ? { left: shown ? 4 : "50%" } : { right: shown ? 4 : "50%" },
-        transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
-        opacity: shown ? 1 : 0,
-        transform: `${translate} scale(${shown && animated ? 1 : 0.8})`,
-        pointerEvents: "none",
-        zIndex: 2,
-        color: isOn ? onInk : "text.secondary",
-        fontSize: sxRem(SWITCH_ICON_SIZES[size] ?? SWITCH_ICON_SIZES.md)
-      },
-      children: icon
-    }
-  );
-};
-var SwitchControl = ({
-  checked,
-  onChange,
-  onIcon,
-  offIcon,
-  animated,
-  size,
-  dataTestId,
-  switchRef,
-  inputId,
-  inputProps,
-  describedBy,
-  rest,
-  ...flags
-}) => {
-  const props = rest;
-  const theme = useTheme();
-  const onInk = onTrackInk(theme, flags);
-  return /* @__PURE__ */ jsxs(Box, { sx: { position: "relative", display: "inline-flex" }, children: [
-    /* @__PURE__ */ jsx(
-      StyledSwitch,
-      {
-        ref: switchRef,
-        ...flags,
-        checked,
-        onChange,
-        disabled: Boolean(flags.loading) || props.disabled,
-        ...props,
-        inputProps: {
-          "aria-label": props["aria-label"],
-          "data-testid": dataTestId || "switch",
-          ...inputProps,
-          id: inputId,
-          "aria-describedby": describedBy
-        }
-      }
-    ),
-    onIcon && /* @__PURE__ */ jsx(
-      SwitchIcon,
-      {
-        icon: onIcon,
-        shown: Boolean(checked),
-        animated,
-        size,
-        side: "on",
-        onInk
-      }
-    ),
-    offIcon && /* @__PURE__ */ jsx(
-      SwitchIcon,
-      {
-        icon: offIcon,
-        shown: !checked,
-        animated,
-        size,
-        side: "off",
-        onInk
-      }
-    )
-  ] });
-};
-var SwitchHelper = ({ helperText, error, dataTestId, id }) => helperText ? /* @__PURE__ */ jsx(
-  FormHelperText,
-  {
-    id,
-    error,
-    sx: { mt: 1 },
-    "data-testid": dataTestId ? `${dataTestId}-helper` : "switch-helper",
-    children: helperText
-  }
-) : null;
-var SwitchLabel = ({ label, description, error, dataTestId, htmlFor, descriptionId, disabled }) => /* @__PURE__ */ jsxs(Box, { sx: { flex: 1, minWidth: 0 }, children: [
-  /* @__PURE__ */ jsx(
-    Typography,
-    {
-      component: "label",
-      htmlFor,
-      variant: "body2",
-      fontWeight: 500,
-      color: error ? "error.main" : "text.primary",
-      sx: {
-        display: "flex",
-        alignItems: "center",
-        // The floor applies to the row the label shares with the control. A
-        // description already makes the row taller than 40px, so forcing it
-        // there would only add blank space.
-        ...description ? {} : { minHeight: TAP_TARGET_MIN },
-        // A disabled control's label toggles nothing, so it must not wear the
-        // cursor that says it does.
-        ...htmlFor && !disabled ? { cursor: "pointer" } : {}
-      },
-      "data-testid": dataTestId ? `${dataTestId}-label` : "switch-label",
-      children: label
-    }
-  ),
-  description && /* @__PURE__ */ jsx(
-    Typography,
-    {
-      id: descriptionId,
-      variant: "caption",
-      color: error ? "error.main" : "text.secondary",
-      sx: { display: "block", mt: 0.5 },
-      children: description
-    }
-  )
-] });
-var SwitchRow = ({
-  label,
-  description,
-  labelPosition,
-  error,
-  dataTestId,
-  htmlFor,
-  descriptionId,
-  disabled,
-  control
-}) => {
-  if (!label) return /* @__PURE__ */ jsx(Fragment, { children: control });
-  return /* @__PURE__ */ jsxs(LabelContainer, { labelPosition, error, children: [
-    labelPosition === "start" && control,
-    /* @__PURE__ */ jsx(
-      SwitchLabel,
-      {
-        label,
-        description,
-        error,
-        dataTestId,
-        htmlFor,
-        descriptionId,
-        disabled
-      }
-    ),
-    labelPosition !== "start" && control
-  ] });
-};
-
-export {
-  SwitchIcon,
-  SwitchControl,
-  SwitchHelper,
-  SwitchRow
-};
-//# sourceMappingURL=chunk-J4NXTSJY.js.map

package/dist/chunk-J4NXTSJY.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/form/Switch/Switch.parts.tsx"],"sourcesContent":["import Box from '@mui/material/Box/index.js';\nimport FormHelperText from '@mui/material/FormHelperText/index.js';\nimport MuiSwitch from '@mui/material/Switch/index.js';\nimport Typography from '@mui/material/Typography/index.js';\nimport { styled, useTheme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { LABEL_GAP_UNITS, SWITCH_ICON_SIZES, TAP_TARGET_MIN } from './Switch.metrics';\nimport { onTrackInk, switchSx } from './Switch.styles';\nimport type { SwitchFlags } from './Switch.styles';\nimport type { SwitchProps } from './Switch.types';\nimport { sxRem } from '../../../tokens/relative';\nimport type { SizeValue } from '../../../tokens/vocabulary';\n\nconst StyledSwitch = styled(MuiSwitch, {\n  shouldForwardProp: (prop) =>\n    ![\n      'customVariant',\n      'customColor',\n      'customSize',\n      'glow',\n      'glass',\n      'gradient',\n      'trackWidth',\n      'trackHeight',\n      'onText',\n      'offText',\n      'loading',\n      'ripple',\n      'pulse',\n    ].includes(prop as string),\n})<SwitchFlags>(({ theme, ...flags }) => ({ ...switchSx(theme, flags) }));\n\n/**\n * A top or bottom label stacks and aligns to the start; start/end sit the label\n * beside the control and centre it.\n */\nconst StyledLabelContainer = styled(Box, {\n  shouldForwardProp: (prop) => !['labelPosition', 'error'].includes(prop as string),\n})<{ labelPosition?: string; error?: boolean }>(({ theme, labelPosition, error }) => {\n  const stacked = labelPosition === 'top' || labelPosition === 'bottom';\n\n  return {\n    display: 'flex',\n    alignItems: stacked ? 'flex-start' : 'center',\n    flexDirection:\n      labelPosition === 'top' ? 'column' : labelPosition === 'bottom' ? 'column-reverse' : 'row',\n    gap: theme.spacing(stacked ? LABEL_GAP_UNITS.stacked : LABEL_GAP_UNITS.beside),\n    width: '100%',\n    ...(error && { '& .MuiTypography-root': { color: theme.palette.error.main } }),\n  };\n});\n\n/**\n * A plain wrapper over the styled row. Exporting the styled component itself\n * needs a @mui/system reference tsc calls unportable (TS2742).\n */\nconst LabelContainer: React.FC<{\n  labelPosition?: string;\n  error?: boolean;\n  children: React.ReactNode;\n}> = ({ labelPosition, error, children }) => (\n  <StyledLabelContainer labelPosition={labelPosition} error={error}>\n    {children}\n  </StyledLabelContainer>\n);\n\nexport interface SwitchIconProps {\n  icon: React.ReactNode;\n  /** True when this icon is the one the current state should show. */\n  shown: boolean;\n  animated: boolean;\n  size: string;\n  side: 'on' | 'off';\n  /** The ink for the ON icon, which sits on the brand-filled track (FUT-1924). */\n  onInk: string;\n}\n\n/**\n * One of the two icons overlaid on the track. The on icon slides to the left\n * edge when checked and the off icon to the right when unchecked; they are\n * mirror images, so they share this component rather than being written twice.\n */\nexport const SwitchIcon: React.FC<SwitchIconProps> = ({\n  icon,\n  shown,\n  animated,\n  size,\n  side,\n  onInk,\n}) => {\n  const isOn = side === 'on';\n  const translate = isOn ? 'translate(-50%, -50%)' : 'translate(50%, -50%)';\n\n  return (\n    <Box\n      sx={{\n        position: 'absolute',\n        top: '50%',\n        ...(isOn ? { left: shown ? 4 : '50%' } : { right: shown ? 4 : '50%' }),\n        transition: 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)',\n        opacity: shown ? 1 : 0,\n        transform: `${translate} scale(${shown && animated ? 1 : 0.8})`,\n        pointerEvents: 'none',\n        zIndex: 2,\n        color: isOn ? onInk : 'text.secondary',\n        fontSize: sxRem(SWITCH_ICON_SIZES[size as SizeValue] ?? SWITCH_ICON_SIZES.md),\n      }}\n    >\n      {icon}\n    </Box>\n  );\n};\n\nexport interface SwitchControlProps extends SwitchFlags {\n  checked?: boolean;\n  onChange?: SwitchProps['onChange'];\n  onIcon?: React.ReactNode;\n  offIcon?: React.ReactNode;\n  animated: boolean;\n  size: string;\n  dataTestId?: string;\n  switchRef?: React.Ref<HTMLButtonElement>;\n  /** The id the label points at — always set, so the input always has one. */\n  inputId: string;\n  /** The caller's own `inputProps`, merged rather than spread over (FUT-1905). */\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n  /** The description's id, appended to whatever the caller described it by. */\n  describedBy?: string;\n  rest: Record<string, unknown>;\n}\n\n/** The control itself: the track, and the two icons that may sit over it. */\nexport const SwitchControl: React.FC<SwitchControlProps> = ({\n  checked,\n  onChange,\n  onIcon,\n  offIcon,\n  animated,\n  size,\n  dataTestId,\n  switchRef,\n  inputId,\n  inputProps,\n  describedBy,\n  rest,\n  ...flags\n}) => {\n  const props = rest as Record<string, unknown> & { disabled?: boolean };\n  const theme = useTheme();\n  const onInk = onTrackInk(theme, flags);\n\n  return (\n    <Box sx={{ position: 'relative', display: 'inline-flex' }}>\n      <StyledSwitch\n        ref={switchRef}\n        {...flags}\n        checked={checked}\n        onChange={onChange}\n        disabled={Boolean(flags.loading) || props.disabled}\n        {...props}\n        /*\n          AFTER `props`, not before it (FUT-1905). `inputProps` used to be\n          written first and `{...props}` spread over it, so a caller passing\n          `inputProps` of its own silently replaced the whole object — losing\n          the `data-testid` every spec finds this control by, and the `id` the\n          label points at.\n\n          The order inside is the contract. Everything the component DEFAULTS\n          goes first, so a caller's own key still wins — that is what it could\n          do before, and a fix for a clobber must not become a clobber the\n          other way. Only the two the component OWNS come last: the `id`, which\n          already resolved the caller's spelling of it (`switchIds`), and\n          `aria-describedby`, which by then already CONTAINS whatever the\n          caller passed, in either spelling.\n        */\n        inputProps={\n          {\n            'aria-label': props['aria-label'],\n            'data-testid': dataTestId || 'switch',\n            ...inputProps,\n            id: inputId,\n            'aria-describedby': describedBy,\n          } as React.InputHTMLAttributes<HTMLInputElement>\n        }\n      />\n\n      {onIcon && (\n        <SwitchIcon\n          icon={onIcon}\n          shown={Boolean(checked)}\n          animated={animated}\n          size={size}\n          side=\"on\"\n          onInk={onInk}\n        />\n      )}\n      {offIcon && (\n        <SwitchIcon\n          icon={offIcon}\n          shown={!checked}\n          animated={animated}\n          size={size}\n          side=\"off\"\n          onInk={onInk}\n        />\n      )}\n    </Box>\n  );\n};\n\n/**\n * The helper line, which is where a validation message lands — so it is\n * `aria-describedby`'d like the description (FUT-1905).\n *\n * It carried no `id` and nothing pointed at it, which means an `error` state\n * announced as \"checkbox, checked\" and nothing else: the one sentence saying\n * WHY was on screen and outside the accessibility tree.\n */\nexport const SwitchHelper: React.FC<{\n  helperText?: React.ReactNode;\n  error?: boolean;\n  dataTestId?: string;\n  id?: string;\n}> = ({ helperText, error, dataTestId, id }) =>\n  helperText ? (\n    <FormHelperText\n      id={id}\n      error={error}\n      sx={{ mt: 1 }}\n      data-testid={dataTestId ? `${dataTestId}-helper` : 'switch-helper'}\n    >\n      {helperText}\n    </FormHelperText>\n  ) : null;\n\n/**\n * The label, WIRED to the input it names (FUT-1905).\n *\n * It used to be a `<p>` rendered as the control's sibling, with no `for`, no\n * `id` on the input and no `aria-labelledby` — so a labelled `Switch` announced\n * as \"checkbox, checked\" with no name, and clicking the words did nothing. Every\n * `Switch` in a consumer app was affected, not one call site, and the workaround\n * each had to write was a hand-typed `aria-label` duplicating the text already\n * on screen.\n *\n * A real `<label for>` fixes the name and the pointer in the same stroke, and it\n * is also the answer to the TAP TARGET: no size in `SWITCH_SIZES` clears the\n * 40px floor (`xl` is 34px tall), so the control cannot be made big enough by\n * passing a bigger `size` — instead the label becomes the target, which is how\n * this is normally solved. Hence `display: flex` and `TAP_TARGET_MIN`: the\n * label fills its half of the row and is never shorter than the floor.\n *\n * The DESCRIPTION stays outside the label and is pointed at by\n * `aria-describedby` instead: inside it, a two-line explanation would be read\n * out as part of the control's name.\n */\nconst SwitchLabel: React.FC<{\n  label: React.ReactNode;\n  description?: React.ReactNode;\n  error?: boolean;\n  dataTestId?: string;\n  /** The input's id. Omitted only where there is no input to point at. */\n  htmlFor?: string;\n  descriptionId?: string;\n  disabled?: boolean;\n}> = ({ label, description, error, dataTestId, htmlFor, descriptionId, disabled }) => (\n  <Box sx={{ flex: 1, minWidth: 0 }}>\n    <Typography\n      component=\"label\"\n      htmlFor={htmlFor}\n      variant=\"body2\"\n      fontWeight={500}\n      color={error ? 'error.main' : 'text.primary'}\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        // The floor applies to the row the label shares with the control. A\n        // description already makes the row taller than 40px, so forcing it\n        // there would only add blank space.\n        ...(description ? {} : { minHeight: TAP_TARGET_MIN }),\n        // A disabled control's label toggles nothing, so it must not wear the\n        // cursor that says it does.\n        ...(htmlFor && !disabled ? { cursor: 'pointer' } : {}),\n      }}\n      data-testid={dataTestId ? `${dataTestId}-label` : 'switch-label'}\n    >\n      {label}\n    </Typography>\n    {description && (\n      <Typography\n        id={descriptionId}\n        variant=\"caption\"\n        color={error ? 'error.main' : 'text.secondary'}\n        sx={{ display: 'block', mt: 0.5 }}\n      >\n        {description}\n      </Typography>\n    )}\n  </Box>\n);\n\n/**\n * The control and its label in one row, or the control alone.\n *\n * Lives here rather than inline in `Switch.tsx` because the two branches only\n * differ in what surrounds the control — and the component that assembles them\n * was long enough that the wiring got hard to see between them.\n */\nexport const SwitchRow: React.FC<{\n  label?: React.ReactNode;\n  description?: React.ReactNode;\n  labelPosition?: string;\n  error?: boolean;\n  dataTestId?: string;\n  htmlFor: string;\n  descriptionId?: string;\n  disabled?: boolean;\n  control: React.ReactNode;\n}> = ({\n  label,\n  description,\n  labelPosition,\n  error,\n  dataTestId,\n  htmlFor,\n  descriptionId,\n  disabled,\n  control,\n}) => {\n  if (!label) return <>{control}</>;\n\n  return (\n    <LabelContainer labelPosition={labelPosition} error={error}>\n      {labelPosition === 'start' && control}\n\n      <SwitchLabel\n        label={label}\n        description={description}\n        error={error}\n        dataTestId={dataTestId}\n        htmlFor={htmlFor}\n        descriptionId={descriptionId}\n        disabled={disabled}\n      />\n\n      {labelPosition !== 'start' && control}\n    </LabelContainer>\n  );\n};\n"],"mappings":"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","names":[]}

package/dist/chunk-JCBIPBGZ.js

@@ -1,235 +0,0 @@
-import {
-  selectInputSize
-} from "./chunk-WYXNFH5Y.js";
-import {
-  INPUT_BORDER,
-  INPUT_GLASS,
-  INPUT_GLOW,
-  INPUT_GRADIENT,
-  INPUT_PULSE
-} from "./chunk-RNIU447I.js";
-import {
-  splitTestId
-} from "./chunk-TYJR4GOF.js";
-import {
-  asFieldSize,
-  fieldControlStyles,
-  fieldHeight
-} from "./chunk-CGO452DC.js";
-import {
-  fieldRadius
-} from "./chunk-GDN2LUTZ.js";
-import {
-  fieldEdge
-} from "./chunk-7FDU3FIN.js";
-import {
-  absoluteInk
-} from "./chunk-FQ6UW7IY.js";
-
-// src/components/form/Select/Select.tsx
-import FormControl from "@mui/material/FormControl/index.js";
-import FormHelperText from "@mui/material/FormHelperText/index.js";
-import InputLabel from "@mui/material/InputLabel/index.js";
-import MenuItem from "@mui/material/MenuItem/index.js";
-import MuiSelect from "@mui/material/Select/index.js";
-import { alpha, keyframes, styled } from "@mui/material/styles/index.js";
-import React from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-var pulseAnimation = keyframes`
-  0% {
-    box-shadow: 0 0 0 0 currentColor;
-    opacity: 1;
-  }
-  70% {
-    box-shadow: 0 0 0 ${INPUT_PULSE.spread}px currentColor;
-    opacity: 0;
-  }
-  100% {
-    box-shadow: 0 0 0 0 currentColor;
-    opacity: 0;
-  }
-`;
-var glowStyles = (theme) => ({
-  "& .MuiOutlinedInput-root": {
-    boxShadow: `0 0 ${INPUT_GLOW.rest.blur}px ${alpha(theme.palette.primary.main, INPUT_GLOW.rest.alpha)}`,
-    "&.Mui-focused": {
-      boxShadow: `0 0 ${INPUT_GLOW.focused.blur}px ${alpha(theme.palette.primary.main, INPUT_GLOW.focused.alpha)}`
-    }
-  }
-});
-var pulseStyles = (theme, size) => ({
-  "&::after": {
-    content: '""',
-    position: "absolute",
-    top: "50%",
-    left: "0",
-    right: "0",
-    height: fieldHeight(theme, size),
-    transform: "translateY(-50%)",
-    borderRadius: fieldRadius(theme),
-    backgroundColor: theme.palette.primary.main,
-    opacity: INPUT_PULSE.opacity,
-    animation: `${pulseAnimation} ${INPUT_PULSE.ms / 1e3}s infinite`,
-    pointerEvents: "none",
-    zIndex: -1
-  }
-});
-var glassVariant = (theme) => ({
-  backgroundColor: alpha(theme.palette.background.paper, INPUT_GLASS.background.rest),
-  backdropFilter: `blur(${INPUT_GLASS.blur}px)`,
-  border: `${INPUT_BORDER.rest}px solid ${fieldEdge(theme)}`,
-  "& fieldset": { border: "none" },
-  "&:hover": {
-    backgroundColor: alpha(theme.palette.background.paper, INPUT_GLASS.background.hover),
-    borderColor: alpha(theme.palette.primary.main, INPUT_GLASS.hoverBorderAlpha)
-  },
-  "&.Mui-focused": {
-    backgroundColor: alpha(theme.palette.background.paper, INPUT_GLASS.background.focused),
-    borderColor: theme.palette.primary.main,
-    boxShadow: `0 0 0 ${INPUT_GLASS.focusRing.width}px ${alpha(theme.palette.primary.main, INPUT_GLASS.focusRing.alpha)}`
-  }
-});
-var gradientFill = (theme, strength) => `linear-gradient(${INPUT_GRADIENT.angleDeg}deg, ${alpha(theme.palette.primary.main, strength)}, ${alpha(theme.palette.secondary.main, strength)})`;
-var gradientVariant = (theme) => ({
-  background: gradientFill(theme, INPUT_GRADIENT.fill.rest),
-  border: `${INPUT_GRADIENT.borderWidth}px solid transparent`,
-  backgroundOrigin: "border-box",
-  backgroundClip: "padding-box, border-box",
-  position: "relative",
-  "& fieldset": { border: "none" },
-  "&::before": {
-    content: '""',
-    position: "absolute",
-    top: 0,
-    left: 0,
-    right: 0,
-    bottom: 0,
-    borderRadius: "inherit",
-    background: `linear-gradient(${INPUT_GRADIENT.angleDeg}deg, ${theme.palette.primary.main}, ${theme.palette.secondary.main})`,
-    mask: `linear-gradient(${absoluteInk(theme).white} 0 0) content-box, linear-gradient(${absoluteInk(theme).white} 0 0)`,
-    maskComposite: "exclude",
-    padding: `${INPUT_GRADIENT.borderWidth}px`,
-    zIndex: -1
-  },
-  "&:hover": {
-    background: gradientFill(theme, INPUT_GRADIENT.fill.hover)
-  },
-  "&.Mui-focused": {
-    background: gradientFill(theme, INPUT_GRADIENT.fill.focused),
-    "&::before": {
-      background: `linear-gradient(${INPUT_GRADIENT.angleDeg}deg, ${theme.palette.primary.dark}, ${theme.palette.secondary.dark})`
-    }
-  }
-});
-var defaultVariant = (theme) => ({
-  "& fieldset": { borderColor: fieldEdge(theme) },
-  "&:hover fieldset": { borderColor: theme.palette.primary.main },
-  "&.Mui-focused fieldset": { borderColor: theme.palette.primary.main, borderWidth: INPUT_BORDER.focused },
-  "&.Mui-error fieldset": { borderColor: theme.palette.error.main }
-});
-var variantStyles = (theme, variant) => {
-  if (variant === "glass") return glassVariant(theme);
-  if (variant === "gradient") return gradientVariant(theme);
-  return defaultVariant(theme);
-};
-var StyledFormControl = styled(FormControl, {
-  shouldForwardProp: (prop) => prop !== "customVariant" && prop !== "fieldSize" && prop !== "glow" && prop !== "pulse"
-})(({ theme, customVariant, fieldSize, glow, pulse }) => ({
-  position: "relative",
-  // The theme's field height for this size — the height `Input` draws for it.
-  ...fieldControlStyles(theme, fieldSize),
-  ...glow ? glowStyles(theme) : {},
-  ...pulse ? pulseStyles(theme, fieldSize) : {},
-  "& .MuiOutlinedInput-root": {
-    transition: "all 0.3s ease",
-    borderRadius: fieldRadius(theme),
-    ...variantStyles(theme, customVariant)
-  }
-}));
-function renderMenuItems(options, placeholder, dataTestId) {
-  const optionTestId = (value) => dataTestId ? `${dataTestId}-option-${value}` : `option-${value}`;
-  const items = options.map((option) => /* @__PURE__ */ jsx(
-    MenuItem,
-    {
-      value: option.value,
-      disabled: option.disabled,
-      "data-testid": optionTestId(option.value),
-      children: option.label
-    },
-    option.value
-  ));
-  if (placeholder) {
-    items.unshift(
-      /* @__PURE__ */ jsx(MenuItem, { value: "", disabled: true, children: placeholder }, "__placeholder__")
-    );
-  }
-  return items;
-}
-var formControlSize = (size) => {
-  if (size === void 0) return void 0;
-  return selectInputSize(size) === "sm" ? "small" : "medium";
-};
-var Select = React.forwardRef(
-  ({
-    // `variant`/`size`/`glow`/`pulse` intentionally have no defaults: undefined
-    // resolves to the default variant, MUI's medium size, and no glow/pulse —
-    // keeping this render function under the complexity budget.
-    variant,
-    options,
-    label,
-    helperText,
-    fullWidth = true,
-    size,
-    error,
-    placeholder,
-    glow,
-    pulse,
-    value,
-    "aria-label": ariaLabel,
-    ...rest
-  }, ref) => {
-    const { testId: dataTestId, rest: props } = splitTestId(rest);
-    const labelId = React.useId();
-    const helperTextId = React.useId();
-    const selectId = React.useId();
-    return /* @__PURE__ */ jsxs(
-      StyledFormControl,
-      {
-        fullWidth,
-        size: formControlSize(size),
-        error,
-        customVariant: variant,
-        fieldSize: asFieldSize(size),
-        glow,
-        pulse,
-        ref,
-        "data-testid": dataTestId,
-        children: [
-          label && /* @__PURE__ */ jsx(InputLabel, { id: labelId, htmlFor: selectId, children: label }),
-          /* @__PURE__ */ jsx(
-            MuiSelect,
-            {
-              id: selectId,
-              labelId: label ? labelId : void 0,
-              label,
-              displayEmpty: Boolean(placeholder),
-              "aria-describedby": helperText ? helperTextId : void 0,
-              "data-testid": dataTestId ? `${dataTestId}-select` : "select",
-              value: value ?? "",
-              ...props,
-              SelectDisplayProps: ariaLabel === void 0 ? void 0 : { "aria-label": ariaLabel, "aria-labelledby": void 0 },
-              children: renderMenuItems(options, placeholder, dataTestId)
-            }
-          ),
-          helperText && /* @__PURE__ */ jsx(FormHelperText, { id: helperTextId, error, children: helperText })
-        ]
-      }
-    );
-  }
-);
-Select.displayName = "Select";
-
-export {
-  Select
-};
-//# sourceMappingURL=chunk-JCBIPBGZ.js.map

package/dist/chunk-JCBIPBGZ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/form/Select/Select.tsx"],"sourcesContent":["import FormControl from '@mui/material/FormControl/index.js';\nimport FormHelperText from '@mui/material/FormHelperText/index.js';\nimport InputLabel from '@mui/material/InputLabel/index.js';\nimport MenuItem from '@mui/material/MenuItem/index.js';\nimport MuiSelect from '@mui/material/Select/index.js';\nimport { alpha, type CSSObject, keyframes, styled, type Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport {\n  SELECT_BORDER,\n  SELECT_GLASS,\n  SELECT_GLOW,\n  SELECT_GRADIENT,\n  SELECT_PULSE,\n  selectInputSize,\n} from './Select.metrics';\nimport type { SelectProps } from './Select.types';\n\nimport { splitTestId } from '../../../platform/test-id';\nimport { fieldEdge } from '../../../tokens/field-edge';\nimport { asFieldSize, fieldControlStyles, fieldHeight } from '../../../tokens/field-height';\nimport type { SizeValue } from '../../../tokens/vocabulary';\nimport { fieldRadius } from '../../../tokens/field-radius';\nimport { absoluteInk } from '../../../tokens/ink';\n\n// Define pulse animation\nconst pulseAnimation = keyframes`\n  0% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 1;\n  }\n  70% {\n    box-shadow: 0 0 0 ${SELECT_PULSE.spread}px currentColor;\n    opacity: 0;\n  }\n  100% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 0;\n  }\n`;\n\n/** Glow ring on the outlined input, keyed off the `glow` prop. */\nconst glowStyles = (theme: Theme): CSSObject => ({\n  '& .MuiOutlinedInput-root': {\n    boxShadow: `0 0 ${SELECT_GLOW.rest.blur}px ${alpha(theme.palette.primary.main, SELECT_GLOW.rest.alpha)}`,\n    '&.Mui-focused': {\n      boxShadow: `0 0 ${SELECT_GLOW.focused.blur}px ${alpha(theme.palette.primary.main, SELECT_GLOW.focused.alpha)}`,\n    },\n  },\n});\n\n/** Pulsing halo behind the control, keyed off the `pulse` prop. */\nconst pulseStyles = (theme: Theme, size: SizeValue): CSSObject => ({\n  '&::after': {\n    content: '\"\"',\n    position: 'absolute',\n    top: '50%',\n    left: '0',\n    right: '0',\n    height: fieldHeight(theme, size),\n    transform: 'translateY(-50%)',\n    borderRadius: fieldRadius(theme),\n    backgroundColor: theme.palette.primary.main,\n    opacity: SELECT_PULSE.opacity,\n    animation: `${pulseAnimation} ${SELECT_PULSE.ms / 1000}s infinite`,\n    pointerEvents: 'none',\n    zIndex: -1,\n  },\n});\n\n/** `glass` variant: translucent, blurred background. */\nconst glassVariant = (theme: Theme): CSSObject => ({\n  backgroundColor: alpha(theme.palette.background.paper, SELECT_GLASS.background.rest),\n  backdropFilter: `blur(${SELECT_GLASS.blur}px)`,\n  border: `${SELECT_BORDER.rest}px solid ${fieldEdge(theme)}`,\n  '& fieldset': { border: 'none' },\n  '&:hover': {\n    backgroundColor: alpha(theme.palette.background.paper, SELECT_GLASS.background.hover),\n    borderColor: alpha(theme.palette.primary.main, SELECT_GLASS.hoverBorderAlpha),\n  },\n  '&.Mui-focused': {\n    backgroundColor: alpha(theme.palette.background.paper, SELECT_GLASS.background.focused),\n    borderColor: theme.palette.primary.main,\n    boxShadow: `0 0 0 ${SELECT_GLASS.focusRing.width}px ${alpha(theme.palette.primary.main, SELECT_GLASS.focusRing.alpha)}`,\n  },\n});\n\n/** `gradient` variant: gradient fill with a masked gradient border. */\nconst gradientFill = (theme: Theme, strength: number): string =>\n  `linear-gradient(${SELECT_GRADIENT.angleDeg}deg, ${alpha(theme.palette.primary.main, strength)}, ${alpha(theme.palette.secondary.main, strength)})`;\n\nconst gradientVariant = (theme: Theme): CSSObject => ({\n  background: gradientFill(theme, SELECT_GRADIENT.fill.rest),\n  border: `${SELECT_GRADIENT.borderWidth}px solid transparent`,\n  backgroundOrigin: 'border-box',\n  backgroundClip: 'padding-box, border-box',\n  position: 'relative',\n  '& fieldset': { border: 'none' },\n  '&::before': {\n    content: '\"\"',\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    right: 0,\n    bottom: 0,\n    borderRadius: 'inherit',\n    background: `linear-gradient(${SELECT_GRADIENT.angleDeg}deg, ${theme.palette.primary.main}, ${theme.palette.secondary.main})`,\n    mask: `linear-gradient(${absoluteInk(theme).white} 0 0) content-box, linear-gradient(${absoluteInk(theme).white} 0 0)`,\n    maskComposite: 'exclude',\n    padding: `${SELECT_GRADIENT.borderWidth}px`,\n    zIndex: -1,\n  },\n  '&:hover': {\n    background: gradientFill(theme, SELECT_GRADIENT.fill.hover),\n  },\n  '&.Mui-focused': {\n    background: gradientFill(theme, SELECT_GRADIENT.fill.focused),\n    '&::before': {\n      background: `linear-gradient(${SELECT_GRADIENT.angleDeg}deg, ${theme.palette.primary.dark}, ${theme.palette.secondary.dark})`,\n    },\n  },\n});\n\n/** `default` variant: standard outlined borders with hover/focus/error states. */\nconst defaultVariant = (theme: Theme): CSSObject => ({\n  '& fieldset': { borderColor: fieldEdge(theme) },\n  '&:hover fieldset': { borderColor: theme.palette.primary.main },\n  '&.Mui-focused fieldset': { borderColor: theme.palette.primary.main, borderWidth: SELECT_BORDER.focused },\n  '&.Mui-error fieldset': { borderColor: theme.palette.error.main },\n});\n\n/** Pick the variant style block for the outlined input. */\nconst variantStyles = (theme: Theme, variant: SelectProps['variant']): CSSObject => {\n  if (variant === 'glass') return glassVariant(theme);\n  if (variant === 'gradient') return gradientVariant(theme);\n  return defaultVariant(theme);\n};\n\nconst StyledFormControl = styled(FormControl, {\n  shouldForwardProp: (prop) =>\n    prop !== 'customVariant' && prop !== 'fieldSize' && prop !== 'glow' && prop !== 'pulse',\n})<{\n  customVariant?: SelectProps['variant'];\n  fieldSize: SizeValue;\n  glow?: boolean;\n  pulse?: boolean;\n}>(({ theme, customVariant, fieldSize, glow, pulse }) => ({\n  position: 'relative',\n  // The theme's field height for this size — the height `Input` draws for it.\n  ...fieldControlStyles(theme, fieldSize),\n  ...(glow ? glowStyles(theme) : {}),\n  ...(pulse ? pulseStyles(theme, fieldSize) : {}),\n  '& .MuiOutlinedInput-root': {\n    transition: 'all 0.3s ease',\n    borderRadius: fieldRadius(theme),\n    ...variantStyles(theme, customVariant),\n  },\n}));\n\n/**\n * Build the placeholder item plus one MenuItem per option. Returns a flat ARRAY\n * (not a Fragment): MUI `Select` enumerates its children with `React.Children`,\n * which does not descend into Fragments — a Fragment would hide every option.\n */\nfunction renderMenuItems(\n  options: SelectProps['options'],\n  placeholder: string | undefined,\n  dataTestId: string | undefined,\n): React.ReactNode[] {\n  const optionTestId = (value: string | number): string =>\n    dataTestId ? `${dataTestId}-option-${value}` : `option-${value}`;\n  const items = options.map((option) => (\n    <MenuItem\n      key={option.value}\n      value={option.value}\n      disabled={option.disabled}\n      data-testid={optionTestId(option.value)}\n    >\n      {option.label}\n    </MenuItem>\n  ));\n  if (placeholder) {\n    items.unshift(\n      <MenuItem key=\"__placeholder__\" value=\"\" disabled>\n        {placeholder}\n      </MenuItem>,\n    );\n  }\n  return items;\n}\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. This component's scale is already narrowed to `sm | md`, so the map\n * is exact rather than lossy.\n */\nconst formControlSize = (size: SelectProps['size']): 'small' | 'medium' | undefined => {\n  if (size === undefined) return undefined;\n  return selectInputSize(size) === 'sm' ? 'small' : 'medium';\n};\n\nexport const Select = React.forwardRef<HTMLDivElement, SelectProps>(\n  (\n    {\n      // `variant`/`size`/`glow`/`pulse` intentionally have no defaults: undefined\n      // resolves to the default variant, MUI's medium size, and no glow/pulse —\n      // keeping this render function under the complexity budget.\n      variant,\n      options,\n      label,\n      helperText,\n      fullWidth = true,\n      size,\n      error,\n      placeholder,\n      glow,\n      pulse,\n      value,\n      'aria-label': ariaLabel,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { testId: dataTestId, rest: props } = splitTestId(rest);\n    const labelId = React.useId();\n    const helperTextId = React.useId();\n    const selectId = React.useId();\n\n    return (\n      <StyledFormControl\n        fullWidth={fullWidth}\n        size={formControlSize(size)}\n        error={error}\n        customVariant={variant}\n        fieldSize={asFieldSize(size)}\n        glow={glow} pulse={pulse}\n        ref={ref}\n        data-testid={dataTestId}\n      >\n        {label && (\n          <InputLabel id={labelId} htmlFor={selectId}>\n            {label}\n          </InputLabel>\n        )}\n        <MuiSelect\n          id={selectId}\n          labelId={label ? labelId : undefined}\n          label={label}\n          displayEmpty={Boolean(placeholder)}\n          aria-describedby={helperText ? helperTextId : undefined}\n          data-testid={dataTestId ? `${dataTestId}-select` : 'select'}\n          value={value ?? ''}\n          {...props}\n          /*\n           * `role=\"combobox\"` sits on MUI's display DIV, not on the hidden\n           * native input that `{...props}` reaches — so an `aria-label` passed\n           * to this component never landed on the element carrying the role,\n           * and MUI's `aria-labelledby` then fell back to that div's OWN id.\n           * The control announced as its current value: a filter's field\n           * select read \"Status\" instead of \"Filtro 1 — campo\".\n           *\n           * Forwarding it here names the right element. The explicit\n           * `undefined` clears that self-referential `aria-labelledby`, which\n           * would otherwise win — a labelledby always beats a label in the\n           * accessible-name computation.\n           */\n          SelectDisplayProps={\n            ariaLabel === undefined\n              ? undefined\n              : { 'aria-label': ariaLabel, 'aria-labelledby': undefined }\n          }\n        >\n          {renderMenuItems(options, placeholder, dataTestId)}\n        </MuiSelect>\n        {helperText && (\n          <FormHelperText id={helperTextId} error={error}>\n            {helperText}\n          </FormHelperText>\n        )}\n      </StyledFormControl>\n    );\n  },\n);\n\nSelect.displayName = 'Select';\n"],"mappings":"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","names":[]}

package/dist/chunk-JCJGJX7V.js

@@ -1,96 +0,0 @@
-import {
-  default as default2
-} from "./chunk-6DPAWXZ3.js";
-
-// src/components/data-display/DataViews/data-views-drag.tsx
-import { createContext, useContext } from "react";
-import { jsx } from "react/jsx-runtime";
-var DragContainerContext = createContext(null);
-function DragContainerProvider({
-  value,
-  children
-}) {
-  return /* @__PURE__ */ jsx(DragContainerContext.Provider, { value, children });
-}
-function useDragItem(dragId) {
-  const container = useContext(DragContainerContext);
-  if (!container || dragId === void 0) {
-    return { draggable: false, itemProps: {}, handleProps: void 0, dragging: false, dropEdge: null };
-  }
-  const indicator = container.dropIndicator;
-  return {
-    draggable: true,
-    itemProps: container.itemProps(dragId),
-    handleProps: container.handleProps?.(dragId),
-    dragging: container.activeId === dragId,
-    dropEdge: indicator != null && indicator.id === dragId ? indicator.edge : null
-  };
-}
-function DropIndicator({ edge }) {
-  return /* @__PURE__ */ jsx(
-    default2,
-    {
-      "aria-hidden": true,
-      "data-slot": "drop-indicator",
-      "data-drop-edge": edge,
-      sx: {
-        position: "absolute",
-        left: 0,
-        right: 0,
-        // Centred ON the gap rather than inside the card: the item lands
-        // BETWEEN two rows, and a rule sitting within one of them reads as
-        // "into this row" instead.
-        ...edge === "before" ? { top: -2 } : { bottom: -2 },
-        height: 3,
-        borderRadius: 2,
-        bgcolor: "primary.main",
-        pointerEvents: "none",
-        zIndex: 2
-      }
-    }
-  );
-}
-function DragHandle({
-  handleProps,
-  gated,
-  testId
-}) {
-  return /* @__PURE__ */ jsx(
-    default2,
-    {
-      component: "span",
-      "aria-hidden": handleProps ? void 0 : true,
-      "data-testid": testId,
-      ...handleProps,
-      sx: {
-        display: "inline-grid",
-        gridTemplateColumns: "repeat(2, 3px)",
-        gap: "2px",
-        flexShrink: 0,
-        p: 0.5,
-        borderRadius: 1,
-        color: "text.disabled",
-        cursor: gated ? "grab" : "inherit",
-        touchAction: "none",
-        "&:active": { cursor: gated ? "grabbing" : "inherit" },
-        "&:hover": { color: "text.secondary" }
-      },
-      children: Array.from({ length: 6 }).map((_, index) => /* @__PURE__ */ jsx(
-        default2,
-        {
-          component: "span",
-          sx: { width: 3, height: 3, borderRadius: "50%", bgcolor: "currentColor" }
-        },
-        index
-      ))
-    }
-  );
-}
-
-export {
-  DragContainerProvider,
-  useDragItem,
-  DropIndicator,
-  DragHandle
-};
-//# sourceMappingURL=chunk-JCJGJX7V.js.map

package/dist/chunk-JCJGJX7V.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/DataViews/data-views-drag.tsx"],"sourcesContent":["\"use client\";\n\nimport { createContext, useContext, type ReactNode } from \"react\";\n\nimport { Box } from \"../../../mui/Box\";\n\n/**\n * DRAGGING, OWNED BY THE CONTAINER AND NOT BY THE CARD.\n *\n * A card cannot know whether it is draggable. The same `BaseListCard` renders\n * inside a reorderable queue, a read-only report and a board column that moves\n * items between columns — and only the thing holding them knows which. So the\n * container publishes a drag context and every card inside it becomes\n * draggable; a card with no container above it renders exactly as before, with\n * no handle and no listeners.\n *\n * This is a SEAM, not a drag implementation. It carries whatever props the\n * host's library hands out — dnd-kit's `attributes`/`listeners`, react-dnd's\n * connector output, or plain HTML5 `draggable` + `onDragStart` — because\n * picking one of those for every consumer of `@12-apps/ui` is a decision this\n * package has no business making. There is no drag dependency here, and adding\n * one would force it on every app that installs the library.\n */\n\n/** The props a container hands to one item. Deliberately untyped-ish: each DnD library has its own shape. */\nexport type DragItemProps = Record<string, unknown>;\n\nexport interface DragContainerValue {\n  /**\n   * Props for the item's ROOT — the element that moves. dnd-kit wants its\n   * `setNodeRef` and transform style here; HTML5 wants `draggable` and\n   * `onDragStart`.\n   */\n  itemProps: (id: string | number) => DragItemProps;\n  /**\n   * Props for the HANDLE alone, when the container wants drags to start only\n   * from the grip.\n   *\n   * Whole-card dragging breaks the two things a card must still do: selecting\n   * text in it, and hitting the checkbox without the row sliding away. When a\n   * container returns handle props, the card puts them on the grip and leaves\n   * the rest of itself alone.\n   */\n  handleProps?: (id: string | number) => DragItemProps;\n  /** The id currently being dragged, so its card can dim itself. */\n  activeId?: string | number | null;\n  /**\n   * WHERE THE DRAGGED ITEM WOULD LAND — the one thing a drag cannot be honest\n   * without.\n   *\n   * A list that dims the row you picked up and shows nothing else asks you to\n   * guess the outcome and find out by dropping. The marker turns that into a\n   * statement: THIS gap is where it goes.\n   *\n   * Published by the container, not computed by the card, for the same reason\n   * everything else here is: only the thing holding the items knows the\n   * geometry — which one you are over, which edge of it, and whether that\n   * position is legal. A card knows none of that about its neighbours.\n   *\n   * `null` while nothing is being dragged, or while the pointer is over no\n   * valid target.\n   */\n  dropIndicator?: { id: string | number; edge: \"before\" | \"after\" } | null;\n}\n\nconst DragContainerContext = createContext<DragContainerValue | null>(null);\n\n/**\n * Marks everything inside as draggable. Cards read this; nothing else does.\n */\nexport function DragContainerProvider({\n  value,\n  children,\n}: {\n  value: DragContainerValue;\n  children: ReactNode;\n}): React.JSX.Element {\n  return <DragContainerContext.Provider value={value}>{children}</DragContainerContext.Provider>;\n}\n\n/**\n * What one card needs to know about dragging.\n *\n * Returns the inert answer when there is no container OR no `dragId` — a card\n * that forgot its id must not render a handle that does nothing, which is worse\n * than no handle at all.\n */\nexport function useDragItem(dragId: string | number | undefined): {\n  draggable: boolean;\n  itemProps: DragItemProps;\n  handleProps: DragItemProps | undefined;\n  dragging: boolean;\n  /** Which of this card's edges the marker sits on, or null for neither. */\n  dropEdge: \"before\" | \"after\" | null;\n} {\n  const container = useContext(DragContainerContext);\n  if (!container || dragId === undefined) {\n    return { draggable: false, itemProps: {}, handleProps: undefined, dragging: false, dropEdge: null };\n  }\n  const indicator = container.dropIndicator;\n  return {\n    draggable: true,\n    itemProps: container.itemProps(dragId),\n    handleProps: container.handleProps?.(dragId),\n    dragging: container.activeId === dragId,\n    dropEdge: indicator != null && indicator.id === dragId ? indicator.edge : null,\n  };\n}\n\n/**\n * THE DROP MARKER — one rule across the card's edge, drawn where the item lands.\n *\n * Shared by every draggable surface rather than reimplemented per card, so a\n * reorderable list, a board column and a grid of tiles all say the same thing\n * the same way. A consumer wiring its own DnD gets this for free by publishing\n * `dropIndicator`; it never draws the marker itself.\n *\n * ABSOLUTE, AND OUTSIDE THE FLOW ON PURPOSE. A marker that took layout space\n * would push every row below it down by its own height the moment it appeared —\n * the list would twitch as you dragged across it, and the gap you were aiming\n * at would move out from under the pointer. Drawn over the gap instead, nothing\n * reflows.\n *\n * `pointerEvents: none` so it cannot swallow the dragover events that placed it,\n * and `aria-hidden` because the position it reports belongs in a live region the\n * LIST owns — fifty rows each announcing a marker is a screen-reader nightmare.\n */\nexport function DropIndicator({ edge }: { edge: \"before\" | \"after\" }): React.JSX.Element {\n  return (\n    <Box\n      aria-hidden\n      data-slot=\"drop-indicator\"\n      data-drop-edge={edge}\n      sx={{\n        position: \"absolute\",\n        left: 0,\n        right: 0,\n        // Centred ON the gap rather than inside the card: the item lands\n        // BETWEEN two rows, and a rule sitting within one of them reads as\n        // \"into this row\" instead.\n        ...(edge === \"before\" ? { top: -2 } : { bottom: -2 }),\n        height: 3,\n        borderRadius: 2,\n        bgcolor: \"primary.main\",\n        pointerEvents: \"none\",\n        zIndex: 2,\n      }}\n    />\n  );\n}\n\n/**\n * The grip. Six dots, the convention everywhere, drawn rather than imported so\n * this costs no icon dependency.\n *\n * `cursor: grab` on the handle only when the container gates drags to it —\n * otherwise the whole card carries the cursor and the handle is just an\n * affordance saying so.\n */\nexport function DragHandle({\n  handleProps,\n  gated,\n  testId,\n}: {\n  handleProps: DragItemProps | undefined;\n  gated: boolean;\n  testId?: string;\n}): React.JSX.Element {\n  return (\n    <Box\n      component=\"span\"\n      aria-hidden={handleProps ? undefined : true}\n      data-testid={testId}\n      {...handleProps}\n      sx={{\n        display: \"inline-grid\",\n        gridTemplateColumns: \"repeat(2, 3px)\",\n        gap: \"2px\",\n        flexShrink: 0,\n        p: 0.5,\n        borderRadius: 1,\n        color: \"text.disabled\",\n        cursor: gated ? \"grab\" : \"inherit\",\n        touchAction: \"none\",\n        \"&:active\": { cursor: gated ? \"grabbing\" : \"inherit\" },\n        \"&:hover\": { color: \"text.secondary\" },\n      }}\n    >\n      {Array.from({ length: 6 }).map((_, index) => (\n        <Box\n          key={index}\n          component=\"span\"\n          sx={{ width: 3, height: 3, borderRadius: \"50%\", bgcolor: \"currentColor\" }}\n        />\n      ))}\n    </Box>\n  );\n}\n"],"mappings":";;;;;AAEA,SAAS,eAAe,kBAAkC;AA2EjD;AAZT,IAAM,uBAAuB,cAAyC,IAAI;AAKnE,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AACF,GAGsB;AACpB,SAAO,oBAAC,qBAAqB,UAArB,EAA8B,OAAe,UAAS;AAChE;AASO,SAAS,YAAY,QAO1B;AACA,QAAM,YAAY,WAAW,oBAAoB;AACjD,MAAI,CAAC,aAAa,WAAW,QAAW;AACtC,WAAO,EAAE,WAAW,OAAO,WAAW,CAAC,GAAG,aAAa,QAAW,UAAU,OAAO,UAAU,KAAK;AAAA,EACpG;AACA,QAAM,YAAY,UAAU;AAC5B,SAAO;AAAA,IACL,WAAW;AAAA,IACX,WAAW,UAAU,UAAU,MAAM;AAAA,IACrC,aAAa,UAAU,cAAc,MAAM;AAAA,IAC3C,UAAU,UAAU,aAAa;AAAA,IACjC,UAAU,aAAa,QAAQ,UAAU,OAAO,SAAS,UAAU,OAAO;AAAA,EAC5E;AACF;AAoBO,SAAS,cAAc,EAAE,KAAK,GAAoD;AACvF,SACE;AAAA,IAACA;AAAA,IAAA;AAAA,MACC,eAAW;AAAA,MACX,aAAU;AAAA,MACV,kBAAgB;AAAA,MAChB,IAAI;AAAA,QACF,UAAU;AAAA,QACV,MAAM;AAAA,QACN,OAAO;AAAA;AAAA;AAAA;AAAA,QAIP,GAAI,SAAS,WAAW,EAAE,KAAK,GAAG,IAAI,EAAE,QAAQ,GAAG;AAAA,QACnD,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,SAAS;AAAA,QACT,eAAe;AAAA,QACf,QAAQ;AAAA,MACV;AAAA;AAAA,EACF;AAEJ;AAUO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AACF,GAIsB;AACpB,SACE;AAAA,IAACA;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa,cAAc,SAAY;AAAA,MACvC,eAAa;AAAA,MACZ,GAAG;AAAA,MACJ,IAAI;AAAA,QACF,SAAS;AAAA,QACT,qBAAqB;AAAA,QACrB,KAAK;AAAA,QACL,YAAY;AAAA,QACZ,GAAG;AAAA,QACH,cAAc;AAAA,QACd,OAAO;AAAA,QACP,QAAQ,QAAQ,SAAS;AAAA,QACzB,aAAa;AAAA,QACb,YAAY,EAAE,QAAQ,QAAQ,aAAa,UAAU;AAAA,QACrD,WAAW,EAAE,OAAO,iBAAiB;AAAA,MACvC;AAAA,MAEC,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,UACjC;AAAA,QAACA;AAAA,QAAA;AAAA,UAEC,WAAU;AAAA,UACV,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,cAAc,OAAO,SAAS,eAAe;AAAA;AAAA,QAFnE;AAAA,MAGP,CACD;AAAA;AAAA,EACH;AAEJ;","names":["default"]}