@norges-domstoler/dds-components 9.4.0 → 9.5.0

package/dist/assets/svg/openExternal.svg.js

@@ -0,0 +1,4 @@
+var img = "data:image/svg+xml,%3csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M19 19H5V5H12V3H5C4.46957 3 3.96086 3.21071 3.58579 3.58579C3.21071 3.96086 3 4.46957 3 5V19C3 19.5304 3.21071 20.0391 3.58579 20.4142C3.96086 20.7893 4.46957 21 5 21H19C20.1 21 21 20.1 21 19V12H19V19ZM14 3V5H17.59L7.76 14.83L9.17 16.24L19 6.41V10H21V3H14Z' fill='%230B0D0E'/%3e%3c/svg%3e";
+  var OpenExternalIcon = img;
+
+export { OpenExternalIcon as default };

package/dist/cjs/components/Grid/Grid.d.ts

@@ -1,10 +1,6 @@
 import { BaseComponentPropsWithChildren } from '../../types';
-import { StandardProperties } from 'csstype';
-import { ScreenSizeLiteral } from './Grid.utils';
+import { BreakpointBasedProps } from './Grid.utils';
 import { HTMLAttributes } from 'react';
-declare type BreakpointBasedProps<T extends keyof StandardProperties> = {
-    [k in ScreenSizeLiteral]?: StandardProperties[T];
-};
 declare type RowGapGrid = BreakpointBasedProps<'rowGap'>;
 declare type MaxWidthGrid = BreakpointBasedProps<'maxWidth'>;
 declare type BaseGridProps = {

package/dist/cjs/components/Grid/Grid.utils.d.ts

@@ -1,3 +1,7 @@
 import { ScreenSize } from '../../hooks';
+import { StandardProperties } from 'csstype';
 export declare type ScreenSizeLiteral = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export declare const getLiteralScreenSize: (screenSize: ScreenSize) => ScreenSizeLiteral;
+export declare type BreakpointBasedProps<T extends keyof StandardProperties> = {
+    [k in ScreenSizeLiteral]?: StandardProperties[T];
+};

package/dist/cjs/components/Grid/GridChild.d.ts

@@ -1,16 +1,11 @@
 import { Property } from 'csstype';
 import { BaseComponentPropsWithChildren } from '../../types';
+import { BreakpointBasedProps } from './Grid.utils';
 import { HTMLAttributes } from 'react';
 export declare const isRelativeGridColumn: (type: ColumnsOccupied | undefined) => type is RelativeColumnsOccupied;
 export declare const isGridColumn: (type: ColumnsOccupied | undefined) => type is GridColumnPerScreenSize;
 declare type RelativeColumnsOccupied = 'all' | 'firstHalf' | 'secondHalf';
-declare type GridColumnPerScreenSize = {
-    xs: Property.GridColumn;
-    sm: Property.GridColumn;
-    md: Property.GridColumn;
-    lg: Property.GridColumn;
-    xl: Property.GridColumn;
-};
+declare type GridColumnPerScreenSize = BreakpointBasedProps<'gridColumn'>;
 export declare type ColumnsOccupied = RelativeColumnsOccupied | GridColumnPerScreenSize;
 export declare type GridChildProps = BaseComponentPropsWithChildren<HTMLDivElement, {
     /**hvilke kolonner innholdet skal okkupere. Tar inn enten en string med relativ definisjon eller et objekt med egentilpassede `grid-column` CSS verdi definert for hver brekkepunkt. */

package/dist/cjs/components/InlineEdit/InlineEdit.stories.d.ts

@@ -1,6 +1,6 @@
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onFocus" | "onBlur" | "onChange" | "width"> & Pick<import("./InlineEdit.types").InlineEditProps, "onFocus" | "onBlur" | "onChange" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "width" | "error" | "errorMessage"> & import("react").RefAttributes<HTMLInputElement>>;
+    component: import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onFocus" | "onBlur" | "onChange" | "width"> & Pick<import("./InlineEdit.types").InlineEditProps, "onFocus" | "onBlur" | "onChange" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "width" | "error" | "errorMessage" | "hideIcon"> & import("react").RefAttributes<HTMLInputElement>>;
     argTypes: {
         emptiable: {
             control: {

package/dist/cjs/components/InlineEdit/InlineEdit.styles.d.ts

@@ -1,4 +1,14 @@
 import { Property } from 'csstype';
 export declare const defaultWidth: Property.Width;
-export declare const getInlineEditInputStyling: (isEditing?: boolean) => import("styled-components").FlattenSimpleInterpolation;
+declare type StyledInlineInputProps = {
+    isEditing?: boolean;
+    hideIcon?: boolean;
+};
+export declare const StyledInlineInput: import("styled-components").StyledComponent<"input", any, Pick<import("../../helpers").InputProps, "disabled" | "readOnly"> & {
+    hasErrorMessage: boolean;
+} & Pick<import("../../helpers").InputProps, "componentSize"> & StyledInlineInputProps, never>;
+export declare const StyledInlineTextArea: import("styled-components").StyledComponent<"input", any, Pick<import("../../helpers").InputProps, "disabled" | "readOnly"> & {
+    hasErrorMessage: boolean;
+} & Pick<import("../../helpers").InputProps, "componentSize"> & StyledInlineInputProps, never>;
 export declare const IconWrapper: import("styled-components").StyledComponent<"span", any, {}, never>;
+export {};

package/dist/cjs/components/InlineEdit/InlineEdit.tokens.d.ts

@@ -1,7 +1,6 @@
 export declare const inlineEditTokens: {
     inlineEdit: {
         padding: string;
-        paddingLeft: string;
         font: {
             lineHeight: any;
             fontSize: string;
@@ -11,6 +10,9 @@ export declare const inlineEditTokens: {
             fontStyle: any;
         };
         backgroundColor: string;
+        withIcon: {
+            paddingLeft: string;
+        };
         hover: {
             backgroundColor: string;
         };

package/dist/cjs/components/InlineEdit/InlineEdit.types.d.ts

@@ -7,6 +7,8 @@ export declare type BaseInlineInputProps = {
     errorMessage?: string;
     /** Bredde på komponenten. */
     width?: Property.Width;
+    /**Om redigeringsikonet skal vises. */
+    hideIcon?: boolean;
     /** **OBS!** settes automatisk av forelder. Spesifiserer om brukeren kan tømme inputfeltet. */
     emptiable?: boolean;
     /** **OBS!** settes automatisk av forelder. Spesifiserer om komponenten er i redigeringsmodus. */
@@ -28,6 +30,6 @@ export declare type InlineEditProps = {
     /**Ekstra callback ved `onBlur`-event. */
     onBlur?: () => void;
 } & Pick<InputHTMLAttributes<HTMLInputElement>, 'value'>;
-export declare type CommonInlineEditWrapperProps = Pick<InlineEditProps, 'onSetValue' | 'emptiable' | 'onBlur' | 'onFocus' | 'onChange'> & Pick<BaseInlineInputProps, 'error' | 'errorMessage' | 'width'>;
+export declare type CommonInlineEditWrapperProps = Pick<InlineEditProps, 'onSetValue' | 'emptiable' | 'onBlur' | 'onFocus' | 'onChange'> & Pick<BaseInlineInputProps, 'error' | 'errorMessage' | 'width' | 'hideIcon'>;
 export declare type InlineEditTextAreaProps = Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange' | 'onFocus' | 'onBlur'> & CommonInlineEditWrapperProps;
 export declare type InlineEditInputProps = Omit<InputHTMLAttributes<HTMLInputElement>, 'width' | 'onChange' | 'onFocus' | 'onBlur'> & CommonInlineEditWrapperProps;

package/dist/cjs/components/InlineEdit/InlineEditInput.d.ts

@@ -1 +1 @@
-export declare const InlineEditInput: import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "width" | "onChange" | "onFocus" | "onBlur"> & Pick<import("./InlineEdit.types").InlineEditProps, "onChange" | "onFocus" | "onBlur" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "width" | "error" | "errorMessage"> & import("react").RefAttributes<HTMLInputElement>>;
+export declare const InlineEditInput: import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "width" | "onChange" | "onFocus" | "onBlur"> & Pick<import("./InlineEdit.types").InlineEditProps, "onChange" | "onFocus" | "onBlur" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "width" | "error" | "errorMessage" | "hideIcon"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/cjs/components/InlineEdit/InlineEditInput.stories.d.ts

@@ -1,7 +1,7 @@
 import { InlineEditInputProps } from './InlineEdit.types';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onFocus" | "onBlur" | "onChange" | "width"> & Pick<import("./InlineEdit.types").InlineEditProps, "onFocus" | "onBlur" | "onChange" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "width" | "error" | "errorMessage"> & import("react").RefAttributes<HTMLInputElement>>;
+    component: import("react").ForwardRefExoticComponent<Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onFocus" | "onBlur" | "onChange" | "width"> & Pick<import("./InlineEdit.types").InlineEditProps, "onFocus" | "onBlur" | "onChange" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "width" | "error" | "errorMessage" | "hideIcon"> & import("react").RefAttributes<HTMLInputElement>>;
     argTypes: {
         emptiable: {
             control: {

package/dist/cjs/components/InlineEdit/InlineEditTextArea.d.ts

@@ -1 +1 @@
-export declare const InlineEditTextArea: import("react").ForwardRefExoticComponent<Omit<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "onFocus" | "onBlur"> & Pick<import("./InlineEdit.types").InlineEditProps, "onChange" | "onFocus" | "onBlur" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "error" | "errorMessage" | "width"> & import("react").RefAttributes<HTMLTextAreaElement>>;
+export declare const InlineEditTextArea: import("react").ForwardRefExoticComponent<Omit<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "onFocus" | "onBlur"> & Pick<import("./InlineEdit.types").InlineEditProps, "onChange" | "onFocus" | "onBlur" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "error" | "errorMessage" | "width" | "hideIcon"> & import("react").RefAttributes<HTMLTextAreaElement>>;

package/dist/cjs/components/InlineEdit/InlineEditTextArea.stories.d.ts

@@ -1,7 +1,7 @@
 import { InlineEditTextAreaProps } from './InlineEdit.types';
 declare const _default: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<Omit<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, "onFocus" | "onBlur" | "onChange"> & Pick<import("./InlineEdit.types").InlineEditProps, "onFocus" | "onBlur" | "onChange" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "width" | "error" | "errorMessage"> & import("react").RefAttributes<HTMLTextAreaElement>>;
+    component: import("react").ForwardRefExoticComponent<Omit<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, "onFocus" | "onBlur" | "onChange"> & Pick<import("./InlineEdit.types").InlineEditProps, "onFocus" | "onBlur" | "onChange" | "onSetValue" | "emptiable"> & Pick<import("./InlineEdit.types").BaseInlineInputProps, "width" | "error" | "errorMessage" | "hideIcon"> & import("react").RefAttributes<HTMLTextAreaElement>>;
     argTypes: {
         emptiable: {
             control: {

package/dist/cjs/components/Search/AutocompleteSearch.context.d.ts

@@ -0,0 +1,12 @@
+import { ChangeEvent, MouseEvent, RefObject } from 'react';
+export declare type AutocompleteSearchContextType = {
+    onValueChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    onSugggestionClick?: (e: MouseEvent<HTMLButtonElement>) => void;
+    suggestions?: string[];
+    showSuggestions?: boolean;
+    inputValue?: string;
+    inputRef?: RefObject<HTMLInputElement> | null;
+    suggestionsRef?: RefObject<HTMLDivElement> | null;
+};
+export declare const AutocompleteSearchContext: import("react").Context<AutocompleteSearchContextType>;
+export declare const useAutocompleteSearch: () => AutocompleteSearchContextType;

package/dist/cjs/components/Search/Search.stories.d.ts

@@ -1,4 +1,4 @@
-import { SearchProps } from './Search';
+import { SearchProps } from '.';
 declare const _default: {
     title: string;
     component: import("react").ForwardRefExoticComponent<Pick<import("../../helpers").InputProps, "label" | "tip"> & {
@@ -8,7 +8,18 @@ declare const _default: {
             label?: string | undefined;
             loading?: boolean | undefined;
         } & import("react").ButtonHTMLAttributes<HTMLButtonElement>) | undefined;
-    } & import("react").InputHTMLAttributes<HTMLInputElement> & import("react").RefAttributes<HTMLInputElement>>;
+    } & import("react").InputHTMLAttributes<HTMLInputElement> & import("react").RefAttributes<HTMLInputElement>> & {
+        AutocompleteWrapper: (props: import("./SearchAutocompleteWrapper").SearchAutocompleteWrapperProps) => JSX.Element;
+        Suggestions: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "id" | "className"> & Pick<SearchProps, "componentSize"> & {
+            suggestions?: string[] | undefined;
+            showSuggestions?: boolean | undefined;
+            onSuggestionClick?: ((e: import("react").MouseEvent<HTMLButtonElement, MouseEvent>) => void) | undefined;
+            maxSuggestions?: number | undefined;
+            searchId: string;
+        } & {
+            htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+        } & import("react").RefAttributes<HTMLDivElement>>;
+    };
     argTypes: {
         tip: {
             control: {
@@ -30,5 +41,7 @@ declare const _default: {
 export default _default;
 export declare const Overview: (args: SearchProps) => JSX.Element;
 export declare const OverviewSizes: (args: SearchProps) => JSX.Element;
+export declare const OverviewWithSuggestions: (args: SearchProps) => JSX.Element;
 export declare const Default: (args: SearchProps) => JSX.Element;
 export declare const WithButton: (args: SearchProps) => JSX.Element;
+export declare const WithSuggestions: (args: SearchProps) => JSX.Element;

package/dist/cjs/components/Search/Search.tokens.d.ts

@@ -48,4 +48,12 @@ export declare const searchTokens: {
     outerContainer: {
         gap: string;
     };
+    suggestionsContainer: {
+        marginTop: string;
+        border: string;
+        boxShadow: string;
+    };
+    suggestionsHeader: {
+        paddingLeft: string;
+    };
 };

package/dist/cjs/components/Search/SearchAutocompleteWrapper.d.ts

@@ -0,0 +1,31 @@
+import { ChangeEvent, ReactNode } from 'react';
+declare type WeightedValue = {
+    text: string;
+    relevance: number;
+};
+export declare type WeightedSearchData = {
+    array: WeightedValue[];
+    sortFunction?: (a: WeightedValue, b: WeightedValue) => number;
+};
+export declare type SearchData = {
+    array: string[];
+    sortFunction?: (a: string, b: string) => number;
+};
+export declare type SearchAutocompleteWrapperProps = {
+    /**Array med data som kan søkes på og eventuelt tilhørende sorteringsfunksjon. Array kan bestå av elementer av typen `string`  eller objekter med vekt og tekst.*/
+    data?: SearchData | WeightedSearchData;
+    /** Ekstra callback ved `onChange` i `<Search>`. */
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => void;
+    /**Callback når et forslag blir valgt, inkludert søkefunksjon. */
+    onSuggestionSelection?: () => void;
+    /** Custom filter for forslag. */
+    filter?: (sugestion: string, query: string) => boolean;
+    /**Minst lengde på query når forslag skal vises. */
+    queryLength?: number;
+    /** Barnet til komponenten (`<Search />`). */
+    children?: ReactNode;
+    /**Initielle `value` i `<Search>`. */
+    value?: string;
+};
+export declare const SearchAutocompleteWrapper: (props: SearchAutocompleteWrapperProps) => JSX.Element;
+export {};

package/dist/cjs/components/Search/SearchSuggestions.d.ts

@@ -0,0 +1,29 @@
+import { SearchProps } from './Search';
+import { BaseComponentProps } from '../../types';
+import { MouseEvent } from 'react';
+export declare type SearchSuggestionsProps = BaseComponentProps<HTMLDivElement, Pick<SearchProps, 'componentSize'> & {
+    /**Forslag som vises i listen. */
+    suggestions?: string[];
+    /** Om listen skal vises. */
+    showSuggestions?: boolean;
+    /**Callback når et forslag blir valgt, inkludert søkefunksjon. */
+    onSuggestionClick?: (e: MouseEvent<HTMLButtonElement>) => void;
+    /** Maks antall forslag vist i listen. */
+    maxSuggestions?: number;
+    /**Id til `<Search>`. */
+    searchId: string;
+}>;
+export declare const SearchSuggestions: import("react").ForwardRefExoticComponent<Pick<import("react").HTMLAttributes<HTMLDivElement>, "className" | "id"> & Pick<SearchProps, "componentSize"> & {
+    /**Forslag som vises i listen. */
+    suggestions?: string[] | undefined;
+    /** Om listen skal vises. */
+    showSuggestions?: boolean | undefined;
+    /**Callback når et forslag blir valgt, inkludert søkefunksjon. */
+    onSuggestionClick?: ((e: MouseEvent<HTMLButtonElement>) => void) | undefined;
+    /** Maks antall forslag vist i listen. */
+    maxSuggestions?: number | undefined;
+    /**Id til `<Search>`. */
+    searchId: string;
+} & {
+    htmlProps?: import("react").HTMLAttributes<HTMLDivElement> | undefined;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/cjs/components/Search/index.d.ts

@@ -1 +1,10 @@
-export * from './Search';
+import { Search as BaseSearch, SearchProps, SearchSize } from './Search';
+import { SearchAutocompleteWrapper, SearchAutocompleteWrapperProps, SearchData, WeightedSearchData } from './SearchAutocompleteWrapper';
+import { SearchSuggestions, SearchSuggestionsProps } from './SearchSuggestions';
+declare type SearchCompoundProps = typeof BaseSearch & {
+    AutocompleteWrapper: typeof SearchAutocompleteWrapper;
+    Suggestions: typeof SearchSuggestions;
+};
+declare const Search: SearchCompoundProps;
+export { Search };
+export type { SearchProps, SearchSize, SearchData, WeightedSearchData, SearchAutocompleteWrapperProps, SearchSuggestionsProps, };

package/dist/cjs/components/Select/Select.d.ts

@@ -9,13 +9,10 @@ export declare type SelectOption<TValue = unknown> = {
     value: TValue;
 };
 export declare const createSelectOptions: <TValue extends string | number>(...args: TValue[]) => SelectOption<TValue>[];
-export declare function searchFilter(text: string, search: string): boolean;
 declare type WrappedReactSelectProps<TOption extends Record<string, unknown>, IsMulti extends boolean, Group extends GroupBase<TOption>> = WithRequiredIf<TOption extends SelectOption ? false : true, ReactSelectProps<TOption, IsMulti, Group>, 'getOptionLabel' | 'getOptionValue'>;
 export declare type SelectProps<TOption extends Record<string, unknown>, IsMulti extends boolean> = {
     /**Ledetekst for nedtrekkslisten. */
     label?: string;
-    /**Gir required styling. **OBS!** støtter ikke DOM `required` attributt.   */
-    required?: boolean;
     /**Størrelsen på komponenten. */
     componentSize?: InputSize;
     /**Ikonet som vises i komponenten. */

package/dist/cjs/components/Select/Select.tokens.d.ts

@@ -104,15 +104,8 @@ export declare const selectTokens: {
         };
     };
     multiValue: {
-        base: {
-            borderRadius: string;
-        };
-        enabled: {
-            backgroundColor: string;
-        };
-        disabled: {
-            backgroundColor: string;
-        };
+        borderRadius: string;
+        backgroundColor: string;
     };
     multiValueLabel: {
         padding: string;

package/dist/cjs/components/Typography/Typography.tokens.d.ts

@@ -3,7 +3,6 @@ export declare const typographyTokens: {
         a: {
             base: {
                 color: string;
-                gap: string;
             };
             margins: {
                 marginTop: number;
@@ -12,6 +11,10 @@ export declare const typographyTokens: {
             hover: {
                 color: string;
             };
+            icon: {
+                marginTop: string;
+                marginLeft: string;
+            };
         };
         headingSans01: {
             base: {

package/dist/cjs/icons/tsx/barChart.d.ts

@@ -0,0 +1,2 @@
+import { SvgProps } from '../utils/propTypes';
+export declare function BarChartIcon(props: SvgProps): JSX.Element;

package/dist/cjs/icons/tsx/barChartBoxed.d.ts

@@ -0,0 +1,2 @@
+import { SvgProps } from '../utils/propTypes';
+export declare function BarChartBoxedIcon(props: SvgProps): JSX.Element;

package/dist/cjs/icons/tsx/index.d.ts

@@ -126,3 +126,9 @@ export * from './visibilityOn';
 export * from './warning';
 export * from './zoomIn';
 export * from './zoomOut';
+export * from './barChart';
+export * from './barChartBoxed';
+export * from './lineChart';
+export * from './trendingUp';
+export * from './trendingDown';
+export * from './libraryAdd';

package/dist/cjs/icons/tsx/libraryAdd.d.ts

@@ -0,0 +1,2 @@
+import { SvgProps } from '../utils/propTypes';
+export declare function LibraryAddIcon(props: SvgProps): JSX.Element;

package/dist/cjs/icons/tsx/lineChart.d.ts

@@ -0,0 +1,2 @@
+import { SvgProps } from '../utils/propTypes';
+export declare function LineChartIcon(props: SvgProps): JSX.Element;

package/dist/cjs/icons/tsx/trendingDown.d.ts

@@ -0,0 +1,2 @@
+import { SvgProps } from '../utils';
+export declare function TrendingDownIcon(props: SvgProps): JSX.Element;

package/dist/cjs/icons/tsx/trendingUp.d.ts

@@ -0,0 +1,2 @@
+import { SvgProps } from '../utils';
+export declare function TrendingUpIcon(props: SvgProps): JSX.Element;

package/dist/cjs/icons/utils/StyledSvg.d.ts

@@ -1 +1,4 @@
-export declare const StyledSvg: import("styled-components").StyledComponent<"svg", any, {}, never>;
+import { SVGAttributes } from 'react';
+declare type StyledSvgProps = SVGAttributes<SVGSVGElement>;
+export declare const StyledSvg: import("styled-components").StyledComponent<"svg", any, StyledSvgProps, never>;
+export {};

package/dist/cjs/icons/utils/SvgWrapper.d.ts

@@ -0,0 +1,2 @@
+import { SvgProps } from './propTypes';
+export declare function SvgWrapper(props: SvgProps): JSX.Element;