@equinor/echo-components 0.6.0-r18-rc0 → 0.6.2

package/dist/components/echoCard/EchoCard.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
-export interface EchoCardProps {
-    children: React.ReactNode;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export declare const EchoCard: React.FC<EchoCardProps>;
+import React from 'react';
+export interface EchoCardProps {
+    children: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare const EchoCard: React.FC<EchoCardProps>;

package/dist/components/echoCard/LinkSection.d.ts

@@ -1,8 +1,8 @@
-import React from 'react';
-import { CardIcons } from './Title';
-export type LinkSectionProps = {
-    children?: React.ReactNode;
-    linkSectionIcons?: CardIcons[];
-    className?: string;
-};
-export declare const LinkSection: ({ children, className, linkSectionIcons }: Partial<LinkSectionProps>) => JSX.Element;
+import React from 'react';
+import { CardIcons } from './Title';
+export type LinkSectionProps = {
+    children?: React.ReactNode;
+    linkSectionIcons?: CardIcons[];
+    className?: string;
+};
+export declare const LinkSection: ({ children, className, linkSectionIcons }: Partial<LinkSectionProps>) => JSX.Element;

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

@@ -1,12 +1,13 @@
-export interface CardIcons {
-    name: string;
-    color: string;
-    onClick?: () => void;
-}
-export type TitleProps = {
-    headerTitle?: string;
-    onHeaderClick?: () => void;
-    headerIcons?: CardIcons[];
-    className?: string;
-};
-export declare const Title: ({ headerTitle, headerIcons, className, onHeaderClick }: Partial<TitleProps>) => JSX.Element;
+/// <reference types="react" />
+export interface CardIcons {
+    name: string;
+    color: string;
+    onClick?: () => void;
+}
+export type TitleProps = {
+    headerTitle?: string;
+    onHeaderClick?: () => void;
+    headerIcons?: CardIcons[];
+    className?: string;
+};
+export declare const Title: ({ headerTitle, headerIcons, className, onHeaderClick }: Partial<TitleProps>) => JSX.Element;

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

@@ -1,14 +1,14 @@
-import { Body, BodyProps } from './Body';
-import { DateSection, DateSectionProps } from './DateSection';
-import { EchoCard as BaseEchoCard, EchoCardProps } from './EchoCard';
-import { LinkSection } from './LinkSection';
-import { Title, TitleProps } from './Title';
-type CardType = typeof BaseEchoCard & {
-    Title: typeof Title;
-    Body: typeof Body;
-    LinkSection: typeof LinkSection;
-    DateSection: typeof DateSection;
-};
-declare const EchoCard: CardType;
-export { EchoCard };
-export type { EchoCardProps, TitleProps, DateSectionProps, BodyProps };
+import { Body, BodyProps } from './Body';
+import { DateSection, DateSectionProps } from './DateSection';
+import { EchoCard as BaseEchoCard, EchoCardProps } from './EchoCard';
+import { LinkSection } from './LinkSection';
+import { Title, TitleProps } from './Title';
+type CardType = typeof BaseEchoCard & {
+    Title: typeof Title;
+    Body: typeof Body;
+    LinkSection: typeof LinkSection;
+    DateSection: typeof DateSection;
+};
+declare const EchoCard: CardType;
+export { EchoCard };
+export type { EchoCardProps, TitleProps, DateSectionProps, BodyProps };

package/dist/components/echoHeader/EchoHeader.d.ts

@@ -1,20 +1,20 @@
-import React from 'react';
-export interface EchoHeaderProps {
-    moduleTitle: string;
-    moduleIcon: string | React.FC;
-    plantName?: string;
-    customHeaderSection?: React.FC;
-}
-/**
- * Component that renders the Echo header
- *
- * @param {EchoHeaderProps} {
- *    moduleTitle: the title of the module
- *    moduleIcon: the module Icon
- *    plantName: show the plant name next to the module title
- *    customSection: a section in the header where there can be custom components
- * }
- * @returns {*} {JSX.Element} Echo header with custom section
- */
-export declare const EchoHeader: React.FC<EchoHeaderProps>;
-export default EchoHeader;
+import React from 'react';
+export interface EchoHeaderProps {
+    moduleTitle: string;
+    moduleIcon: string | React.FC;
+    plantName?: string;
+    customHeaderSection?: React.FC;
+}
+/**
+ * Component that renders the Echo header
+ *
+ * @param {EchoHeaderProps} {
+ *    moduleTitle: the title of the module
+ *    moduleIcon: the module Icon
+ *    plantName: show the plant name next to the module title
+ *    customSection: a section in the header where there can be custom components
+ * }
+ * @returns {*} {JSX.Element} Echo header with custom section
+ */
+export declare const EchoHeader: React.FC<EchoHeaderProps>;
+export default EchoHeader;

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

@@ -1,10 +1,10 @@
-import React, { ReactNode } from 'react';
-import { TooltipOptions } from './useTooltip';
-declare function Tooltip({ children, ...options }: {
-    children: ReactNode;
-} & TooltipOptions): JSX.Element;
-declare const TooltipAnchor: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLElement> & {
-    asChild?: boolean | undefined;
-}, "ref"> & React.RefAttributes<HTMLElement>>;
-declare const TooltipContent: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export { Tooltip, TooltipAnchor, TooltipContent };
+import React, { ReactNode } from 'react';
+import { TooltipOptions } from './useTooltip';
+declare function Tooltip({ children, ...options }: {
+    children: ReactNode;
+} & TooltipOptions): JSX.Element;
+declare const TooltipAnchor: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLElement> & {
+    asChild?: boolean | undefined;
+}, "ref"> & React.RefAttributes<HTMLElement>>;
+declare const TooltipContent: React.ForwardRefExoticComponent<Omit<React.HTMLProps<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Tooltip, TooltipAnchor, TooltipContent };

package/dist/components/echoTooltip/Tooltip/useTooltip.d.ts

@@ -1,51 +1,85 @@
-/// <reference types="react" />
-import { Placement } from '@floating-ui/react';
-export interface TooltipOptions {
-    initialOpen?: boolean;
-    placement?: Placement;
-    open?: boolean;
-    onOpenChange?: (open: boolean) => void;
-}
-export type ContextType = ReturnType<typeof useTooltip> | null;
-declare function useTooltip({ initialOpen, placement, open: controlledOpen, onOpenChange: setControlledOpen }?: TooltipOptions): {
-    placement: Placement;
-    strategy: import("@floating-ui/react").Strategy;
-    middlewareData: import("@floating-ui/react").MiddlewareData;
-    x: number | null;
-    y: number | null;
-    update: () => void;
-    reference: (node: import("@floating-ui/react").ReferenceType | null) => void;
-    floating: (node: HTMLElement | null) => void;
-    positionReference: (node: import("@floating-ui/react").ReferenceType | null) => void;
-    context: import("@floating-ui/react").FloatingContext<import("@floating-ui/react").ReferenceType>;
-    refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
-    elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
-    isPositioned: boolean;
-    getReferenceProps: (userProps?: import("react").HTMLProps<Element> | undefined) => Record<string, unknown>;
-    getFloatingProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
-    getItemProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
-    open: boolean;
-    setOpen: (open: boolean) => void;
-};
-declare const TooltipContext: import("react").Context<ContextType>;
-declare const useTooltipContext: () => {
-    placement: Placement;
-    strategy: import("@floating-ui/react").Strategy;
-    middlewareData: import("@floating-ui/react").MiddlewareData;
-    x: number | null;
-    y: number | null;
-    update: () => void;
-    reference: (node: import("@floating-ui/react").ReferenceType | null) => void;
-    floating: (node: HTMLElement | null) => void;
-    positionReference: (node: import("@floating-ui/react").ReferenceType | null) => void;
-    context: import("@floating-ui/react").FloatingContext<import("@floating-ui/react").ReferenceType>;
-    refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
-    elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
-    isPositioned: boolean;
-    getReferenceProps: (userProps?: import("react").HTMLProps<Element> | undefined) => Record<string, unknown>;
-    getFloatingProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
-    getItemProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
-    open: boolean;
-    setOpen: (open: boolean) => void;
-};
-export { TooltipContext, useTooltip, useTooltipContext };
+/// <reference types="react" />
+import { Placement } from '@floating-ui/react';
+export interface TooltipOptions {
+    initialOpen?: boolean;
+    placement?: Placement;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+export type ContextType = ReturnType<typeof useTooltip> | null;
+declare function useTooltip({ initialOpen, placement, open: controlledOpen, onOpenChange: setControlledOpen }?: TooltipOptions): {
+    placement: Placement;
+    strategy: import("@floating-ui/react").Strategy;
+    middlewareData: import("@floating-ui/react").MiddlewareData;
+    x: number | null;
+    y: number | null;
+    update: () => void;
+    reference: (node: import("@floating-ui/react").ReferenceType | null) => void;
+    floating: (node: HTMLElement | null) => void;
+    positionReference: (node: import("@floating-ui/react").ReferenceType | null) => void;
+    context: {
+        x: number | null;
+        y: number | null;
+        update: () => void;
+        placement: Placement;
+        strategy: import("@floating-ui/react").Strategy;
+        middlewareData: import("@floating-ui/react").MiddlewareData;
+        reference: (node: import("@floating-ui/react").ReferenceType | null) => void;
+        floating: (node: HTMLElement | null) => void;
+        isPositioned: boolean;
+        open: boolean;
+        onOpenChange: (open: boolean) => void;
+        events: import("@floating-ui/react").FloatingEvents;
+        dataRef: import("react").MutableRefObject<import("@floating-ui/react").ContextData>;
+        nodeId: string | undefined;
+        refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
+        elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
+    };
+    refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
+    elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
+    isPositioned: boolean;
+    getReferenceProps: (userProps?: import("react").HTMLProps<Element> | undefined) => Record<string, unknown>;
+    getFloatingProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
+    getItemProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
+    open: boolean;
+    setOpen: (open: boolean) => void;
+};
+declare const TooltipContext: import("react").Context<ContextType>;
+declare const useTooltipContext: () => {
+    placement: Placement;
+    strategy: import("@floating-ui/react").Strategy;
+    middlewareData: import("@floating-ui/react").MiddlewareData;
+    x: number | null;
+    y: number | null;
+    update: () => void;
+    reference: (node: import("@floating-ui/react").ReferenceType | null) => void;
+    floating: (node: HTMLElement | null) => void;
+    positionReference: (node: import("@floating-ui/react").ReferenceType | null) => void;
+    context: {
+        x: number | null;
+        y: number | null;
+        update: () => void;
+        placement: Placement;
+        strategy: import("@floating-ui/react").Strategy;
+        middlewareData: import("@floating-ui/react").MiddlewareData;
+        reference: (node: import("@floating-ui/react").ReferenceType | null) => void;
+        floating: (node: HTMLElement | null) => void;
+        isPositioned: boolean;
+        open: boolean;
+        onOpenChange: (open: boolean) => void;
+        events: import("@floating-ui/react").FloatingEvents;
+        dataRef: import("react").MutableRefObject<import("@floating-ui/react").ContextData>;
+        nodeId: string | undefined;
+        refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
+        elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
+    };
+    refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
+    elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
+    isPositioned: boolean;
+    getReferenceProps: (userProps?: import("react").HTMLProps<Element> | undefined) => Record<string, unknown>;
+    getFloatingProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
+    getItemProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
+    open: boolean;
+    setOpen: (open: boolean) => void;
+};
+export { TooltipContext, useTooltip, useTooltipContext };

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

@@ -1,10 +1,10 @@
-/// <reference types="react" />
-import { Tooltip } from './Tooltip/Tooltip';
-declare const EchoTooltip: Readonly<{
-    Tooltip: typeof Tooltip;
-    TooltipAnchor: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLProps<HTMLElement> & {
-        asChild?: boolean | undefined;
-    }, "ref"> & import("react").RefAttributes<HTMLElement>>;
-    TooltipContent: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLProps<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-}>;
-export { EchoTooltip };
+/// <reference types="react" />
+import { Tooltip } from './Tooltip/Tooltip';
+declare const EchoTooltip: Readonly<{
+    Tooltip: typeof Tooltip;
+    TooltipAnchor: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLProps<HTMLElement> & {
+        asChild?: boolean | undefined;
+    }, "ref"> & import("react").RefAttributes<HTMLElement>>;
+    TooltipContent: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLProps<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+}>;
+export { EchoTooltip };

package/dist/components/floatingActionButton/FloatingActionButton.d.ts

@@ -1,33 +1,33 @@
-import React from 'react';
-interface WithLabel {
-    variant: 'square_icon_with_text';
-    label: string;
-}
-interface WithoutLabel {
-    variant: 'circle_icon' | 'square_icon';
-    label?: never;
-}
-type MutuallyExclusiveVariantLabel = WithLabel | WithoutLabel;
-export type FloatingActionButtonProps = MutuallyExclusiveVariantLabel & {
-    iconName: string;
-    ariaLabel?: string;
-    /**
-     * Disable button if true
-     */
-    disabled?: boolean;
-    /**
-     * Show button as active if true
-     */
-    active?: boolean;
-    /**
-     * The method to be called when button is pressed
-     */
-    onClick: () => void;
-};
-/**
- * Floating actions buttons exists within the viewport, seperated from any sheet, dialog or menu
- * and are typically used for special actions pertaining to the module they are used in.
- * @return {*}  {JSX.Element} Floating actions button
- */
-declare const FloatingActionButton: React.FC<FloatingActionButtonProps>;
-export { FloatingActionButton };
+import React from 'react';
+interface WithLabel {
+    variant: 'square_icon_with_text';
+    label: string;
+}
+interface WithoutLabel {
+    variant: 'circle_icon' | 'square_icon';
+    label?: never;
+}
+type MutuallyExclusiveVariantLabel = WithLabel | WithoutLabel;
+export type FloatingActionButtonProps = MutuallyExclusiveVariantLabel & {
+    iconName: string;
+    ariaLabel?: string;
+    /**
+     * Disable button if true
+     */
+    disabled?: boolean;
+    /**
+     * Show button as active if true
+     */
+    active?: boolean;
+    /**
+     * The method to be called when button is pressed
+     */
+    onClick: () => void;
+};
+/**
+ * Floating actions buttons exists within the viewport, seperated from any sheet, dialog or menu
+ * and are typically used for special actions pertaining to the module they are used in.
+ * @return {*}  {JSX.Element} Floating actions button
+ */
+declare const FloatingActionButton: React.FC<FloatingActionButtonProps>;
+export { FloatingActionButton };

package/dist/components/floatingSearchBar/FloatingSearchBar.d.ts

@@ -1,31 +1,44 @@
-import React from 'react';
-interface Suggestion {
-    label: string;
-    id: string;
-}
-export interface FloatingSearchBarProps {
-    ariaLabel?: string;
-    /**
-     * Placeholder text
-     */
-    placeholder?: string;
-    /**
-     * Callback for when the search query changes
-     */
-    onSearchQueryChange: (value: string) => void;
-    /**
-     * Array of suggestions that matches the search query
-     */
-    suggestions?: Suggestion[];
-    onSuggestionClick: (suggestion: Suggestion) => void;
-}
-/**
- * Floating search bar
- *
- * @param {FloatingSearchBarProps} {
- * }
- * @return {*}  {JSX.Element}
- */
-declare const FloatingSearchBar: React.FC<FloatingSearchBarProps>;
-export { FloatingSearchBar };
-export type { Suggestion };
+import React from 'react';
+interface Suggestion {
+    label: string;
+    id: string;
+    iconName: string;
+}
+interface SuggestionGroup {
+    title?: string;
+    id: string;
+    options: Suggestion[];
+}
+export interface FloatingSearchBarProps {
+    ariaLabel?: string;
+    /**
+     * Placeholder text
+     */
+    placeholder?: string;
+    /**
+     * Callback for when the search query changes
+     */
+    onSearchQueryChange: (value: string) => void;
+    /**
+     * Suggestions that matches the search query by groups
+     */
+    suggestionGroups?: SuggestionGroup[];
+    onSuggestionClick: (suggestion: Suggestion) => void;
+    isLoading: boolean;
+}
+/**
+ * Floating search bar
+ *
+ * @param {FloatingSearchBarProps} {
+ * }
+ * @return {*}  {JSX.Element}
+ */
+declare const FloatingSearchBar: React.FC<FloatingSearchBarProps>;
+interface SuggestionGroupProps {
+    suggestionGroup: SuggestionGroup;
+    onClick: (suggestion: Suggestion) => void;
+    focusedOption: number;
+}
+declare function SuggestionGroup({ suggestionGroup, onClick, focusedOption }: SuggestionGroupProps): JSX.Element;
+export { FloatingSearchBar };
+export type { Suggestion };

package/dist/components/index.d.ts

@@ -1,22 +1,25 @@
-export * from './buttonWithPopover/ButtonWithPopover';
-export * from './contextMenu/ContextMenu';
-export * from './contextMenuPopover/DataInfoButton';
-export * from './datePicker/ReactDatePicker';
-export * from './dialogGenerator/DialogGenerator';
-export * from './dropdown/Dropdown';
-export * from './echoBottomBar/EchoBottomBar';
-export * from './echoCard/index';
-export * from './echoHeader/EchoHeader';
-export * from './echoTooltip';
-export * from './floatingActionButton/FloatingActionButton';
-export * from './floatingSearchBar/FloatingSearchBar';
-export * from './inlineTagIconLink/InlineTagIconLink';
-export * from './listItem';
-export * from './listRow/ListRow';
-export * from './rightPanel';
-export * from './sidebarButton/SidebarButton';
-export * from './sidesheet';
-export * from './splitView';
-export * from './tagContextMenu/TagContextMenu';
-export * from './timePicker/TimePicker';
-export * from './workOrderListItem/WorkOrdertListItem';
+export * from './blackLink/BlackLink';
+export * from './buttonWithPopover/ButtonWithPopover';
+export * from './contextMenu/ContextMenu';
+export * from './contextMenuPopover/DataInfoButton';
+export * from './copyToClipboard/CopyToClipboard';
+export * from './datePicker/ReactDatePicker';
+export * from './dialogGenerator/DialogGenerator';
+export * from './dropdown/Dropdown';
+export * from './echoBottomBar/EchoBottomBar';
+export * from './echoCard/index';
+export * from './echoHeader/EchoHeader';
+export * from './echoTooltip';
+export * from './floatingActionButton/FloatingActionButton';
+export * from './floatingSearchBar/FloatingSearchBar';
+export * from './inlineTagIconLink/InlineTagIconLink';
+export * from './legend';
+export * from './listItem';
+export * from './listRow/ListRow';
+export * from './rightPanel';
+export * from './sidebarButton/SidebarButton';
+export * from './sidesheet';
+export * from './splitView';
+export * from './tagContextMenu/TagContextMenu';
+export * from './timePicker/TimePicker';
+export * from './workOrderListItem/WorkOrderListItem';

package/dist/components/inlineTagIconLink/InlineTagIconLink.d.ts

@@ -1,12 +1,12 @@
-import React from 'react';
-export interface InlineTagIconLinkProps {
-    onClickHandler?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
-    tagNo: string;
-    description: string;
-    tagCategoryDescription?: string;
-    icon?: string | React.ReactNode;
-    legendColor: string;
-    disableHover?: boolean;
-}
-export declare const InlineTagIconLink: React.FC<InlineTagIconLinkProps>;
-export default InlineTagIconLink;
+import React from 'react';
+export interface InlineTagIconLinkProps {
+    onClickHandler?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    tagNo: string;
+    description: string;
+    tagCategoryDescription?: string;
+    icon?: string | React.ReactNode;
+    legendColor: string;
+    disableHover?: boolean;
+}
+export declare const InlineTagIconLink: React.FC<InlineTagIconLinkProps>;
+export default InlineTagIconLink;

package/dist/components/legend/MainLegend.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { LayerInfo } from '@types';
+interface MainLegendProps {
+    /**
+     * Layer legends appearing above the main legend
+     */
+    legends: React.ReactNode[];
+    /**
+     * Layer information
+     */
+    layers: LayerInfo[];
+}
+declare function MainLegend({ legends, layers }: MainLegendProps): JSX.Element;
+export { MainLegend };

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

@@ -0,0 +1,2 @@
+export * from './MainLegend';
+export * from './layerLegend';

package/dist/components/legend/layerLegend/LayerLegend.d.ts

@@ -0,0 +1,29 @@
+import React from 'react';
+interface LayerLegendProps {
+    /**
+     * Layer title
+     */
+    title: string;
+    /**
+     * Layer icon name
+     */
+    iconName?: string;
+    /**
+     * Number of items on layer
+     */
+    itemsCount: number;
+    /**
+     * Name of the items presented on layer
+     */
+    itemsTitle?: string;
+    /**
+     * Content presented on layer legend
+     */
+    children: React.ReactNode;
+    /**
+     * Used to disable layer legend usage
+     */
+    disabled?: boolean;
+}
+declare function LayerLegend({ title, iconName, itemsCount, itemsTitle, children, disabled }: LayerLegendProps): JSX.Element;
+export { LayerLegend };

package/dist/components/legend/layerLegend/index.d.ts

@@ -0,0 +1 @@
+export * from './LayerLegend';