@recursica/mantine-adapter 0.4.0 → 0.6.0

package/dist/src/components/ReadOnlyField/ReadOnlyField.d.ts

@@ -0,0 +1,20 @@
+import { default as React } from 'react';
+import { ReadOnlyFieldType } from '@recursica/adapter-common';
+import { RecursicaOverStyled } from '../../utils/filterStylingProps';
+import { FormControlWrapperProps } from '../FormControlWrapper/FormControlWrapper';
+export interface RecursicaReadOnlyFieldProps extends Omit<FormControlWrapperProps, "children" | "overStyled"> {
+    /** The specific value to be rendered in read-only mode explicitly matching the original field input */
+    value?: any;
+    /** The data type formatting rules bounding how the string is presented to the user */
+    type?: ReadOnlyFieldType;
+    /** Custom renderer explicitly responsible for formatting missing/empty value mappings (overriding default 'N/A') */
+    emptyValueComponent?: React.ElementType<{
+        value?: any;
+    }>;
+}
+export type ReadOnlyFieldProps = RecursicaOverStyled<RecursicaReadOnlyFieldProps>;
+/**
+ * A native generic form control wrapper exclusively responsible for displaying fixed data.
+ * Internally maps to structural ReadOnly primitive blocks bridging standard `FormControlWrapper` layouts natively.
+ */
+export declare const ReadOnlyField: React.ForwardRefExoticComponent<ReadOnlyFieldProps & React.RefAttributes<HTMLDivElement>>;

package/dist/src/components/ReadOnlyField/ReadOnlyTextField.d.ts

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { RecursicaOverStyled } from '../../utils/filterStylingProps';
+export interface RecursicaReadOnlyTextFieldProps {
+    /** The value strictly rendered as text output */
+    value?: any;
+}
+export type ReadOnlyTextFieldProps = RecursicaOverStyled<RecursicaReadOnlyTextFieldProps>;
+export declare const ReadOnlyTextField: React.FC<ReadOnlyTextFieldProps>;

package/dist/src/components/ReadOnlyField/WithReadOnlyWrapper.d.ts

@@ -0,0 +1,22 @@
+import { default as React } from 'react';
+import { ReadOnlyFieldType } from '@recursica/adapter-common';
+import { FormControlWrapperProps } from '../FormControlWrapper/FormControlWrapper';
+export interface WithReadOnlyWrapperProps extends Omit<FormControlWrapperProps, "children" | "overStyled"> {
+    /** Injects whether the field defaults to reading mode natively */
+    readOnly?: boolean;
+    /** Explicit React component directly overtaking the baseline text renderer when read-only mode is active */
+    readOnlyComponent?: React.ReactNode;
+    /** Instructs the underlying generic ReadOnlyField which raw visual structure to bridge automatically */
+    readOnlyType?: ReadOnlyFieldType;
+    /** The isolated raw data value intercepted explicitly into the ReadOnly formatters */
+    readOnlyValue?: any;
+    /** Safely enables deep Mantine overrides transparently bypassing block filters */
+    overStyled?: boolean;
+    /** The nested active node dynamically exposed exclusively when read-only bounds are disabled */
+    activeComponent: React.ReactNode;
+}
+/**
+ * Universal execution barrier trapping readOnly states globally.
+ * Natively delegates active logic down avoiding duplicative internal component bindings dynamically.
+ */
+export declare const WithReadOnlyWrapper: React.ForwardRefExoticComponent<WithReadOnlyWrapperProps & React.RefAttributes<HTMLDivElement>>;

package/dist/src/components/ReadOnlyField/index.d.ts

@@ -0,0 +1,3 @@
+export * from './ReadOnlyField';
+export * from './WithReadOnlyWrapper';
+export * from './ReadOnlyTextField';

package/dist/src/components/Search/Search.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type SearchProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const Search: React.FC<SearchProps>;

package/dist/src/components/SegmentedControl/SegmentedControl.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type SegmentedControlProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const SegmentedControl: React.FC<SegmentedControlProps>;

package/dist/src/components/Slider/Slider.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type SliderProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const Slider: React.FC<SliderProps>;

package/dist/src/components/Stepper/Stepper.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type StepperProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const Stepper: React.FC<StepperProps>;

package/dist/src/components/Switch/Switch.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type SwitchProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const Switch: React.FC<SwitchProps>;

package/dist/src/components/Table/Table.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type TableProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const Table: React.FC<TableProps>;

