@equinor/eds-core-react 2.3.0 → 2.3.1

package/dist/types/components/Autocomplete/Autocomplete.d.ts

@@ -6,12 +6,12 @@ export declare const StyledButton: import("styled-components/dist/types").IStyle
     as?: import("react").ElementType;
 } & {
     color?: "primary" | "secondary" | "danger";
-    variant?: "contained" | "contained_icon" | "outlined" | "ghost" | "ghost_icon";
+    variant?: "ghost" | "contained" | "contained_icon" | "outlined" | "ghost_icon";
     href?: string;
     disabled?: boolean;
     type?: string;
     fullWidth?: boolean;
-} & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Omit<any, "href" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement> | "variant" | "fullWidth">, never>> & string & Omit<import("@equinor/eds-utils").OverridableComponent<import("../Button").ButtonProps, HTMLButtonElement> & {
+} & import("react").ButtonHTMLAttributes<HTMLButtonElement> & Omit<any, "variant" | "href" | keyof import("react").ButtonHTMLAttributes<HTMLButtonElement> | "fullWidth">, never>> & string & Omit<import("@equinor/eds-utils").OverridableComponent<import("../Button").ButtonProps, HTMLButtonElement> & {
     Group: typeof import("../Button").ButtonGroup;
     Toggle: typeof import("../Button").ToggleButton;
 }, keyof import("react").Component<any, {}, any>>;

package/dist/types/components/Autocomplete/AutocompleteContext.d.ts

@@ -94,7 +94,7 @@ export declare const AutocompleteContext: import("react").Context<{
         optionLabel?: (option: unknown) => string;
     } & {
         ref?: React.Ref<HTMLInputElement>;
-    }, "ref" | "className" | "style" | "disabled" | "label" | "meta" | "multiple" | "variant" | "options" | "placeholder" | "readOnly" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "multiline" | "dropdownHeight" | "itemToKey" | "itemCompare" | "onClear" | "optionLabel">;
+    }, "meta" | "label" | "disabled" | "style" | "ref" | "className" | "multiple" | "variant" | "placeholder" | "readOnly" | "options" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "multiline" | "dropdownHeight" | "itemToKey" | "itemCompare" | "onClear" | "optionLabel">;
     highlightedIndex: number;
     selectedItem: unknown;
     isOpen: boolean;
@@ -208,7 +208,7 @@ export declare const useAutocompleteContext: () => {
         optionLabel?: (option: unknown) => string;
     } & {
         ref?: React.Ref<HTMLInputElement>;
-    }, "ref" | "className" | "style" | "disabled" | "label" | "meta" | "multiple" | "variant" | "options" | "placeholder" | "readOnly" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "multiline" | "dropdownHeight" | "itemToKey" | "itemCompare" | "onClear" | "optionLabel">;
+    }, "meta" | "label" | "disabled" | "style" | "ref" | "className" | "multiple" | "variant" | "placeholder" | "readOnly" | "options" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "multiline" | "dropdownHeight" | "itemToKey" | "itemCompare" | "onClear" | "optionLabel">;
     highlightedIndex: number;
     selectedItem: unknown;
     isOpen: boolean;

package/dist/types/components/Autocomplete/useAutocomplete.d.ts

@@ -102,7 +102,7 @@ export declare const useAutocomplete: <T>({ options, totalOptions, label, meta,
         optionLabel?: (option: T) => string;
     }) & {
         ref?: React.Ref<HTMLInputElement>;
-    }, "ref" | "className" | "style" | "disabled" | "label" | "meta" | "multiple" | "variant" | "options" | "placeholder" | "readOnly" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "multiline" | "dropdownHeight" | "itemToKey" | "itemCompare" | "onClear" | "optionLabel">;
+    }, "meta" | "label" | "disabled" | "style" | "ref" | "className" | "multiple" | "variant" | "placeholder" | "readOnly" | "options" | "helperText" | "helperIcon" | "loading" | "optionDisabled" | "totalOptions" | "initialSelectedOptions" | "noOptionsText" | "hideClearButton" | "selectedOptions" | "selectionDisplay" | "onOptionsChange" | "onInputChange" | "onAddNewOption" | "allowSelectAll" | "optionComponent" | "optionsFilter" | "autoWidth" | "clearSearchOnChange" | "multiline" | "dropdownHeight" | "itemToKey" | "itemCompare" | "onClear" | "optionLabel">;
     highlightedIndex: number;
     selectedItem: T;
     isOpen: boolean;

