@mantis-core/ui 0.5.0 → 0.7.0

package/docs/components/toggle-inline-button.md

@@ -2,20 +2,52 @@
 name: ToggleInlineButton
 category: forms
 import: '@mantis-core/ui/components/Forms/ToggleInlineButton'
-whenToUse: Segmented button group (single or multi-select) wired to react-hook-form via a controller prop.
-baseLibrary: primereact/selectbutton
-formContract: ControllerProps
-requiredStyles: [scss/select-button.scss]
-relatedComponents: [FormFieldRender]
+whenToUse: Segmented single- or multi-choice control over PR11's ToggleButtonGroup; pass `multiple` for array-value mode.
+baseLibrary: '@primereact/ui/togglebutton'
+formContract: ChoiceFieldControllerProps
+relatedComponents: ['RadioGroup', 'SelectField']
 relatedNextCore: []
 props:
-  - { name: controller, type: ControllerProps, required: true, description: 'react-hook-form controller config' }
-  - { name: options, type: 'any[]', required: true, description: 'Options array passed to SelectButton' }
-  - { name: variant, type: ButtonVariant, required: false, default: '''primary''', description: 'Design-system color variant' }
-  - { name: multiple, type: boolean, required: false, default: 'false', description: 'Allow selecting multiple options' }
+  - { name: options, type: 'Record<string, unknown>[]', required: true, description: 'Option rows rendered as segments.' }
+  - { name: optionLabel, type: string, required: false, default: '''label''', description: 'Key read for each option''s display label.' }
+  - { name: optionValue, type: string, required: false, default: '''value''', description: 'Key read for each option''s bound value.' }
+  - { name: multiple, type: boolean, required: false, default: 'false', description: 'Array-value mode; toggles per-segment selection instead of single scalar selection.' }
+  - { name: renderOption, type: '(option: Record<string, unknown>, index: number) => ReactNode', required: false, description: 'Escape hatch: full custom per-segment render.' }
 ---
+
 ## Example
 
 ```tsx
-{/* TODO: add example */}
+import { ToggleInlineButton } from '@mantis-core/ui/components/Forms/ToggleInlineButton';
+import { useForm } from 'react-hook-form';
+
+const VIEWS = [
+  { label: 'List', value: 'list' },
+  { label: 'Grid', value: 'grid' },
+];
+
+function Example() {
+  const { control } = useForm({ defaultValues: { view: 'list' } });
+  return (
+    <ToggleInlineButton
+      name='view'
+      control={control}
+      label='View'
+      options={VIEWS}
+      optionLabel='label'
+      optionValue='value'
+    />
+  );
+}
 ```
+
+## Notes
+
+- Value shape: scalar (or `null`) by default; an ARRAY when `multiple` — selecting a segment
+  appends its value, deselecting filters it out.
+- `labelMode` defaults to `'beside'` for this wrapper (not the global config default).
+- PR11 `11.0.0-rc.1` gotcha (same as `RadioGroup`): the styled `ToggleButtonGroup` and
+  `ToggleButton.Root` are wired through two different React contexts in this rc, so the group's
+  `value`/`onValueChange` never reaches its children (verified in-browser). Until fixed upstream,
+  this wrapper binds each `ToggleButton.Root` individually via its documented `pressed`/
+  `onPressedChange` props; `ToggleButtonGroup` itself is used for layout/styling only.

package/docs/components/upload-files-preview.md

@@ -2,7 +2,7 @@
 name: UploadFilesPreview
 category: forms
 import: '@mantis-core/ui/components/Forms/UploadFilesPreview'
-whenToUse: Drag-and-drop upload zone with live preview grid, drag-to-reorder, and async upload queue; designed for image galleries.
+whenToUse: Drag-and-drop upload zone with live preview grid, drag-to-reorder, and async upload queue; designed for image galleries, not react-hook-form bound.
 baseLibrary: custom
 relatedComponents: [FileDropzone]
 relatedNextCore: []
@@ -17,8 +17,29 @@ props:
   - { name: disabledMessage, type: string, required: false, description: 'Message shown in the drop zone when disabled' }
   - { name: copy, type: 'Partial<UploadFilesPreviewCopy>', required: false, description: 'Override any UI text strings' }
 ---
