@equinor/echo-components 0.1.17 → 0.2.2

package/README.md

@@ -59,3 +59,5 @@ Run:
 ```sh-session
 npm run storybook
 ```
+
+Online storybook: https://equinor.github.io/EchoComponents/

package/dist/components/datePicker/PopupHeader.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+export interface PopupHeaderProps {
+    monthDate: Date;
+    date: Date;
+    changeYear: (year: number) => void;
+    changeMonth: (month: number) => void;
+    customHeaderCount: number;
+    decreaseMonth: VoidFunction;
+    increaseMonth: VoidFunction;
+    prevMonthButtonDisabled: boolean;
+    nextMonthButtonDisabled: boolean;
+    decreaseYear: VoidFunction;
+    increaseYear: VoidFunction;
+    prevYearButtonDisabled: boolean;
+    nextYearButtonDisabled: boolean;
+    changeDate?: (date: Date) => void;
+}
+declare const PopupHeader: React.FC<PopupHeaderProps>;
+export default PopupHeader;

package/dist/components/datePicker/ReactDatePicker.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import 'react-datepicker/dist/react-datepicker.css';
+import './reactDatePicker.css';
+export interface DatePickerProps {
+    id: string;
+    value: Date | undefined | null;
+    label: string;
+    onChanged(date: Date | null): void;
+    disableFuture?: boolean;
+    disableBeforeDate?: Date;
+    className?: string;
+    popperPlacement?: 'auto-start' | 'auto' | 'auto-end' | 'top-start' | 'top' | 'top-end' | 'right-start' | 'right' | 'right-end' | 'bottom-end' | 'bottom' | 'bottom-start' | 'left-end' | 'left' | 'left-start';
+    showTimeSelect?: boolean;
+}
+export declare const ReactDatePicker: React.FC<DatePickerProps>;
+export default ReactDatePicker;

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

@@ -0,0 +1,7 @@
+import React from 'react';
+export declare type BodyProps = {
+    children?: React.ReactNode;
+    className?: string;
+    bodyText?: string;
+};
+export declare const Body: ({ bodyText, children, className }: Partial<BodyProps>) => JSX.Element;

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

@@ -0,0 +1,8 @@
+import React from 'react';
+export declare type DateSectionProps = {
+    date?: Date | null;
+    dateSectionText?: string;
+    children?: React.ReactNode;
+    className?: string;
+};
+export declare const DateSection: ({ dateSectionText, date, children, className }: Partial<DateSectionProps>) => JSX.Element;

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

@@ -0,0 +1,7 @@
+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

@@ -0,0 +1,8 @@
+import React from 'react';
+import { CardIcons } from './Title';
+export declare 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

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export interface CardIcons {
+    name: string;
+    color: string;
+    onClick?: () => void;
+}
+export declare 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

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

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/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/helpers/getIcon.d.ts

@@ -1,21 +1,2 @@
 /// <reference types="react" />
-/**
- * Method that returns the relevant Icon for the iconType 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'
- *         | string)} iconType The type of icon you want returned
- * @return {*}  {JSX.Element} Relevant icon for the provided iconType
- */
-export declare function getIcon(iconType: 'electrical' | 'main equipment' | 'line' | 'manual valve' | 'circuit/starter' | 'instrument' | 'cable' | 'function' | 'signal' | 'telecom' | 'junction box' | 'administrative' | string): JSX.Element;
+export declare function getIcon(tagCategoryDescription: string): JSX.Element;

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/index.d.ts

@@ -1,15 +1,19 @@
 export { ButtonWithPopover } from './components/buttonWithPopover/ButtonWithPopover';
 export { ContextMenu } from './components/contextMenu/ContextMenu';
 export { DataInfoButton } from './components/contextMenuPopover/DataInfoButton';
+export { ReactDatePicker } from './components/datePicker/ReactDatePicker';
 export { DialogGenerator } from './components/dialogGenerator/DialogGenerator';
 export { Dropdown } from './components/dropdown/Dropdown';
+export { EchoCard } from './components/echoCard/index';
 export { EchoHeader } from './components/echoHeader/EchoHeader';
 export { InlineTagIconLink } from './components/inlineTagIconLink/InlineTagIconLink';
 export { ListRow } from './components/listRow/ListRow';
 export { TagContextMenu } from './components/tagContextMenu/TagContextMenu';
+export { TimePicker } from './components/timePicker/TimePicker';
 export { DraggableItemsWrapper } from './elements/draggableItemsWrapper/DraggableItemsWrapper';
 export { Icon } from './elements/icon/Icon';
 export { RadioButtonGroup } from './elements/radioButtonGroup/RadioButtonGroup';
+export * from './elements/roundIconButton/RoundIconButton';
 export { SliderField } from './elements/sliderField/SliderField';
 export { TagIcon } from './elements/tagIcon/TagIcon';
 export { TagIconShadowWrapper } from './elements/tagIcon/TagIconShadow';