package/dist/types/components/Datepicker/DateRangePicker.d.ts

@@ -2,7 +2,7 @@
  * DateRangePicker component encapsulates the logic for selecting a range of dates
  * Either by accessible input fields or by a calendar.
  */
-export declare const DateRangePicker: import("react").ForwardRefExoticComponent<Omit<import("./props").DatePickerProps, "onChange" | "defaultValue" | "value" | "multiple" | "showTimeInput" | "stateRef"> & Partial<{
+export declare const DateRangePicker: import("react").ForwardRefExoticComponent<Omit<import("./props").DatePickerProps, "defaultValue" | "onChange" | "multiple" | "value" | "showTimeInput" | "stateRef"> & Partial<{
     onChange: (range: {
         from: Date | null;
         to: Date | null;

package/dist/types/components/SideBar/SideBarButton/index.d.ts

@@ -7,4 +7,4 @@ export type SideBarButtonProps = {
 export declare const SideBarButton: import("react").ForwardRefExoticComponent<{
     label: string;
     icon: IconData;
-} & Omit<ButtonProps, "type" | "href" | "variant" | "fullWidth"> & import("react").RefAttributes<HTMLButtonElement>>;
+} & Omit<ButtonProps, "variant" | "href" | "type" | "fullWidth"> & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/types/components/next/Button/Button.d.ts

@@ -0,0 +1,8 @@
+export declare const Button: import("react").ForwardRefExoticComponent<{
+    variant?: import("./Button.types").ButtonVariant;
+    size?: import("./Button.types").ButtonSize;
+    tone?: import("./Button.types").ButtonTone;
+    icon?: boolean;
+    round?: boolean;
+    children?: import("react").ReactNode;
+} & Omit<import("react").ButtonHTMLAttributes<HTMLButtonElement>, "children"> & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/types/components/next/Button/Button.figma.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/next/Button/Button.types.d.ts

@@ -0,0 +1,80 @@
+import type { ButtonHTMLAttributes, ReactNode } from 'react';
+/**
+ * Button visual style variants
+ * - `primary`: Solid filled button for primary actions
+ * - `secondary`: Bordered button for secondary actions
+ * - `ghost`: Minimal button for tertiary actions
+ */
+export type ButtonVariant = 'primary' | 'secondary' | 'ghost';
+/**
+ * Button size options
+ * - `small`: Compact size (24px height)
+ * - `default`: Standard size (36px height)
+ * - `large`: Generous size (44px height)
+ */
+export type ButtonSize = 'small' | 'default' | 'large';
+/**
+ * Color tone for theming
+ * - `accent`: Brand/action color (default)
+ * - `neutral`: Neutral gray tones
+ * - `danger`: Destructive/warning actions
+ */
+export type ButtonTone = 'accent' | 'neutral' | 'danger';
+export type ButtonProps = {
+    /**
+     * Button variant - controls visual style
+     * @default 'primary'
+     */
+    variant?: ButtonVariant;
+    /**
+     * Button size
+     * @default 'default'
+     */
+    size?: ButtonSize;
+    /**
+     * Color tone for theming
+     * @default 'accent'
+     */
+    tone?: ButtonTone;
+    /**
+     * Icon-only mode. Creates a square button optimized for a single icon.
+     * Always provide `aria-label` for accessibility when using icon-only buttons.
+     *
+     * @default false
+     *
+     * @example
+     * ```tsx
+     * import { save } from '@equinor/eds-icons'
+     * <Button icon aria-label="Save">
+     *   <Icon data={save} />
+     * </Button>
+     * ```
+     */
+    icon?: boolean;
+    /**
+     * Makes icon-only buttons circular instead of square.
+     * Only applies when `icon` prop is true.
+     * @default false
+     */
+    round?: boolean;
+    /**
+     * Button content. Can include text, icons, or both.
+     * Layout is handled automatically with CSS flexbox.
+     *
+     * @example
+     * ```tsx
+     * // Text only
+     * <Button>Save</Button>
+     *
+     * // Icon before text
+     * <Button><Icon data={save} /> Save</Button>
+     *
+     * // Icon after text
+     * <Button>Next <Icon data={chevron_right} /></Button>
+     *
+     * // Icon only (requires aria-label)
+     * <Button icon aria-label="Save"><Icon data={save} /></Button>
+     * ```
+     */
+    children?: ReactNode;
+} & Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'>;

package/dist/types/components/next/Button/index.d.ts

@@ -0,0 +1,2 @@
+export { Button } from './Button';
+export type { ButtonProps, ButtonVariant, ButtonSize, ButtonTone, } from './Button.types';

package/dist/types/components/next/Checkbox/Checkbox.d.ts

@@ -0,0 +1,7 @@
+export declare const Checkbox: import("react").ForwardRefExoticComponent<{
+    label?: import("react").ReactNode;
+    disabled?: boolean;
+    indeterminate?: boolean;
+    indicator?: string;
+    helperMessage?: import("react").ReactNode;
+} & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "type"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/next/Checkbox/Checkbox.figma.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/next/Checkbox/Checkbox.types.d.ts

@@ -0,0 +1,15 @@
+import type { InputHTMLAttributes, ReactNode } from 'react';
+export type CheckboxProps = {
+    /** Label for the checkbox */
+    label?: ReactNode;
+    /** If true, the checkbox will be disabled */
+    disabled?: boolean;
+    /** If true, the checkbox appears indeterminate. Note: You must also set
+     * the native element's indeterminate property via ref if needed.
+     */
+    indeterminate?: boolean;
+    /** Indicator text shown after the label, e.g. "(Required)" or "(Optional)" */
+    indicator?: string;
+    /** Helper message shown below the checkbox, useful for additional context */
+    helperMessage?: ReactNode;
+} & Omit<InputHTMLAttributes<HTMLInputElement>, 'type'>;

package/dist/types/components/next/Checkbox/index.d.ts

@@ -0,0 +1,2 @@
+export { Checkbox } from './Checkbox';
+export type { CheckboxProps } from './Checkbox.types';

package/dist/types/components/next/Field/Field.Description.d.ts

@@ -0,0 +1,3 @@
+export declare const FieldDescription: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLParagraphElement> & {
+    children: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLParagraphElement>>;

package/dist/types/components/next/Field/Field.HelperMessage.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Field.HelperMessage provides contextual help or validation feedback for form fields.
+ *
+ * Use with `useFieldIds` hook to connect to form controls via `aria-describedby`.
+ *
+ * @example
+ * ```tsx
+ * const { inputId, helperMessageId, getDescribedBy } = useFieldIds()
+ *
+ * <Field>
+ *   <Field.Label htmlFor={inputId}>Email</Field.Label>
+ *   <input id={inputId} aria-describedby={getDescribedBy()} />
+ *   <Field.HelperMessage id={helperMessageId}>We'll never share your email</Field.HelperMessage>
+ * </Field>
+ * ```
+ */
+export declare const HelperMessage: import("react").ForwardRefExoticComponent<{
+    children: import("react").ReactNode;
+} & import("react").HTMLAttributes<HTMLParagraphElement> & import("react").RefAttributes<HTMLParagraphElement>>;

package/dist/types/components/next/Field/Field.HelperMessage.types.d.ts

@@ -0,0 +1,12 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+/**
+ * Props for the Field.HelperMessage component.
+ *
+ * **Note:** Only one HelperMessage should be used per Field.
+ * Using multiple instances within the same Field context is not supported
+ * and may cause unexpected behavior with accessibility attributes.
+ */
+export type HelperMessageProps = {
+    /** Helper message content */
+    children: ReactNode;
+} & HTMLAttributes<HTMLParagraphElement>;

package/dist/types/components/next/Field/Field.Label.d.ts

@@ -0,0 +1,4 @@
+export declare const FieldLabel: import("react").ForwardRefExoticComponent<import("react").LabelHTMLAttributes<HTMLLabelElement> & {
+    children: import("react").ReactNode;
+    indicator?: string;
+} & import("react").RefAttributes<HTMLLabelElement>>;

package/dist/types/components/next/Field/Field.d.ts

@@ -0,0 +1,15 @@
+import { FieldDescription } from './Field.Description';
+import { HelperMessage } from './Field.HelperMessage';
+import { FieldLabel } from './Field.Label';
+declare const FieldComponent: import("react").ForwardRefExoticComponent<{
+    disabled?: boolean;
+    position?: "start" | "end";
+    children: import("react").ReactNode;
+} & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>>;
+type CompoundField = typeof FieldComponent & {
+    Label: typeof FieldLabel;
+    Description: typeof FieldDescription;
+    HelperMessage: typeof HelperMessage;
+};
+export declare const Field: CompoundField;
+export {};

package/dist/types/components/next/Field/Field.types.d.ts

@@ -0,0 +1,25 @@
+import type { HTMLAttributes, LabelHTMLAttributes, ReactNode } from 'react';
+export type FieldProps = {
+    /**
+     * Applies disabled styling to the field and all sub-components.
+     * Sets `data-disabled` attribute for CSS styling.
+     */
+    disabled?: boolean;
+    /**
+     * Enables horizontal layout for toggle inputs (checkbox, radio, switch).
+     * When omitted (default), uses vertical layout for standard text inputs.
+     * - `start`: Control on the left, label on the right
+     * - `end`: Label on the left, control on the right
+     */
+    position?: 'start' | 'end';
+    /** Field content composed of label, description, control, and helper message */
+    children: ReactNode;
+} & HTMLAttributes<HTMLDivElement>;
+export type FieldLabelProps = LabelHTMLAttributes<HTMLLabelElement> & {
+    children: ReactNode;
+    /** Indicator text shown after the label, e.g. "(Required)" or "(Optional)" */
+    indicator?: string;
+};
+export type FieldDescriptionProps = HTMLAttributes<HTMLParagraphElement> & {
+    children: ReactNode;
+};

package/dist/types/components/next/Field/index.d.ts

@@ -0,0 +1,5 @@
+export { Field } from './Field';
+export type { FieldProps, FieldLabelProps, FieldDescriptionProps, } from './Field.types';
+export type { HelperMessageProps } from './Field.HelperMessage.types';
+export { useFieldIds } from './useFieldIds';
+export type { FieldIds } from './useFieldIds';

package/dist/types/components/next/Field/useFieldIds.d.ts

@@ -0,0 +1,59 @@
+export interface FieldIds {
+    /** ID for the input/checkbox/radio/switch element */
+    inputId: string;
+    /**
+     * ID for the label element.
+     * Use with aria-labelledby for components without native label support.
+     * @example
+     * ```tsx
+     * <Field.Label id={labelId}>Name</Field.Label>
+     * <CustomInput aria-labelledby={labelId} />
+     * ```
+     */
+    labelId: string;
+    /** ID for the description element */
+    descriptionId: string;
+    /** ID for the helper message element */
+    helperMessageId: string;
+    /**
+     * Generate aria-describedby string from relevant IDs.
+     * @param options - Which elements are present in the field
+     * @returns Space-separated string of IDs, or undefined if none
+     */
+    getDescribedBy: (options?: {
+        hasDescription?: boolean;
+        hasHelperMessage?: boolean;
+    }) => string | undefined;
+}
+/**
+ * Hook for generating consistent, accessible IDs for form field elements.
+ *
+ * @param providedId - Optional custom ID. If not provided, a unique ID will be generated.
+ * @returns Object containing IDs for input, label, description, and helper message,
+ *          plus a helper function to generate aria-describedby.
+ *
+ * @example
+ * ```tsx
+ * const ids = useFieldIds()
+ *
+ * <Field>
+ *   <Field.Label htmlFor={ids.inputId}>Username</Field.Label>
+ *   <Field.Description id={ids.descriptionId}>
+ *     Choose a unique username
+ *   </Field.Description>
+ *   <input
+ *     id={ids.inputId}
+ *     aria-describedby={ids.getDescribedBy({
+ *       hasDescription: true,
+ *       hasHelperMessage: hasError,
+ *     })}
+ *   />
+ *   {hasError && (
+ *     <HelperMessage id={ids.helperMessageId}>
+ *       Username is already taken
+ *     </HelperMessage>
+ *   )}
+ * </Field>
+ * ```
+ */
+export declare function useFieldIds(providedId?: string): FieldIds;

package/dist/types/components/next/Input/Input.d.ts

@@ -0,0 +1,3 @@
+import { OverridableComponent } from '@equinor/eds-utils';
+import type { InputProps } from './Input.types';
+export declare const Input: OverridableComponent<InputProps, HTMLInputElement>;

package/dist/types/components/next/Input/Input.types.d.ts

@@ -0,0 +1,17 @@
+import { InputHTMLAttributes, ReactNode } from 'react';
+export type InputProps = {
+    /** Invalid state - shows error styling */
+    invalid?: boolean;
+    /** Text at the start (e.g., "$", "USD") - always neutral color */
+    startText?: string;
+    /** Adornment at the start (icons, buttons, etc.) - inherits state color (red when invalid) */
+    startAdornment?: ReactNode;
+    /** Text at the end (e.g., "km", "%") - always neutral color */
+    endText?: string;
+    /** Adornment at the end (icons, buttons, etc.) - inherits state color (red when invalid) */
+    endAdornment?: ReactNode;
+    /** Render as input or textarea */
+    as?: 'input' | 'textarea';
+    /** Class name applied to the container element */
+    containerClassName?: string;
+} & InputHTMLAttributes<HTMLInputElement>;

package/dist/types/components/next/Input/index.d.ts

@@ -0,0 +1,2 @@
+export { Input } from './Input';
+export type { InputProps } from './Input.types';

package/dist/types/components/next/Placeholder/Placeholder.d.ts

@@ -1,9 +1,7 @@
 /**
- * Placeholder component for testing the /next entry point.
- * This component should be removed once real EDS 2.0 components are added.
+ * Placeholder component for Code Connect example.
+ * This is a minimal component used to demonstrate Figma Code Connect setup.
  */
-export type PlaceholderProps = {
-    /** Text to display */
+export declare const Placeholder: ({ text }: {
     text?: string;
-};
-export declare const Placeholder: ({ text, }: PlaceholderProps) => import("react/jsx-runtime").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/types/components/next/Placeholder/index.d.ts

@@ -1,2 +1 @@
 export { Placeholder } from './Placeholder';
-export type { PlaceholderProps } from './Placeholder';

package/dist/types/components/next/Radio/Radio.d.ts

@@ -0,0 +1,3 @@
+export declare const Radio: import("react").ForwardRefExoticComponent<{
+    label?: import("react").ReactNode;
+} & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "type"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/next/Radio/Radio.figma.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/next/Radio/Radio.types.d.ts

@@ -0,0 +1,5 @@
+import type { InputHTMLAttributes, ReactNode } from 'react';
+export type RadioProps = {
+    /** Label for the radio button */
+    label?: ReactNode;
+} & Omit<InputHTMLAttributes<HTMLInputElement>, 'type'>;

package/dist/types/components/next/Radio/index.d.ts

@@ -0,0 +1,2 @@
+export { Radio } from './Radio';
+export type { RadioProps } from './Radio.types';

package/dist/types/components/next/Switch/Switch.d.ts

@@ -0,0 +1,3 @@
+export declare const Switch: import("react").ForwardRefExoticComponent<{
+    label: import("react").ReactNode;
+} & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "type"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/types/components/next/Switch/Switch.types.d.ts

@@ -0,0 +1,7 @@
+import type { InputHTMLAttributes, ReactNode } from 'react';
+export type SwitchProps = {
+    /**
+     * Visible label for the switch (required).
+     */
+    label: ReactNode;
+} & Omit<InputHTMLAttributes<HTMLInputElement>, 'type'>;

package/dist/types/components/next/Switch/index.d.ts

@@ -0,0 +1,2 @@
+export { Switch } from './Switch';
+export type { SwitchProps } from './Switch.types';

package/dist/types/components/next/TextField/TextField.d.ts

@@ -0,0 +1,17 @@
+import './text-field.css';
+export declare const TextField: import("react").ForwardRefExoticComponent<{
+    label?: import("react").ReactNode;
+    labelInfo?: import("react").ReactNode;
+    indicator?: string;
+    description?: import("react").ReactNode;
+    helperMessage?: import("react").ReactNode;
+    id?: string;
+} & {
+    invalid?: boolean;
+    startText?: string;
+    startAdornment?: import("react").ReactNode;
+    endText?: string;
+    endAdornment?: import("react").ReactNode;
+    as?: "input" | "textarea";
+    containerClassName?: string;
+} & import("react").InputHTMLAttributes<HTMLInputElement> & import("react").RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;

package/dist/types/components/next/TextField/TextField.types.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import type { InputProps } from '../Input/Input.types';
+export type TextFieldProps = {
+    /** Label for the field */
+    label?: ReactNode;
+    /** Info tooltip content shown next to the label */
+    labelInfo?: ReactNode;
+    /** Indicator text shown after label, e.g. "(Required)" or "(Optional)" */
+    indicator?: string;
+    /** Descriptive text that provides additional context for the field */
+    description?: ReactNode;
+    /** Helper or validation message shown below the input */
+    helperMessage?: ReactNode;
+    /** Unique identifier for the field */
+    id?: string;
+} & InputProps;

package/dist/types/components/next/TextField/index.d.ts

@@ -0,0 +1,2 @@
+export { TextField } from './TextField';
+export type { TextFieldProps } from './TextField.types';

package/dist/types/components/next/index.d.ts

@@ -1,4 +1,16 @@
-export { Placeholder } from './Placeholder';
-export type { PlaceholderProps } from './Placeholder';
+export { Button } from './Button';
 export { Icon } from './Icon';
+export { Field, useFieldIds } from './Field';
+export { Checkbox } from './Checkbox';
+export { Radio } from './Radio';
+export { Switch } from './Switch';
+export type { ButtonProps, ButtonVariant, ButtonSize, ButtonTone, } from './Button';
 export type { IconProps, IconSize, IconData, IconName } from './Icon';
+export type { CheckboxProps } from './Checkbox';
+export type { RadioProps } from './Radio';
+export type { SwitchProps } from './Switch';
+export type { FieldProps, FieldLabelProps, FieldDescriptionProps, FieldIds, HelperMessageProps, } from './Field';
+export { Input } from './Input';
+export type { InputProps } from './Input';
+export { TextField } from './TextField';
+export type { TextFieldProps } from './TextField';

package/dist/types/index.next.d.ts

@@ -6,6 +6,9 @@
  *
  * Install: npm install @equinor/eds-core-react@beta
  *
+ * CSS must be imported separately for SSR compatibility:
+ * import '@equinor/eds-core-react/next/index.css'
+ *
  * @packageDocumentation
  */
 export * from './components/next';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/eds-core-react",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "description": "The React implementation of the Equinor Design System",
   "sideEffects": [
     "**/*.css"
@@ -23,18 +23,14 @@
     "url": "https://github.com/equinor/design-system/issues"
   },
   "files": [
-    "dist/*"
+    "dist/*",
+    "build/*"
   ],
   "exports": {
     ".": {
       "types": "./dist/types/index.d.ts",
       "import": "./dist/esm/index.js",
       "require": "./dist/eds-core-react.cjs"
-    },
-    "./next": {
-      "types": "./dist/types/index.next.d.ts",
-      "import": "./dist/esm/index.next.js",
-      "require": "./dist/index.next.cjs"
     }
   },
   "keywords": [
@@ -102,8 +98,8 @@
     "downshift": "9.0.10",
     "react-aria": "^3.44.0",
     "@equinor/eds-icons": "^1.2.0",
-    "@equinor/eds-tokens": "^2.1.1",
-    "@equinor/eds-utils": "^2.0.0"
+    "@equinor/eds-utils": "^2.0.0",
+    "@equinor/eds-tokens": "^2.1.1"
   },
   "scripts": {
     "build": "rollup -c && tsc -p tsconfig.build.json",

package/dist/esm/components/next/Icon/icon.css.js

@@ -1,6 +0,0 @@
-import styleInject from '../../../node_modules/.pnpm/style-inject@0.3.0/node_modules/style-inject/dist/style-inject.es.js';
-
-var css_248z = "/* Inline with text: uses token from parent's data-font-size, or 1.5em fallback */\n.icon {\n  /*\n   * Set font-size first to establish the icon's size context.\n   * Then use 1em for width/height (relative to computed font-size).\n   * This avoids compound scaling (1.5em × 1.5em = 2.25em would be wrong).\n   */\n  font-size: var(--eds-typography-icon-size, 1.5em);\n  width: 1em;\n  height: 1em;\n\n  /* Negative margins for optical alignment with text baseline */\n  margin-block: -0.25em;\n  margin-inline: -0.1em;\n\n  flex-shrink: 0;\n}\n\n/* Explicit size: fixed size from design tokens, no margins */\n.icon[data-icon-size] {\n  --_explicit-size: var(--eds-sizing-icon-md); /* fallback */\n\n  width: var(--_explicit-size);\n  height: var(--_explicit-size);\n  margin: 0;\n  font-size: inherit;\n}\n\n.icon[data-icon-size='xs'] {\n  --_explicit-size: var(--eds-sizing-icon-xs);\n}\n.icon[data-icon-size='sm'] {\n  --_explicit-size: var(--eds-sizing-icon-sm);\n}\n.icon[data-icon-size='md'] {\n  --_explicit-size: var(--eds-sizing-icon-md);\n}\n.icon[data-icon-size='lg'] {\n  --_explicit-size: var(--eds-sizing-icon-lg);\n}\n.icon[data-icon-size='xl'] {\n  --_explicit-size: var(--eds-sizing-icon-xl);\n}\n.icon[data-icon-size='2xl'] {\n  --_explicit-size: var(--eds-sizing-icon-2xl);\n}\n.icon[data-icon-size='3xl'] {\n  --_explicit-size: var(--eds-sizing-icon-3xl);\n}\n.icon[data-icon-size='4xl'] {\n  --_explicit-size: var(--eds-sizing-icon-4xl);\n}\n.icon[data-icon-size='5xl'] {\n  --_explicit-size: var(--eds-sizing-icon-5xl);\n}\n.icon[data-icon-size='6xl'] {\n  --_explicit-size: var(--eds-sizing-icon-6xl);\n}\n";
-styleInject(css_248z);
-
-export { css_248z as default };

package/dist/esm/components/next/Placeholder/Placeholder.js

@@ -1,17 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-
-/**
- * Placeholder component for testing the /next entry point.
- * This component should be removed once real EDS 2.0 components are added.
- */
-
-const Placeholder = ({
-  text = 'EDS 2.0 Placeholder'
-}) => {
-  return /*#__PURE__*/jsx("div", {
-    "data-testid": "eds-placeholder",
-    children: text
-  });
-};
-
-export { Placeholder };

package/dist/esm/node_modules/.pnpm/style-inject@0.3.0/node_modules/style-inject/dist/style-inject.es.js

@@ -1,26 +0,0 @@
-function styleInject(css, ref) {
-  if (ref === void 0) ref = {};
-  var insertAt = ref.insertAt;
-  if (typeof document === 'undefined') {
-    return;
-  }
-  var head = document.head || document.getElementsByTagName('head')[0];
-  var style = document.createElement('style');
-  style.type = 'text/css';
-  if (insertAt === 'top') {
-    if (head.firstChild) {
-      head.insertBefore(style, head.firstChild);
-    } else {
-      head.appendChild(style);
-    }
-  } else {
-    head.appendChild(style);
-  }
-  if (style.styleSheet) {
-    style.styleSheet.cssText = css;
-  } else {
-    style.appendChild(document.createTextNode(css));
-  }
-}
-
-export { styleInject as default };