+
 ## Example
 
 ```tsx
-{/* TODO: add example */}
+import UploadFilesPreview from '@mantis-core/ui/components/Forms/UploadFilesPreview';
+
+function Example() {
+  return (
+    <UploadFilesPreview
+      previews={[{ id: '1', fullUrl: 'https://example.com/photo.jpg' }]}
+      onUploadFile={async (file) => ({ id: file.name, fullUrl: URL.createObjectURL(file) })}
+      onFileUploaded={() => {}}
+      onRemoveFile={() => {}}
+      onReorder={() => {}}
+    />
+  );
+}
 ```
+
+## Notes
+
+- Generic over `TItem extends { id: string; fullUrl: string }` — pass richer item shapes for
+  gallery-specific metadata.
+- Uploads run per-file via `Promise.allSettled`; a failed `onUploadFile` marks that item `error` in
+  the queue with a discard action, it does not throw or block the rest of the batch.
+- Not react-hook-form bound — the parent owns `previews` state and persistence via the callbacks.

package/docs/components/use-field-controller.md

@@ -0,0 +1,58 @@
+---
+name: useFieldController
+category: forms
+import: '@mantis-core/ui/components/Forms/useFieldController'
+whenToUse: 'Hook every RHF field wrapper calls internally to wire useController + a stable id/aria/disabled/error-message resolution; call it directly only when hand-building a new field wrapper (see field-controller.md).'
+baseLibrary: custom
+formContract: FieldControllerProps
+relatedComponents: ['FieldShell', 'TextField']
+relatedNextCore: []
+props: []
+---
+
+## Example
+
+```tsx
+import { FieldShell } from '@mantis-core/ui/components/Forms/FieldShell';
+import { useFieldController, type FieldControllerProps } from '@mantis-core/ui/components/Forms/useFieldController';
+import { useForm, type FieldValues, type FieldPath } from 'react-hook-form';
+
+function RatingField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(
+  props: FieldControllerProps<TFieldValues, TName>,
+) {
+  const f = useFieldController<TFieldValues, TName>(props);
+  return (
+    <FieldShell id={f.id} label={props.label} errorMessage={f.errorMessage}>
+      <input
+        id={f.id}
+        type='number'
+        value={(f.field.value as number) ?? 0}
+        onChange={(e) => f.field.onChange(Number(e.target.value))}
+        onBlur={f.field.onBlur}
+        disabled={f.disabled}
+        {...f.aria}
+      />
+    </FieldShell>
+  );
+}
+
+function Example() {
+  const { control } = useForm({ defaultValues: { rating: 0 } });
+  return <RatingField name='rating' control={control} label='Rating' />;
+}
+```
+
+## Notes
+
+- Takes `FieldControllerProps` verbatim (no extra params) — see
+  [`field-controller.md`](../contracts/field-controller.md) for the full prop list.
+- Returns `{ field, fieldState, formState, id, errorId, helpId, variant, size, fluid, invalid,
+  disabled, errorMessage, aria }`. `disabled` is `props.disabled || formState.isSubmitting`;
+  `aria` is `{ 'aria-invalid', 'aria-describedby' }` (error id wins over help id) — PR11's own
+  `invalid` prop only drives styling, so this hook is the one place aria-invalid gets emitted.
+- Portal-based compounds (e.g. `Select`) have no native blur — call `field.onBlur()` from the
+  compound's `onOpenChange` (fired on close) instead of relying on a bare blur event, and spread
+  `aria` onto the trigger element rather than a hidden input.
+- `TFieldValues` defaults to `FieldValues` (untyped): if a caller omits both `control` and an
+  explicit generic, `name` silently accepts any string — pass `control` (or an explicit generic) to
+  keep full path-typing.

package/docs/components/user-menu.md

@@ -2,18 +2,38 @@
 name: UserMenu
 category: auth
 import: '@mantis-core/ui/components/auth/UserMenu'
-whenToUse: Topbar user avatar + dropdown with custom nav items and sign-out; no auth lib coupling.
-baseLibrary: custom
+whenToUse: Topbar avatar-triggered dropdown (custom nav items + sign-out); no auth-lib coupling.
+baseLibrary: '@primereact/ui/menu'
+requiredStyles: []
+relatedComponents: [Avatar]
 relatedNextCore: []
 props:
