@equinor/echo-components 0.5.4 → 0.5.6

package/dist/components/tagContextMenu/TagContextMenu.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+interface TagContextMenuProps {
+    expanded: boolean;
+    setExpanded: (expanded: boolean) => void;
+    tagNo: string;
+    description: string;
+    openTagInformation: () => void;
+    selected: boolean;
+    selectedClassName?: string;
+    children: React.ReactNode;
+}
+/**
+ * Component that renders a tag context menu that can be expanded and closed upon click
+ * The condensed variant will only display the the relevant tag icon
+ * The expanded variant will display relevant tag icon, tag number and tag description
+ *
+ * @param {TagContextMenuProps} {
+ *     expanded: flag that state if the context menu should be expanded or not
+ *     setExpanded: method to update the expanded flag
+ *     tagNo: the tag no to display
+ *     description: the tag description
+ *     openTagInformation: method called when expanded context menu is called
+ *     selected: Flag to handle if there are multiple context menu's on a page, and a selected style should be applied
+ *     selectedClassName: styling used to handle multiple tag visible on the page at the same time, class will be added to tagIcon when context menu is not expanded
+ *     children: Meant to be used to pass TagIcon component to this component
+ * }
+ * @return {*}  {JSX.Element} a tag context menu for the provided properties
+ */
+export declare const TagContextMenu: React.FC<TagContextMenuProps>;
+export default TagContextMenu;

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

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface TimePickerProps {
+    id: string;
+    value?: string;
+    label: string;
+    onValueChanged?: (time: string) => void;
+    className?: string;
+    readOnly?: boolean;
+    timeRange?: string[];
+}
+export declare const TimePicker: React.FC<TimePickerProps>;
+export default TimePicker;

package/dist/elements/draggableItemsWrapper/DraggableItemsWrapper.d.ts

@@ -0,0 +1,18 @@
+import React, { CSSProperties } from 'react';
+import { DraggableItem } from '../../types/draggableItem';
+export interface DraggableItemsWrapperProps {
+    style?: CSSProperties;
+    onChange: (newDragItems: DraggableItem[], oldIndex: number | undefined, newIndex: number | undefined) => void;
+    children: React.ReactNode[];
+}
+/**
+ * Component that renders a wrapper for items that are draggable
+ *
+ * @param {DraggableItemsWrapperProps} {
+ *     style: style element to override wrapper style
+ *     onChange: method that will be called when elements have be reordered inside the wrapper
+ *     children: list of elements that can be reordered
+ * }
+ * @return {*}  {JSX.Element}
+ */
+export declare const DraggableItemsWrapper: React.FC<DraggableItemsWrapperProps>;

package/dist/elements/icon/Icon.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+export interface IconProps {
+    name: string;
+    color: string;
+    title?: string;
+    className?: string;
+    size?: 16 | 24 | 32 | 40 | 48;
+}
+/**
+ * Component that work's as a eds icon wrapper, it imports all eds possible icons
+ *
+ * @param {IconProps} {
+ *  name: The name of the icon to be displayed
+ *  title: The html title to use
+ *  color:The color to icon should have
+ *  size: The wanted size of the icon. Possible values are 16, 24, 32, 40 and 48
+ * }
+ * @return {*} {JSX.Element} A icon for the provided information
+ */
+export declare const Icon: React.FC<IconProps>;

package/dist/elements/index.d.ts

@@ -0,0 +1,8 @@
+export * from './draggableItemsWrapper/DraggableItemsWrapper';
+export { Icon } from './icon/Icon';
+export { RadioButtonGroup } from './radioButtonGroup/RadioButtonGroup';
+export * from './roundIconButton/RoundIconButton';
+export { SliderField } from './sliderField/SliderField';
+export { TagIcon } from './tagIcon/TagIcon';
+export { TagIconShadowWrapper } from './tagIcon/TagIconShadow';
+export * from './textIconButton/TextIconButton';

package/dist/elements/radioButtonGroup/RadioButtonGroup.d.ts

@@ -0,0 +1,20 @@
+import React, { CSSProperties } from 'react';
+import { RadioButtonItem } from '../../types/radioButtonItem';
+export interface RadioButtonGroupProps {
+    title: string;
+    options: RadioButtonItem[];
+    style?: CSSProperties;
+    onSelected: (index: number) => void;
+}
+/**
+ * Component that renders a Radio Button Group with a set of options to choose from
+ *
+ * @param {RadioButtonGroupProps} {
+ *     title: The title of the radio button group,
+ *     options: List of items to be displayed as options,
+ *     style: Style element to override wrapper style,
+ *     onSelected: Method to be called when the selected value is changed
+ * }
+ * @return {*}  {JSX.Element}
+ */
+export declare const RadioButtonGroup: React.FC<RadioButtonGroupProps>;

package/dist/elements/roundIconButton/RoundIconButton.d.ts

@@ -0,0 +1,13 @@
+import React, { EventHandler, ReactElement, SyntheticEvent } from 'react';
+export declare enum RoundIconButtonVariants {
+    OpenCloseButton = "openCloseButton",
+    ToggleButton = "toggleButton"
+}
+export interface RoundIconButtonProps {
+    label: string;
+    active?: boolean;
+    variant?: RoundIconButtonVariants;
+    children?: ReactElement;
+    onClick?: EventHandler<SyntheticEvent>;
+}
+export declare const RoundIconButton: React.FC<RoundIconButtonProps>;

package/dist/elements/sliderField/SliderField.d.ts