package/dist/src/components/Tabs/Tabs.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type TabsProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const Tabs: React.FC<TabsProps>;

package/dist/src/components/Text/Text.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+import { TextProps as MantineTextProps } from '@mantine/core';
+import { RecursicaOverStyled } from '../../utils/filterStylingProps';
+export type TextVariant = "body" | "body-small" | "caption" | "overline" | "subtitle" | "subtitle-small";
+export type RecursicaTextProps = Omit<MantineTextProps, "variant"> & {
+    /**
+     * The explicit typography hierarchy dictated by Recursica's global design tokens.
+     */
+    variant?: TextVariant;
+    children?: ReactNode;
+};
+export type TextProps = RecursicaOverStyled<RecursicaTextProps>;
+/**
+ * A generalized typographical wrapper limiting text properties to bounded Recursica UI-kit tokens inherently.
+ * Do not use for semantic headings; use the explicit `<Title>` component for `<h1>` - `<h6>`.
+ */
+export declare const Text: import('react').ForwardRefExoticComponent<TextProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/src/components/TextArea/TextArea.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type TextAreaProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const TextArea: React.FC<TextAreaProps>;

package/dist/src/components/TextField/TextField.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { InputProps, InputWrapperProps } from '@mantine/core';
+import { ReadOnlyControlProps } from '@recursica/adapter-common';
+import { RecursicaOverStyled } from '../../utils/filterStylingProps';
+import { RecursicaFormControlWrapperProps } from '../FormControlWrapper/FormControlWrapper';
+export interface RecursicaTextFieldProps extends Omit<InputProps, "size" | "variant" | "radius" | "wrapperProps">, Pick<InputWrapperProps, "label" | "error" | "required" | "withAsterisk" | "id">, Omit<React.ComponentPropsWithoutRef<"input">, "size" | "style" | "className" | "id">, Omit<RecursicaFormControlWrapperProps, "controlMaxWidth" | "controlMinWidth">, ReadOnlyControlProps {
+}
+export type TextFieldProps = RecursicaOverStyled<RecursicaTextFieldProps>;
+export declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement>>;

package/dist/src/components/TimePicker/TimePicker.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type TimePickerProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const TimePicker: React.FC<TimePickerProps>;

package/dist/src/components/Timeline/Timeline.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type TimelineProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const Timeline: React.FC<TimelineProps>;

package/dist/src/components/Title/Title.d.ts

@@ -0,0 +1,13 @@
+import { TitleProps as MantineTitleProps } from '@mantine/core';
+import { RecursicaOverStyled } from '../../utils/filterStylingProps';
+export type RecursicaTitleProps = Omit<MantineTitleProps, "order"> & {
+    /**
+     * Enforces semantic HTML headers (h1-h6) cleanly bound to native typographic scaling variables in the design system.
+     */
+    order?: 1 | 2 | 3 | 4 | 5 | 6;
+};
+export type TitleProps = RecursicaOverStyled<RecursicaTitleProps>;
+/**
+ * Enforces highly accessible structural markup utilizing semantic `<h1>` through `<h6>` tags securely bound directly to Recursica typographic scales.
+ */
+export declare const Title: import('react').ForwardRefExoticComponent<TitleProps & import('react').RefAttributes<HTMLHeadingElement>>;

package/dist/src/components/Toast/Toast.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type ToastProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const Toast: React.FC<ToastProps>;

package/dist/src/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type TooltipProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const Tooltip: React.FC<TooltipProps>;

package/dist/src/components/TransferList/TransferList.d.ts

@@ -0,0 +1,3 @@
+import { default as React } from 'react';
+export type TransferListProps = React.HTMLAttributes<HTMLDivElement>;
+export declare const TransferList: React.FC<TransferListProps>;

package/dist/src/components/index.d.ts

@@ -1,3 +1,39 @@
-export * from './Button';
 export * from './Accordion';
 export * from './Avatar';