-  - { name: user, type: UserMenuUser, required: true }
-  - { name: items, type: 'UserMenuItem[]', required: false }
-  - { name: onSignOut, type: '() => void', required: false }
+  - { name: user, type: UserMenuUser, required: true, description: '{ name?, email?, avatarUrl? } — displayName falls back to email.' }
+  - { name: items, type: 'UserMenuItem[]', required: false, description: '{ label, icon?, href?, onClick? }; href navigates via next/navigation, otherwise onClick fires.' }
+  - { name: onSignOut, type: '() => void', required: false, description: 'When set, appends a separator + sign-out item.' }
   - { name: signOutLabel, type: string, required: false, default: '"Cerrar sesión"' }
   - { name: className, type: string, required: false }
 ---
+
 ## Example
 
 ```tsx
-<UserMenu user={{ name: session.user.name, email: session.user.email }} onSignOut={() => signOut({ callbackUrl: '/login' })} />
+import UserMenu from '@mantis-core/ui/components/auth/UserMenu';
+
+function Example() {
+  return (
+    <UserMenu
+      user={{ name: 'Diego Condo', email: 'diego@example.com' }}
+      items={[{ label: 'Perfil', icon: 'pi pi-user', href: '/perfil' }]}
+      onSignOut={() => console.log('sign out')}
+    />
+  );
+}
 ```
+
+## Notes
+
+- Migrated to PR11's compound `Menu`: `Menu.Root` owns open state; `Menu.Trigger` renders `as="button"`
+  wrapping the migrated `Avatar`. No manual outside-click listener or inline dropdown (PR10 shape) left.
+- Each entry fires through `onSelect` — `href` items call `router.push` (next/navigation), `onClick`
+  items just run their handler. `icon` is a PrimeIcons class string (e.g. `pi pi-cog`), not a component.

package/docs/contracts/dependency-map.md

@@ -6,34 +6,56 @@ Which base library each component wraps.
 
 ## PrimeReact wrappers
 
-- `ActionColumn`: `primereact/column`
-- `Button`: `primereact/button`
-- `ConfirmDialog`: `primereact/dialog`
-- `DateInput`: `primereact/calendar`
-- `DropDown`: `primereact/dropdown`
-- `FilterPannel`: `primereact/sidebar`
-- `IndexColumn`: `primereact/column`
-- `MenuButton`: `primereact/tieredmenu`
-- `MultiSelect`: `primereact/multiselect`
-- `MultiSelectFilter`: `primereact/multiselect`
-- `NumberInput`: `primereact/inputnumber`
-- `PaginatedTable`: `primereact/datatable`
-- `TextArea`: `primereact/inputtextarea`
-- `TextInput`: `primereact/inputtext`
-- `Toggle`: `primereact/checkbox`
-- `ToggleInlineButton`: `primereact/selectbutton`
+- `ActionColumn`: `@primereact/ui/menu`
+- `AutoCompleteField`: `@primereact/ui/autocomplete`
+- `Avatar`: `@primereact/ui/avatar`
+- `Button`: `@primereact/ui/button`
+- `CardSkeleton`: `@primereact/ui/skeleton`
+- `CheckboxField`: `@primereact/ui/checkbox`
+- `ColorPickerInput`: `@primereact/ui/inputcolor`
+- `DateField`: `@primereact/ui/datepicker`
+- `DatePresets`: `@primereact/ui/button`
+- `Drawer`: `@primereact/ui/drawer`
+- `FormWizard`: `@primereact/ui/stepper`
+- `IndexColumn`: `@primereact/ui/datatable`
+- `Loading`: `@primereact/ui/progressspinner`
+- `MantisDataTable`: `@primereact/ui/datatable`
+- `MaskField`: `@primereact/ui/inputtext`
+- `MenuButton`: `@primereact/ui/menu`
+- `Modal`: `@primereact/ui/dialog`
+- `MultiSelectFilter`: `@primereact/ui/select`
+- `NumberField`: `@primereact/ui/inputnumber`
+- `OtpInput`: `@primereact/ui/inputotp`
+- `PageTabs`: `@primereact/ui/tabs`
+- `PaginatedTable`: `@primereact/ui/datatable`
+- `PasswordInput`: `@primereact/ui/inputpassword`
+- `PhoneInput`: `@primereact/ui/inputtext`
+- `RadioGroup`: `@primereact/ui/radiobutton`
+- `RangeSlider`: `@primereact/ui/slider`
+- `RatingInput`: `@primereact/ui/rating`
+- `SearchInput`: `@primereact/ui/inputtext`
+- `SelectField`: `@primereact/ui/select`
+- `SwitchField`: `@primereact/ui/toggleswitch`
+- `TableSkeleton`: `@primereact/ui/skeleton`
+- `Tag`: `@primereact/ui/tag`
+- `TagsInput`: `@primereact/ui/inputtags`
+- `TextArea`: `@primereact/ui/textarea`
+- `TextField`: `@primereact/ui/inputtext`
+- `Timeline`: `@primereact/ui/timeline`
+- `ToggleInlineButton`: `@primereact/ui/togglebutton`
+- `UserMenu`: `@primereact/ui/menu`
 
 ## Non-PrimeReact wrappers
 
 - `AdminPageLayout`: `React context + custom shell`