@@ -0,0 +1,25 @@
+import React, { CSSProperties } from 'react';
+export interface SliderFieldProps {
+    value: number;
+    min: number;
+    max: number;
+    labels?: string[];
+    title: string;
+    onChange: (value: number) => void;
+    style?: CSSProperties;
+}
+/**
+ * Component that renders a slider with numeric or custom values
+ *
+ * @param {SliderFieldProps} {
+ *     value: Current value of the slider,
+ *     min: Minimum value of the slider,
+ *     max: Maximum value of the slider,
+ *     labels: List of labels to use if the slider should not display numeric values,
+ *     title: Text shown as title of the slider,
+ *     onChange: Method that will be called if the slider value is changed,
+ *     style: style element to override wrapper style
+ * }
+ * @return {*}  {JSX.Element}
+ */
+export declare const SliderField: React.FC<SliderFieldProps>;

package/dist/elements/tagIcon/TagIcon.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+interface TagIconProps {
+    icon: JSX.Element;
+    legendColor: string;
+}
+/**
+ * Component that will wrap the provided icon with a background color (usually the legend color)
+ *
+ * @param {TagIconProps} {
+ *  icon: Icon to be wrapped
+ *  legendColor: background color to apply. Need to be valid css color
+ * }
+ * @return {*}  {JSX.Element} Wrapped icon with provided color
+ */
+export declare const TagIcon: React.FC<TagIconProps>;
+export default TagIcon;

package/dist/elements/tagIcon/TagIconShadow.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface TagIconShadowWrapperProps {
+    children: React.ReactNode;
+}
+/**
+ * Component that will wrap the provided child element in a shadow.
+ * Should be used to add shadow to the tagIcon component
+ *
+ * @param {TagIconShadowWrapperProps} { children } Child element to wrap
+ * @return {*} {JSX.Element} wrapped child element in a shadow
+ */
+export declare const TagIconShadowWrapper: React.FC<TagIconShadowWrapperProps>;
+export default TagIconShadowWrapper;

package/dist/elements/textIconButton/TextIconButton.d.ts

@@ -0,0 +1,19 @@
+import React, { CSSProperties } from 'react';
+export interface TextIconButtonProps {
+    icon: string | React.FC;
+    title: string;
+    onClick: () => void;
+    style?: CSSProperties;
+}
+/**
+ * Component that renders a button with the icon and the text provided
+ *
+ * @param {TextIconButtonProps} {
+ *     icon: the name of the icon to display
+ *     title: the title text that the button should display
+ *     onClick: the function that will be called when user clicks the button
+ *     style: Optional parameter that will override the button style
+ * }
+ * @return {*}  {JSX.Element} A button with the provided icon and text
+ */
+export declare const TextIconButton: React.FC<TextIconButtonProps>;

package/dist/helpers/classnames.d.ts

@@ -0,0 +1,5 @@
+declare type ClassNameDynamic = {
+    [key: string]: boolean;
+};
+export declare function classnames(...parts: (string | ClassNameDynamic | undefined | boolean)[]): string | undefined;
+export {};

package/dist/helpers/getIcon.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function getIcon(tagCategoryDescription: string): JSX.Element;

package/dist/helpers/index.d.ts

@@ -0,0 +1,3 @@
+export * from './classnames';
+export * from './getIcon';
+export * from './tagCategoryIcon';

package/dist/helpers/tagCategoryIcon.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+interface ViewTagIconProps {
+    tagCategoryDescription: string;
+}
+export declare enum TagCategoryType {
+    Electrical = "electrical",
+    MainEquipment = "main equipment",
+    Line = "line",
+    ManualValve = "manual valve",
+    CircuitAndStarter = "circuit",
+    Instrument = "instrument",
+    Cable = "cable",
+    Function = "function",
+    Signal = "signal",
+    Telecom = "telecom",
+    JunctionBox = "junction box",
+    Administrative = "administrative"
+}
+/**
+ * Method that returns the relevant Icon for the tagCategoryDescription provided
+ * Tag icon is the default JSX.Element Icon returned
+ * @export
+ * @param {('electrical'
+ *         | 'main equipment'
+ *         | 'line'
+ *         | 'manual valve'
+ *         | 'circuit/starter'
+ *         | 'instrument'
+ *         | 'cable'
+ *         | 'function'
+ *         | 'signal'
+ *         | 'telecom'
+ *         | 'junction box'
+ *         | 'administrative'
+ * @return {*}  {JSX.Element} Relevant icon for the provided tagCategoryDescription
+ */
+export declare const TagCategoryIcon: React.FC<ViewTagIconProps>;
+export default TagCategoryIcon;

package/dist/icons/echoAssets/data.d.ts

@@ -0,0 +1,3 @@
+import { IconData } from '@equinor/eds-icons';
+export declare const sap_notifications: IconData;
+export declare const sap_workorders: IconData;

package/dist/icons/echoAssets/external.d.ts

@@ -0,0 +1,3 @@
+import { IconData } from '@equinor/eds-icons';
+export declare const timp: IconData;
+export declare const timp_text: IconData;

package/dist/icons/echoAssets/index.d.ts

@@ -0,0 +1,5 @@
+import { IconData } from '@equinor/eds-icons';
+export declare const sheet_left: IconData;
+export declare const sheet_bottom: IconData;
+export * from './data';
+export * from './external';

package/dist/icons/index.d.ts

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

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+import './theme/theme.css';
+export * from './components';
+export * from './elements';
+export * from './helpers';
+export * from './icons';
+export * from './structure';
+export { themeConst } from './theme/themeConst';
+export * from './types';