+export * from './Badge/Badge';
+export * from './Breadcrumb/Breadcrumb';
+export * from './Button';
+export * from './Card/Card';
+export * from './Checkbox/Checkbox';
+export * from './Checkbox/CheckboxGroup';
+export * from './Chip/Chip';
+export * from './DatePicker/DatePicker';
+export * from './Dropdown/Dropdown';
+export * from './FileInput/FileInput';
+export * from './FileUpload/FileUpload';
+export * from './HoverCard/HoverCard';
+export * from './Link/Link';
+export * from './Loader/Loader';
+export * from './Label';
+export * from './Menu/Menu';
+export * from './Modal/Modal';
+export * from './NumberInput/NumberInput';
+export * from './Pagination/Pagination';
+export * from './Panel/Panel';
+export * from './Popover/Popover';
+export * from './Radio/Radio';
+export * from './ReadOnlyField';
+export * from './Search/Search';
+export * from './SegmentedControl/SegmentedControl';
+export * from './Slider/Slider';
+export * from './Stepper/Stepper';
+export * from './Switch/Switch';
+export * from './Table/Table';
+export * from './Tabs/Tabs';
+export * from './TextArea/TextArea';
+export * from './TextField/TextField';
+export * from './TimePicker/TimePicker';
+export * from './Timeline/Timeline';
+export * from './Toast/Toast';
+export * from './Tooltip/Tooltip';
+export * from './TransferList/TransferList';

package/dist/src/utils/ColorSchemeWrapper.d.ts

@@ -0,0 +1,3 @@
+export declare function ColorSchemeWrapper({ children, }: {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/src/utils/filterStylingProps.d.ts

@@ -0,0 +1,35 @@
+/**
+ * filterStylingProps
+ *
+ * This utility acts as the central gatekeeper for strict design-system adherence across
+ * all Recursica components mapped over Mantine.
+ *
+ * PHILOSOPHY:
+ * Recursica components are designed to be explicitly sandboxed tokens. Allowing external
+ * `className` or Mantine style system props (`bg`, `p`, etc.) breaks the design system by
+ * allowing developers to leak arbitrary designs into components.
+ *
+ * By default (`overStyled=false`), this utility actively prevents developers from overriding
+ * internal component styles (such as background, colors, typography, or internal classNames).
+ * It safely *permits* external layout overrides (like `margin` / `m`) so that components can
+ * easily be spaced alongside other DOM elements.
+ *
+ * If a developer passes `overStyled={true}`, this filter allows all styling properties to
+ * flow through to the underlying Mantine component natively, at the developer's own risk.
+ *
+ * @param props - The raw component props passed down to the wrapper
+ * @param overStyled - Boolean toggle to allow raw external styling. Defaults to false.
+ * @returns Sanitized component props safe for internal styling merging
+ */
+export declare const BLOCKED_STYLING_KEYS: readonly ["className", "classNames", "style", "styles", "vars", "p", "px", "py", "pt", "pb", "pl", "pr", "bg", "c", "opacity", "ff", "fz", "fw", "lts", "ta", "lh", "fs", "tt", "td", "bd", "bdw", "bds", "bdc", "bdr", "shadow", "w", "miw", "maw", "h", "mih", "mah"];
+export type BlockedStylingKeys = (typeof BLOCKED_STYLING_KEYS)[number];
+export type RecursicaSpacing = "rec-none" | "rec-sm" | "rec-default" | "rec-md" | "rec-lg" | "rec-xl" | "rec-2xl";
+export type ForbiddenStyles = {
+    [K in BlockedStylingKeys]?: never;
+};
+export type RecursicaOverStyled<T> = (Omit<T, BlockedStylingKeys> & ForbiddenStyles & {
+    overStyled?: false | undefined;
+}) | (T & {
+    overStyled: true;
+});
+export declare function filterStylingProps<T extends Record<string, unknown>>(props: T, overStyled?: boolean): Partial<T>;

package/package.json

@@ -11,7 +11,7 @@
     "type": "git",
     "url": "git+https://github.com/borderux/recursica.git"
   },
-  "version": "0.4.0",
+  "version": "0.6.0",
   "type": "module",
   "main": "./dist/mantine-adapter.cjs",
   "module": "./dist/mantine-adapter.js",
@@ -72,6 +72,7 @@
     "sass": "^1.89.2",
     "sirv": "^3.0.2",
     "storybook": "^10.3.3",
+    "storybook-dark-mode": "^5.0.0",
     "strip-literal": "^3.0.0",
     "typescript": "~5.8.3",
     "typescript-eslint": "^8.30.1",
@@ -81,9 +82,9 @@
     "vitest": "^3.2.4"
   },
   "peerDependencies": {
-    "@mantine/core": ">=8.0.0",
-    "@mantine/dates": ">=8.0.0",
-    "@mantine/hooks": ">=8.0.0",
+    "@mantine/core": "^8.0.0",
+    "@mantine/dates": "^8.0.0",
+    "@mantine/hooks": "^8.0.0",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0"
   }