-- `AsyncSelect`: `react-select/async`
-- `CKEditorInput`: `@ckeditor/ckeditor5-react`
+- `BarChart`: `chart.js`
+- `CKEditorInput`: `ckeditor`
+- `DonutChart`: `chart.js`
 - `ErrorMessage`: `@hookform/error-message`
-- `HiddenField`: `react-hook-form`
-- `MapPicker`: `next/dynamic`
-- `MapPickerClient`: `react-leaflet`
-- `Select`: `react-select`
-- `TimePicker`: `react-datepicker`
+- `LineChart`: `chart.js`
+- `MapPicker`: `leaflet`
+- `MapPickerClient`: `leaflet`
+- `MapPickerOSM`: `leaflet`
 
 ## Custom components
 
@@ -41,56 +63,32 @@ Which base library each component wraps.
 - `AdminPageHeader`
 - `AdminPageLayoutShell`
 - `AppShell`
-- `Avatar`
-- `BarChart`
 - `Breadcrumbs`
-- `CardSkeleton`
 - `ChangePasswordForm`
-- `ColorPickerInput`
-- `Combobox`
 - `CommandPalette`
-- `CurrencyInput`
+- `ConfirmDialog`
 - `DataState`
-- `DatePresets`
-- `DateRangeInput`
 - `DescriptionList`
 - `DirtyFormGuard`
-- `DonutChart`
-- `Drawer`
 - `EmptyState`
 - `ErrorBoundary`
+- `FieldShell`
 - `FileDropzone`
+- `FilterPannel`
 - `ForgotPasswordForm`
 - `FormActionsBar`
 - `FormFieldRender`
 - `FormSection`
-- `FormWizard`
-- `LineChart`
-- `Loading`
+- `HiddenField`
 - `LoginForm`
-- `MapPickerOSM`
-- `Modal`
-- `OtpInput`
-- `PageTabs`
 - `PageTitle`
 - `Pagination`
-- `PasswordInput`
-- `PhoneInput`
-- `RadioGroup`
-- `RangeSlider`
-- `RatingInput`
 - `RenderField`
 - `ResetPasswordForm`
 - `RichTextPreview`
-- `SearchInput`
 - `StatCard`
 - `StatusBadge`
-- `Switch`
 - `TableFilterField`
-- `TableSkeleton`
 - `TableToolbar`
-- `Tag`
-- `TagsInput`
-- `Timeline`
 - `UploadFilesPreview`
-- `UserMenu`
+- `useFieldController`

package/docs/contracts/field-controller.md

