@12-apps/ui 6.46.1 → 6.47.0

package/src/components/form/Select/Select.tsx

@@ -1,163 +1,15 @@
-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, type CSSObject, keyframes, styled, type Theme } from '@mui/material/styles/index.js';
 import React from 'react';
 
-import {
-  SELECT_BORDER,
-  SELECT_GLASS,
-  SELECT_GLOW,
-  SELECT_GRADIENT,
-  SELECT_PULSE,
-  selectInputSize,
-} from './Select.metrics';
+import { SearchableSelect, shouldSearch } from './Select.searchable';
+import { formControlSize, SelectFieldControl } from './Select.styles';
 import type { SelectProps } from './Select.types';
 
 import { splitTestId } from '../../../platform/test-id';
-import { fieldEdge } from '../../../tokens/field-edge';
-import { asFieldSize, FIELD_BORDER_WIDTH, fieldControlStyles, fieldHeight } from '../../../tokens/field-height';
-import type { SizeValue } from '../../../tokens/vocabulary';
-import { fieldRadius } from '../../../tokens/field-radius';
-import { absoluteInk } from '../../../tokens/ink';
-import { rem } from '../../../tokens/relative';
-
-// Define pulse animation
-const pulseAnimation = (theme: Theme) => keyframes`
-  0% {
-    box-shadow: 0 0 0 0 currentColor;
-    opacity: 1;
-  }
-  70% {
-    box-shadow: 0 0 0 ${rem(theme, SELECT_PULSE.spread)} currentColor;
-    opacity: 0;
-  }
-  100% {
-    box-shadow: 0 0 0 0 currentColor;
-    opacity: 0;
-  }
-`;
-
-/** Glow ring on the outlined input, keyed off the `glow` prop. */
-const glowStyles = (theme: Theme): CSSObject => ({
-  '& .MuiOutlinedInput-root': {
-    boxShadow: `0 0 ${rem(theme, SELECT_GLOW.rest.blur)} ${alpha(theme.palette.primary.main, SELECT_GLOW.rest.alpha)}`,
-    '&.Mui-focused': {
-      boxShadow: `0 0 ${rem(theme, SELECT_GLOW.focused.blur)} ${alpha(theme.palette.primary.main, SELECT_GLOW.focused.alpha)}`,
-    },
-  },
-});
-
-/** Pulsing halo behind the control, keyed off the `pulse` prop. */
-const pulseStyles = (theme: Theme, size: SizeValue): CSSObject => ({
-  '&::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: SELECT_PULSE.opacity,
-    animation: `${pulseAnimation(theme)} ${SELECT_PULSE.ms / 1000}s infinite`,
-    pointerEvents: 'none',
-    zIndex: -1,
-  },
-});
-
-/** `glass` variant: translucent, blurred background. */
-const glassVariant = (theme: Theme): CSSObject => ({
-  backgroundColor: alpha(theme.palette.background.paper, SELECT_GLASS.background.rest),
-  backdropFilter: `blur(${rem(theme, SELECT_GLASS.blur)})`,
-  // `SELECT_BORDER.rest` is the field hairline.
-  border: `${FIELD_BORDER_WIDTH}px solid ${fieldEdge(theme)}`,
-  '& fieldset': { border: 'none' },
-  '&:hover': {
-    backgroundColor: alpha(theme.palette.background.paper, SELECT_GLASS.background.hover),
-    borderColor: alpha(theme.palette.primary.main, SELECT_GLASS.hoverBorderAlpha),
-  },
-  '&.Mui-focused': {
-    backgroundColor: alpha(theme.palette.background.paper, SELECT_GLASS.background.focused),
-    borderColor: theme.palette.primary.main,
-    boxShadow: `0 0 0 ${rem(theme, SELECT_GLASS.focusRing.width)} ${alpha(theme.palette.primary.main, SELECT_GLASS.focusRing.alpha)}`,
-  },
-});
-
-/** `gradient` variant: gradient fill with a masked gradient border. */
-const gradientFill = (theme: Theme, strength: number): string =>
-  `linear-gradient(${SELECT_GRADIENT.angleDeg}deg, ${alpha(theme.palette.primary.main, strength)}, ${alpha(theme.palette.secondary.main, strength)})`;
-
-const gradientVariant = (theme: Theme): CSSObject => ({
-  background: gradientFill(theme, SELECT_GRADIENT.fill.rest),
-  border: `${rem(theme, SELECT_GRADIENT.borderWidth)} 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(${SELECT_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: rem(theme, SELECT_GRADIENT.borderWidth),
-    zIndex: -1,
-  },
-  '&:hover': {
-    background: gradientFill(theme, SELECT_GRADIENT.fill.hover),
-  },
-  '&.Mui-focused': {
-    background: gradientFill(theme, SELECT_GRADIENT.fill.focused),
-    '&::before': {
-      background: `linear-gradient(${SELECT_GRADIENT.angleDeg}deg, ${theme.palette.primary.dark}, ${theme.palette.secondary.dark})`,
-    },
-  },
-});
-
-/** `default` variant: standard outlined borders with hover/focus/error states. */
-const defaultVariant = (theme: Theme): CSSObject => ({
-  '& fieldset': { borderColor: fieldEdge(theme) },
-  '&:hover fieldset': { borderColor: theme.palette.primary.main },
-  '&.Mui-focused fieldset': { borderColor: theme.palette.primary.main, borderWidth: rem(theme, SELECT_BORDER.focused) },
-  '&.Mui-error fieldset': { borderColor: theme.palette.error.main },
-});
-
-/** Pick the variant style block for the outlined input. */
-const variantStyles = (theme: Theme, variant: SelectProps['variant']): CSSObject => {
-  if (variant === 'glass') return glassVariant(theme);
-  if (variant === 'gradient') return gradientVariant(theme);
-  return defaultVariant(theme);
-};
-
-const StyledFormControl = styled(FormControl, {
-  shouldForwardProp: (prop) =>
-    prop !== 'customVariant' && prop !== 'fieldSize' && prop !== 'glow' && prop !== 'pulse',
-})<{
-  customVariant?: SelectProps['variant'];
-  fieldSize: SizeValue;
-  glow?: boolean;
-  pulse?: boolean;
-}>(({ 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),
-  },
-}));
+import { asFieldSize } from '../../../tokens/field-height';
 
 /**
  * Build the placeholder item plus one MenuItem per option. Returns a flat ARRAY
@@ -191,19 +43,7 @@ function renderMenuItems(
   return items;
 }
 
-/**
- * The house scale as a FormControl size.
- *
- * Not `muiSize`: that collapses five onto MUI's three, and a FormControl takes
- * only two. This component's scale is already narrowed to `sm | md`, so the map
- * is exact rather than lossy.
- */
-const formControlSize = (size: SelectProps['size']): 'small' | 'medium' | undefined => {
-  if (size === undefined) return undefined;
-  return selectInputSize(size) === 'sm' ? 'small' : 'medium';
-};
-
-export const Select = React.forwardRef<HTMLDivElement, SelectProps>(
+const MenuSelect = React.forwardRef<HTMLDivElement, SelectProps>(
   (
     {
       // `variant`/`size`/`glow`/`pulse` intentionally have no defaults: undefined
@@ -231,7 +71,7 @@ export const Select = React.forwardRef<HTMLDivElement, SelectProps>(
     const selectId = React.useId();
 
     return (
-      <StyledFormControl
+      <SelectFieldControl
         fullWidth={fullWidth}
         size={formControlSize(size)}
         error={error}
@@ -281,9 +121,23 @@ export const Select = React.forwardRef<HTMLDivElement, SelectProps>(
             {helperText}
           </FormHelperText>
         )}
-      </StyledFormControl>
+      </SelectFieldControl>
     );
   },
 );
 
+MenuSelect.displayName = 'MenuSelect';
+
+/**
+ * The house select. Up to five options it opens a menu; from six on it is a
+ * search box over a list of bounded height (`Select.searchable.tsx`), with the
+ * same props, events and test ids either way. `searchable` overrides the count.
+ */
+export const Select = React.forwardRef<HTMLDivElement, SelectProps>((props, ref) => {
+  if (shouldSearch(props)) return <SearchableSelect {...props} ref={ref} />;
+  // The searchable path's own props: nothing for MUI's Select to receive.
+  const { searchable: _searchable, noOptionsText: _noOptionsText, ...menuProps } = props;
+  return <MenuSelect {...menuProps} ref={ref} />;
+});
+
 Select.displayName = 'Select';

package/dist/chunk-6L2FKTBO.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, FIELD_BORDER_WIDTH, fieldControlStyles, fieldHeight } from '../../../tokens/field-height';\nimport type { SizeValue } from '../../../tokens/vocabulary';\nimport { fieldRadius } from '../../../tokens/field-radius';\nimport { absoluteInk } from '../../../tokens/ink';\nimport { rem } from '../../../tokens/relative';\n\n// Define pulse animation\nconst pulseAnimation = (theme: Theme) => keyframes`\n  0% {\n    box-shadow: 0 0 0 0 currentColor;\n    opacity: 1;\n  }\n  70% {\n    box-shadow: 0 0 0 ${rem(theme, SELECT_PULSE.spread)} 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 ${rem(theme, SELECT_GLOW.rest.blur)} ${alpha(theme.palette.primary.main, SELECT_GLOW.rest.alpha)}`,\n    '&.Mui-focused': {\n      boxShadow: `0 0 ${rem(theme, SELECT_GLOW.focused.blur)} ${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(theme)} ${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(${rem(theme, SELECT_GLASS.blur)})`,\n  // `SELECT_BORDER.rest` is the field hairline.\n  border: `${FIELD_BORDER_WIDTH}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 ${rem(theme, SELECT_GLASS.focusRing.width)} ${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: `${rem(theme, SELECT_GRADIENT.borderWidth)} 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: rem(theme, SELECT_GRADIENT.borderWidth),\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: rem(theme, 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":[]}