@@ -0,0 +1,138 @@
+# Field Controller
+
+Shared react-hook-form contract for every form wrapper in `@mantis-core/ui` (PR11). One hook —
+`useFieldController` — wires RHF's `useController` and the field's presentation shell so each
+wrapper only maps `field.value`/`field.onChange` into its own component's shape.
+
+Source: `packages/mantis-core-ui/src/components/Forms/useFieldController.ts` and `FieldShell.tsx`.
+
+## `FieldControllerProps`
+
+Form wrappers extend this directly as their own props — there is **no** `controller={{ ... }}`
+object prop. `TFieldValues`/`TName` are generic over the caller's form so `name` is
+autocompleted/validated against real fields, and `defaultValue`/`rules` are typed by path.
+
+```ts
+interface FieldControllerProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> {
+  name: TName;
+  control?: Control<TFieldValues>;
+  rules?: Omit<RegisterOptions<TFieldValues, TName>, 'valueAsNumber' | 'valueAsDate' | 'setValueAs' | 'disabled'>;
+  defaultValue?: FieldPathValue<TFieldValues, TName>;
+  shouldUnregister?: boolean;
+  disabled?: boolean;       // OR-ed with the form's isSubmitting state
+  label?: string;
+  labelMode?: LabelMode;    // 'ifta' | 'float' | 'beside' | 'top' | 'none' — defaults to MantisThemeProvider (ifta)
+  floatVariant?: FloatVariant; // 'over' | 'in' | 'on' — only used when labelMode='float'
+  addonBefore?: ReactNode;
+  addonAfter?: ReactNode;
+  variant?: InputVariant;   // 'outlined' | 'filled' — defaults to MantisThemeProvider
+  size?: FieldSize;         // 'small' | 'large' — defaults to MantisThemeProvider
+  fluid?: boolean;          // full-width override for this field
+  required?: boolean;       // presentational only — validation is `rules`
+  helpText?: string;
+  id?: string;              // override the generated id used to wire input <-> label <-> aria
+}
+```
+
+Usage — no `controller` wrapper, props are flat:
+
+```tsx
+<TextField name='email' control={control} label='Email' rules={{ required: 'Required' }} />
+```
+
+### `ChoiceFieldControllerProps` (bucket B: toggles, groups, ranges)
+
+For non-text-box controls (checkboxes, radio groups, rating, range), text-box-only affordances are
+removed **at the type level** so passing them fails to compile, not just render wrong:
+
+```ts
+type ChoiceFieldControllerProps<TFieldValues, TName> = Omit<
+  FieldControllerProps<TFieldValues, TName>,
+  'labelMode' | 'floatVariant' | 'addonBefore' | 'addonAfter' | 'variant'
+> & {
+  labelMode?: 'beside' | 'top' | 'none'; // 'beside' default for toggles, 'top' for groups
+};
+```
+
+A `<CheckboxField labelMode='float'>` or an addon on a `<RatingInput>` does not compile — `ifta` /
+`float` / `InputGroup` / `variant` don't apply to these controls.
+
+## `FieldShell` anatomy
+
+`FieldShell` owns label + addon + help + error composition; every wrapper supplies only its input
+node as `children`.
+
+```ts
+interface FieldShellProps {
+  id: string;
+  label?: string;
+  required?: boolean;
+  helpText?: string;
+  errorMessage?: string;
+  labelMode?: LabelMode;
+  floatVariant?: FloatVariant;
+  addonBefore?: ReactNode;
+  addonAfter?: ReactNode;
+  children: ReactNode;
+}
+```
+
+- **Label modes** (`LabelMode = 'ifta' | 'float' | 'beside' | 'top' | 'none'`):
+  - `ifta` — wraps input + label in PR11 `IftaLabel`.
+  - `float` — wraps input + label in PR11 `FloatLabel` (position per `floatVariant`: `over` / `in` / `on`).
+  - `beside` — label renders next to the control (row layout).
+  - `top` — label renders above the control.
+  - `none` — no label rendered even if `label` text is provided elsewhere.
+- **Addons** — `addonBefore`/`addonAfter` wrap the (already labeled) control in PR11's
+  `InputGroup.Root`, addons outer, labeled control inner.
+- **Fluid** — resolved from the `useFieldConfig()` context (not a per-shell prop); when on, wraps
+  the composed control in PR11's `<Fluid>`.
+- **Help/error** — rendered below the control as `<small id="${id}-help">` /
+  `<small id="${id}-error">`. Both render independently — if `helpText` and `errorMessage` are both
+  truthy, both `<small>` elements show at once; there is no suppression. The only precedence is in
+  `aria-describedby`, which prefers the error (see Aria wiring below).
+- **Required marker** — a presentational ` *` appended to the label, `aria-hidden`.
+
+### Aria wiring
+
+`useFieldController` owns aria, not `FieldShell`: PR11's `invalid` prop drives styling only, it does
+**not** emit `aria-invalid`. The hook returns an `aria` object —
+`{ 'aria-invalid': fieldState.invalid || undefined, 'aria-describedby': errorId | helpId | undefined }`
+(error id wins over help id when both are present) — spread onto the actual input/trigger element.
+
+## `useFieldController` return shape
+
+```ts
+const f = useFieldController({ name, control, rules, defaultValue, shouldUnregister, disabled, helpText, id, variant, size, fluid });
+// f.field, f.fieldState, f.formState  — raw RHF controller result
+// f.id, f.errorId, f.helpId           — stable ids for FieldShell + aria
+// f.variant, f.size, f.fluid          — resolved (prop ?? MantisThemeProvider config)
+// f.invalid                           — fieldState.invalid
+// f.disabled                          — disabled || formState.isSubmitting
+// f.errorMessage                      — fieldState.error?.message
+// f.aria                              — { 'aria-invalid', 'aria-describedby' }
+```
+
+## How to build a new form wrapper
+
+Canonical pattern (from `TextField.tsx`):
+
+1. Accept `FieldControllerProps<TFieldValues, TName>` (or `ChoiceFieldControllerProps` for bucket B)
+   intersected with the underlying PR11 primitive's own extra props (Omit the primitive's
+   controlled/state props — `value`, `onChange`, `invalid`, `disabled`, etc. — since the hook owns
+   those).
+2. Destructure the controller/presentation props out of `props`; call `useFieldController` with
+   `name, control, rules, defaultValue, shouldUnregister, disabled, helpText, id, variant, size, fluid`.
+3. Render `<FieldShell id={f.id} label={label} labelMode={labelMode} floatVariant={floatVariant}
+   addonBefore={addonBefore} addonAfter={addonAfter} required={required} helpText={helpText}
+   errorMessage={f.errorMessage}>` around the actual PR11 input.
+4. Wire the PR11 primitive to `f.field` (`name`, `value`, `onChange`/`onValueChange`, `onBlur`,
+   `ref`) and `f.id` (`id`), plus `invalid={f.invalid}`, `disabled={f.disabled}`,
+   `variant={f.variant}`, `size={f.size}`, `fluid={f.fluid}`, and spread `{...f.aria}` onto the
+   element that owns focus (native input, or the trigger button for portal-based compounds like
+   `Select`).
+5. Spread any remaining `...rest` primitive props straight onto the PR11 element as an escape hatch.
+
+Portal-based compounds (e.g. `Select`) have no native blur — call `f.field.onBlur()` from the
+compound's `onOpenChange` (fired on close) instead, and put id/aria on the trigger element rather
+than a bare `<input>`.

package/docs/contracts/style-imports.md

@@ -7,46 +7,27 @@
 ## All partials
 
 ```scss
-@use "@mantis-core/styles/scss/buttons.scss";
 @use "@mantis-core/styles/scss/ckeditor.scss";
 @use "@mantis-core/styles/scss/confirm-dialog.scss";
 @use "@mantis-core/styles/scss/data-state.scss";
 @use "@mantis-core/styles/scss/file-dropzone.scss";
 @use "@mantis-core/styles/scss/form-actions.scss";
-@use "@mantis-core/styles/scss/inputs.scss";
 @use "@mantis-core/styles/scss/rich-text-preview.scss";
-@use "@mantis-core/styles/scss/select-button.scss";
-@use "@mantis-core/styles/scss/select.scss";
 @use "@mantis-core/styles/scss/status-badge.scss";
-@use "@mantis-core/styles/scss/switch.scss";
 @use "@mantis-core/styles/scss/table.scss";
 ```
 
 ## Per component
 
-- `AsyncSelect`: `scss/select.scss`
-- `Button`: `scss/buttons.scss`
 - `CKEditorInput`: `scss/ckeditor.scss`
 - `ConfirmDialog`: `scss/confirm-dialog.scss`
-- `CurrencyInput`: `scss/inputs.scss`
 - `DataState`: `scss/data-state.scss`
-- `DateInput`: `scss/inputs.scss`
-- `DateRangeInput`: `scss/inputs.scss`
-- `DropDown`: `scss/inputs.scss`
 - `FileDropzone`: `scss/file-dropzone.scss`
 - `FormActionsBar`: `scss/form-actions.scss`
-- `MultiSelect`: `scss/inputs.scss`
-- `NumberInput`: `scss/inputs.scss`
+- `MantisDataTable`: `scss/table.scss`
 - `PaginatedTable`: `scss/table.scss`
-- `PasswordInput`: `scss/inputs.scss`
 - `RichTextPreview`: `scss/rich-text-preview.scss`
-- `Select`: `scss/select.scss`
 - `StatusBadge`: `scss/status-badge.scss`
-- `Switch`: `scss/switch.scss`
-- `TextArea`: `scss/inputs.scss`
-- `TextInput`: `scss/inputs.scss`
-- `TimePicker`: `scss/inputs.scss`
-- `ToggleInlineButton`: `scss/select-button.scss`
 
 ## Notes