@trackunit/react-components 0.0.100 → 0.0.103

package/components/Chart/Chart.d.ts

@@ -61,8 +61,11 @@ export interface ChartProps extends CommonProps {
 }
 /**
  * The Chart component is a wrapper component for ECharts.
+ *
  * Handles events and click functionality.
  *
+ * For more information see the [eCharts documentation](https://github.com/hustcc/echarts-for-react).
+ *
  * @param {ChartProps} props - The props for the Chart component
  * @returns {JSX.Element} Chart component
  */

package/components/CopyableText/CopyableText.d.ts

@@ -13,7 +13,7 @@ export interface CopyableTextProps extends CommonProps {
     alternativeText?: string;
 }
 /**
- * The CopyableText component is used where the user should have easy access to copy some information.
+ * The CopyableText component is used where the user should have easy access to copy information.
  *
  * @param {CopyableTextProps} props - The props for the CopyableText component
  * @returns {JSX.Element} CopyableText component

package/components/DateField/DateField.d.ts

@@ -1,30 +1,19 @@
 /// <reference types="react" />
-import { Matcher } from "react-day-picker";
-import { BaseInputProps } from "../BaseInput";
-export interface DateFieldProps extends Pick<BaseInputProps, "placeholder" | "id" | "dataTestId" | "onChange" | "readOnly"> {
+import { DateInputProps } from "../DateInput/DateInput";
+import { FormGroupProps } from "../FormGroup/FormGroup";
+declare type FormGroupExposedProps = Pick<FormGroupProps, "label" | "tip" | "helpText" | "helpAddon">;
+export interface DateFieldProps extends DateInputProps, FormGroupExposedProps {
     /**
-     * A text label to be displayed next to the indicator
+     * If a value is set, the field is rendered in its invalid state.
      */
-    label?: string;
-    /**
-     * A text to be displayed under the input with a short description of field purpose
-     */
-    description?: string;
-    /**
-     * A default value to be displayed by a input field
-     */
-    defaultValue?: string;
-    /**
-     * A flag that can be used to disable the input, default value is false
-     */
-    disabled?: boolean;
-    /**
-     * Specification of dates not allowed to be selected - i the form of react-day-picker matcher
-     */
-    disabledDays?: Matcher | Matcher[] | undefined;
-    /**
-     * A flag that can be set to true to disallow the user to deselect a date. (if false the user can click the selected date to deselect)
-     */
-    preventDeselect?: boolean;
+    errorMessage?: string;
 }
+/**
+ * The date field component is used for entering date values.
+ *
+ * _**Do use**_ the DateField for date input.
+ *
+ * _**Do not use**_ this fields for non-serialized dates. Use TextField instead.
+ */
 export declare const DateField: import("react").ForwardRefExoticComponent<DateFieldProps & import("react").RefAttributes<HTMLInputElement>>;
+export {};

package/components/DateInput/DateInput.d.ts

@@ -0,0 +1,29 @@
+/// <reference types="react" />
+import { Matcher } from "react-day-picker";
+import { BaseInputProps } from "../BaseInput";
+declare type BaseInputExposedProps = Omit<BaseInputProps, "defaultValue" | "onChange">;
+export interface DateInputProps extends BaseInputExposedProps {
+    /**
+     * A default value to be displayed by a input field
+     */
+    defaultValue?: Date;
+    /**
+     * Specification of dates not allowed to be selected - i the form of react-day-picker matcher
+     */
+    disabledDays?: Matcher | Matcher[] | undefined;
+    /**
+     * A flag that can be set to true to disallow the user to deselect a date. (if false the user can click the selected date to deselect)
+     */
+    preventDeselect?: boolean;
+    /**
+     * onChange function returning the date instead of input event
+     */
+    onChange?: (date: Date) => void;
+}
+/**
+ * A wrapper around BaseInput with a pop-up day picker.
+ *
+ * NOTE: If shown with a label, please use the `DateField` component instead.
+ */
+export declare const DateInput: import("react").ForwardRefExoticComponent<DateInputProps & import("react").RefAttributes<HTMLInputElement>>;
+export {};

package/components/Spacer/Spacer.d.ts

@@ -1,21 +1,20 @@
 /// <reference types="react" />
 import { CommonProps } from "../../common";
-interface SpacerProps extends CommonProps {
+export interface SpacerProps extends CommonProps {
     /**
      * The minimum height of the spacer. Defaults to 1px.
      * Possible values are "normal"(8px), and "large" (32px).
      */
-    minHeight?: string;
+    minHeight?: "normal" | "large";
     /**
      * The border of the spacer.
      */
     border?: boolean;
 }
 /**
- * The Spacer component is used for adding a bit of space.
+ * The Spacer component is used for adding a bit of space in the ui.
  *
  * @param {SpacerProps} props - The props for the Spacer component
  * @returns {JSX.Element} Spacer component
  */
 export declare const Spacer: ({ minHeight, border, dataTestId }: SpacerProps) => JSX.Element;
-export {};

package/components/Tag/Tag.d.ts

@@ -25,11 +25,13 @@ export interface TagProps extends CommonProps {
     size?: TagSize;
 }
 /**
- * Tags allow users to enter information and filter content.
+ *  The tag component is used to categorize elements in the ui.
  *
- * Multiple or single tags can be used to categorise items.
+ *  This could be to tell the state of an asset, or label a page as Beta.
  *
- * Use short labels for easy scanning. Use two words only if necessary to describe the status and differentiate it from other tags.
+ *  The tag is also used in multiselect components to show selected options.
+ *
+ *  **Do:** Use short labels for easy scanning.
  *
  * @param {TagProps} props - The props for the tag component
  * @returns {JSX.Element} tag component

package/components/Text/Text.d.ts

@@ -47,7 +47,11 @@ export interface TextProps extends CommonProps {
     underline?: boolean;
 }
 /**
- * The Text component.
+ *  The Text component is used to apply Trackunit default typography styles to text.
+ *
+ *  ### When to use
+ *
+ *  Use Text when you want to show a text section, use Heading if you want to show a heading.
  *
  * @param {TextProps} props - The props for the Text component
  * @returns {JSX.Element} Text component

package/components/index.d.ts

@@ -7,7 +7,8 @@ export * from "./Chart";
 export * from "./Checkbox";
 export * from "./Collapse";
 export * from "./CopyableText";
-export * from "./DateField";
+export * from "./DateField/DateField";
+export * from "./DateInput/DateInput";
 export * from "./DayPicker";
 export * from "./FormGroup/FormGroup";
 export * from "./Heading";

package/index.js

@@ -17,7 +17,7 @@ import ReactAsyncCreatableSelect from 'react-select/async-creatable';
 import ReactCreatableSelect from 'react-select/creatable';
 import ReactSelect from 'react-select';
 import ReactAsyncSelect from 'react-select/async';
-import ReactMoment from 'react-moment';
+import { format, formatDistance } from 'date-fns';
 
 const docs = {
   source: {
@@ -494,7 +494,11 @@ const CustomIcon = tw(Icon$1)`
 `;
 
 /**
- * The Text component.
+ *  The Text component is used to apply Trackunit default typography styles to text.
+ *
+ *  ### When to use
+ *
+ *  Use Text when you want to show a text section, use Heading if you want to show a heading.
  *
  * @param {TextProps} props - The props for the Text component
  * @returns {JSX.Element} Text component
@@ -796,7 +800,7 @@ const IconContainer$1 = tw.div`
 
 const Badge = _a => {
   var {
-    color = "neutral",
+    color = "danger",
     subtle = false,
     className,
     count,
@@ -1288,8 +1292,11 @@ const HeadingContainer = tw.div`
 
 /**
  * The Chart component is a wrapper component for ECharts.
+ *
  * Handles events and click functionality.
  *
+ * For more information see the [eCharts documentation](https://github.com/hustcc/echarts-for-react).
+ *
  * @param {ChartProps} props - The props for the Chart component
  * @returns {JSX.Element} Chart component
  */
@@ -1686,7 +1693,7 @@ const StyledCollapsible = tw.div`
 `;
 
 /**
- * The CopyableText component is used where the user should have easy access to copy some information.
+ * The CopyableText component is used where the user should have easy access to copy information.
  *
  * @param {CopyableTextProps} props - The props for the CopyableText component
  * @returns {JSX.Element} CopyableText component
@@ -1719,19 +1726,8 @@ const CopyableText = ({
   }));
 };
 const StyledCopyableText = tw.span`
-  py-1
-  px-2
-  border
-  border-dashed
-  border-neutral-600
-  rounded
-  cursor-pointer
-  inline
-  transition-all
-  ease-in-out
-  leading-7
-  break-words
-  ${p => p.$animating ? tws`animate-copy` : null}`;
+  tu-copyable-text
+  ${p => p.$animating ? tws`tu-copyable-text--animating` : null}`;
 
 const localeLookup = {
   en: enGB,
@@ -1992,23 +1988,28 @@ const StyledCardBody = tw(CardBody)`
   max-h-full
 `;
 
-const DateField = forwardRef(({
-  defaultValue,
-  onChange,
-  disabled = false,
-  readOnly = false,
-  id,
-  dataTestId,
-  placeholder,
-  disabledDays,
-  preventDeselect = false
-}, ref) => {
-  const [selectedDay, setSelectedDay] = useState(defaultValue ? new Date(defaultValue) : undefined);
+/**
+ * A wrapper around BaseInput with a pop-up day picker.
+ *
+ * NOTE: If shown with a label, please use the `DateField` component instead.
+ */
+
+const DateInput = forwardRef((_a, ref) => {
+  var {
+    defaultValue,
+    disabledDays,
+    disabled,
+    preventDeselect,
+    onChange
+  } = _a,
+      rest = __rest(_a, ["defaultValue", "disabledDays", "disabled", "preventDeselect", "onChange"]);
+
+  const [selectedDay, setSelectedDay] = useState(defaultValue);
   const onChangeHandler = useCallback(value => {
     const newValue = (value === null || value === void 0 ? void 0 : value.toLocaleDateString()) === (selectedDay === null || selectedDay === void 0 ? void 0 : selectedDay.toLocaleDateString()) && !preventDeselect ? undefined : value;
     setSelectedDay(newValue);
     onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
-  }, [setSelectedDay, onChange, selectedDay, preventDeselect]);
+  }, [selectedDay, preventDeselect, onChange]);
   const target = useRef(null);
   const popover = useRef(null);
   const {
@@ -2023,15 +2024,11 @@ const DateField = forwardRef(({
     placement: "bottom"
   });
   return jsxs(Fragment, {
-    children: [jsx(BaseInput, {
-      placeholder: placeholder,
-      value: (selectedDay === null || selectedDay === void 0 ? void 0 : selectedDay.toLocaleDateString()) || "",
-      onChange: () => {},
-      disabled: disabled,
-      readOnly: readOnly,
-      dataTestId: dataTestId,
-      id: id,
+    children: [jsx(BaseInput, Object.assign({
       ref: ref,
+      value: (selectedDay === null || selectedDay === void 0 ? void 0 : selectedDay.toLocaleDateString()) || "",
+      onChange: () => {}
+    }, rest, {
       suffix: jsx(Icon$1, {
         dataTestId: "calendar",
         name: "CalendarIcon",
@@ -2050,8 +2047,9 @@ const DateField = forwardRef(({
             size: "small"
           })
         }))
-      })
-    }), jsx(AnimatedPopover, Object.assign({
+      }),
+      onClick: e => e.preventDefault()
+    })), jsx(AnimatedPopover, Object.assign({
       ref: popoverRef,
       onRequestClose: () => {
         var _a;
@@ -2075,6 +2073,34 @@ const RemoveValueContainer = tw.div`
 tu-date__remove
   `;
 
+/**
+ * The Label component is used for labels for input fields.
+ * This component is **not used directly**, but is part of the FormGroup and Field components.
+ *
+ * @param {LabelProps} props - The props for the Label component
+ * @returns {JSX.Element} Label component
+ */
+
+const Label$5 = ({
+  id,
+  htmlFor,
+  children,
+  className,
+  dataTestId
+}) => {
+  return jsx(Root$2, Object.assign({
+    className: className,
+    id: id,
+    "data-testid": dataTestId,
+    htmlFor: htmlFor
+  }, {
+    children: children
+  }));
+};
+const Root$2 = tw.label`
+  tu-label
+`;
+
 /**
  * The PopoverListItem component.
  *
@@ -2190,143 +2216,6 @@ const StyledText$1 = tw(Text)`
   text-neutral-500
 `;
 
-/**
- * The DayPickerPopover component returns a button which when clicked shows the daypicker.
- *
- * @param {DayPickerPopoverProps} props - The props for the DayPickerPopover component
- * @returns {JSX.Element} DayPickerPopover component
- */
-
-const DayPickerPopover = ({
-  disabledDays,
-  className,
-  selectedDay,
-  onDaySelect,
-  intent = "secondary",
-  placement = "bottom",
-  size = "small",
-  buttonContent,
-  language
-}) => {
-  const target = useRef(null);
-  const popover = useRef(null);
-  const {
-    popoverRef,
-    targetRef,
-    onShow,
-    onHide,
-    popoverProps
-  } = usePopover({
-    targetRef: target,
-    popoverRef: popover,
-    placement: placement
-  });
-  return jsxs(Fragment$1, {
-    children: [jsx(Button, Object.assign({
-      intent: intent,
-      size: size,
-      className: className,
-      prefix: jsx(Icon$1, {
-        name: "CalendarIcon",
-        size: "small"
-      }),
-      ref: targetRef,
-      onClick: onShow
-    }, {
-      children: buttonContent
-    })), jsx(AnimatedPopover, Object.assign({
-      ref: popoverRef,
-      onRequestClose: () => {
-        var _a;
-
-        onHide();
-        (_a = targetRef === null || targetRef === void 0 ? void 0 : targetRef.current) === null || _a === void 0 ? void 0 : _a.blur();
-      }
-    }, popoverProps, {
-      children: jsx(PopoverList, {
-        children: jsx(DayPicker, {
-          disabledDays: disabledDays,
-          onDaySelect: onDaySelect,
-          selectedDays: selectedDay,
-          language: language
-        })
-      })
-    }))]
-  });
-};
-
-/**
- * The DayRangePicker component should be used when the user needs to select a range of dates.
- *
- * @param {DayRangePickerProps} props - The props for the DayRangePicker component
- * @returns {JSX.Element} DayRangePicker component
- */
-
-const DayRangePicker = ({
-  onRangeSelect,
-  selectedDays,
-  disabledDays,
-  dataTestId,
-  language
-}) => {
-  const locale = useLocale(language);
-  const onSelect = useCallback(range => {
-    if (onRangeSelect && range === undefined) {
-      onRangeSelect(undefined);
-    }
-
-    if (onRangeSelect && range) {
-      const from = range.from;
-      const to = range.to ? range.to : range.from;
-      onRangeSelect({
-        from,
-        to
-      });
-    }
-  }, [onRangeSelect]);
-  return jsx("div", Object.assign({
-    "data-testid": dataTestId
-  }, {
-    children: jsx(DayPicker$1, {
-      mode: "range",
-      onSelect: onSelect,
-      selected: selectedDays,
-      defaultMonth: selectedDays && selectedDays.from,
-      locale: locale,
-      disabled: disabledDays,
-      className: "custom-day-picker range-picker"
-    })
-  }));
-};
-
-/**
- * The Label component is used for labels for input fields.
- * This component is **not used directly**, but is part of the FormGroup and Field components.
- *
- * @param {LabelProps} props - The props for the Label component
- * @returns {JSX.Element} Label component
- */
-
-const Label$5 = ({
-  id,
-  htmlFor,
-  children,
-  className,
-  dataTestId
-}) => {
-  return jsx(Root$2, Object.assign({
-    className: className,
-    id: id,
-    "data-testid": dataTestId,
-    htmlFor: htmlFor
-  }, {
-    children: children
-  }));
-};
-const Root$2 = tw.label`
-  tu-label
-`;
-
 /**
  * The Tooltip component.
  *
@@ -2502,6 +2391,157 @@ const HelpAddon = tw.span`
   tu-form-group__help-addon 
 `;
 
+/**
+ * The date field component is used for entering date values.
+ *
+ * _**Do use**_ the DateField for date input.
+ *
+ * _**Do not use**_ this fields for non-serialized dates. Use TextField instead.
+ */
+
+const DateField = forwardRef((_a, ref) => {
+  var {
+    label,
+    tip,
+    helpText,
+    errorMessage,
+    helpAddon,
+    isInvalid,
+    className,
+    defaultValue,
+    dataTestId
+  } = _a,
+      rest = __rest(_a, ["label", "tip", "helpText", "errorMessage", "helpAddon", "isInvalid", "className", "defaultValue", "dataTestId"]);
+
+  const renderAsInvalid = isInvalid || Boolean(errorMessage);
+  return jsx(FormGroup, Object.assign({
+    label: label,
+    tip: tip,
+    isInvalid: renderAsInvalid,
+    helpText: errorMessage || helpText,
+    helpAddon: helpAddon,
+    dataTestId: `${dataTestId}-FormGroup`
+  }, {
+    children: jsx(DateInput, Object.assign({
+      ref: ref,
+      defaultValue: defaultValue,
+      isInvalid: renderAsInvalid
+    }, rest, {
+      className: className,
+      dataTestId: dataTestId
+    }))
+  }));
+});
+
+/**
+ * The DayPickerPopover component returns a button which when clicked shows the daypicker.
+ *
+ * @param {DayPickerPopoverProps} props - The props for the DayPickerPopover component
+ * @returns {JSX.Element} DayPickerPopover component
+ */
+
+const DayPickerPopover = ({
+  disabledDays,
+  className,
+  selectedDay,
+  onDaySelect,
+  intent = "secondary",
+  placement = "bottom",
+  size = "small",
+  buttonContent,
+  language
+}) => {
+  const target = useRef(null);
+  const popover = useRef(null);
+  const {
+    popoverRef,
+    targetRef,
+    onShow,
+    onHide,
+    popoverProps
+  } = usePopover({
+    targetRef: target,
+    popoverRef: popover,
+    placement: placement
+  });
+  return jsxs(Fragment$1, {
+    children: [jsx(Button, Object.assign({
+      intent: intent,
+      size: size,
+      className: className,
+      prefix: jsx(Icon$1, {
+        name: "CalendarIcon",
+        size: "small"
+      }),
+      ref: targetRef,
+      onClick: onShow
+    }, {
+      children: buttonContent
+    })), jsx(AnimatedPopover, Object.assign({
+      ref: popoverRef,
+      onRequestClose: () => {
+        var _a;
+
+        onHide();
+        (_a = targetRef === null || targetRef === void 0 ? void 0 : targetRef.current) === null || _a === void 0 ? void 0 : _a.blur();
+      }
+    }, popoverProps, {
+      children: jsx(PopoverList, {
+        children: jsx(DayPicker, {
+          disabledDays: disabledDays,
+          onDaySelect: onDaySelect,
+          selectedDays: selectedDay,
+          language: language
+        })
+      })
+    }))]
+  });
+};
+
+/**
+ * The DayRangePicker component should be used when the user needs to select a range of dates.
+ *
+ * @param {DayRangePickerProps} props - The props for the DayRangePicker component
+ * @returns {JSX.Element} DayRangePicker component
+ */
+
+const DayRangePicker = ({
+  onRangeSelect,
+  selectedDays,
+  disabledDays,
+  dataTestId,
+  language
+}) => {
+  const locale = useLocale(language);
+  const onSelect = useCallback(range => {
+    if (onRangeSelect && range === undefined) {
+      onRangeSelect(undefined);
+    }
+
+    if (onRangeSelect && range) {
+      const from = range.from;
+      const to = range.to ? range.to : range.from;
+      onRangeSelect({
+        from,
+        to
+      });
+    }
+  }, [onRangeSelect]);
+  return jsx("div", Object.assign({
+    "data-testid": dataTestId
+  }, {
+    children: jsx(DayPicker$1, {
+      mode: "range",
+      onSelect: onSelect,
+      selected: selectedDays,
+      defaultMonth: selectedDays && selectedDays.from,
+      locale: locale,
+      disabled: disabledDays,
+      className: "custom-day-picker range-picker"
+    })
+  }));
+};
+
 /**
  * Indicators are non-interactive elements that communicate essential aspects of the state of an asset.
  *
@@ -3053,34 +3093,15 @@ const NumberField = forwardRef((_a, ref) => {
   }));
 });
 
-const GetSpacerHeight = () => ({
-  minHeight
-}) => {
-  if (!minHeight) {
-    return "";
-  }
-
-  switch (minHeight) {
-    case "normal":
-      return tws`min-h-[8px]`;
-
-    case "large":
-      return tws`min-h-[32px]`;
-
-    default:
-      return "";
-  }
-};
 /**
- * The Spacer component is used for adding a bit of space.
+ * The Spacer component is used for adding a bit of space in the ui.
  *
  * @param {SpacerProps} props - The props for the Spacer component
  * @returns {JSX.Element} Spacer component
  */
 
-
 const Spacer = ({
-  minHeight = "",
+  minHeight,
   border,
   dataTestId
 }) => {
@@ -3090,17 +3111,35 @@ const Spacer = ({
     border: border
   });
 };
+
+const GetSpacerHeight = () => ({
+  minHeight
+}) => {
+  switch (minHeight) {
+    case "normal":
+      return tws`tu-spacer--normal`;
+
+    case "large":
+      return tws`tu-spacer--large`;
+
+    default:
+      return "";
+  }
+};
+
 const Space = tw.div`
-${p => `${p.border ? `tu-spacer--border` : null}`}
-${GetSpacerHeight()}
+  ${p => `${p.border ? `tu-spacer--border` : null}`}
+  ${GetSpacerHeight()}
 `;
 
 /**
- * Tags allow users to enter information and filter content.
+ *  The tag component is used to categorize elements in the ui.
  *
- * Multiple or single tags can be used to categorise items.
+ *  This could be to tell the state of an asset, or label a page as Beta.
  *
- * Use short labels for easy scanning. Use two words only if necessary to describe the status and differentiate it from other tags.
+ *  The tag is also used in multiselect components to show selected options.
+ *
+ *  **Do:** Use short labels for easy scanning.
  *
  * @param {TagProps} props - The props for the tag component
  * @returns {JSX.Element} tag component
@@ -3729,12 +3768,12 @@ const SkeletonLines = memo(({
   for (let i = 0; i < lines; i++) {
     skeletonLines.push(jsx(SkeletonLine, Object.assign({
       "data-testid": dataTestId,
-      margin: margin,
       "data-type": "loading-skeleton-line",
       className: className,
       style: {
         height: getHeight(i),
-        width: getWidth(i)
+        width: getWidth(i),
+        margin: margin
       }
     }, {
       children: "\u00A0"
@@ -4010,12 +4049,9 @@ const TimelineElement = ({
       size: "large"
     })
   }),
-  header = jsx(ReactMoment, Object.assign({
-    format: "LLL",
-    fromNow: true
-  }, {
-    children: date
-  }))
+  header = `${format(date, "MMM d, yyyy")} (${formatDistance(date, new Date(), {
+    addSuffix: true
+  })})`
 }) => {
   var _a;
 
@@ -4518,4 +4554,4 @@ const Layout = tw.div`
   tu-layout-TwoColumnLayout
 `;
 
-export { Alert, AnimatedPopover, Badge, BaseInput, Button, Card, CardBody, CardFooter, CardHeader, Chart, Checkbox, Collapse, CopyableText, CreatableSelect, DateField, DayPicker, DayPickerPopover, DayRangePicker, DensityContainer, FilterListMapLayout, FormGroup, FullWidthRepeatingLayout, GridArea, Heading, Icon$1 as Icon, IconButton, Indicator$1 as Indicator, IntrinsicallyResponsiveGrid, Label$5 as Label, LegendItem, MenuButton, MenuItem, MenuList, MinTopFullContentLayout, Modal, ModalBackdrop, NumberField, NumberInput, PageHeading, PopoverLifecycle, PopoverList, PopoverListItem, PopoverTitle, Prompt, ROLE_CARD, RadioGroup, RadioItem, Select, SkeletonLines, Spacer, Spinner, StarButton, Tag, Text, TextArea, TextAreaField, TextField, TextInput, Timeline, TimelineElement, Tip, TitleNavContentLayout, Toggle, Tooltip, TwoColumnLayout, activityColors, colors, criticalityColors, docs, generalColors, intentColors, useContainerProps, useCustomComponents, useCustomStyles, useDebounce, useLocalStorage, useModal, usePopover, usePrompt, useTimeout };
+export { Alert, AnimatedPopover, Badge, BaseInput, Button, Card, CardBody, CardFooter, CardHeader, Chart, Checkbox, Collapse, CopyableText, CreatableSelect, DateField, DateInput, DayPicker, DayPickerPopover, DayRangePicker, DensityContainer, FilterListMapLayout, FormGroup, FullWidthRepeatingLayout, GridArea, Heading, Icon$1 as Icon, IconButton, Indicator$1 as Indicator, IntrinsicallyResponsiveGrid, Label$5 as Label, LegendItem, MenuButton, MenuItem, MenuList, MinTopFullContentLayout, Modal, ModalBackdrop, NumberField, NumberInput, PageHeading, PopoverLifecycle, PopoverList, PopoverListItem, PopoverTitle, Prompt, ROLE_CARD, RadioGroup, RadioItem, Select, SkeletonLines, Spacer, Spinner, StarButton, Tag, Text, TextArea, TextAreaField, TextField, TextInput, Timeline, TimelineElement, Tip, TitleNavContentLayout, Toggle, Tooltip, TwoColumnLayout, activityColors, colors, criticalityColors, docs, generalColors, intentColors, useContainerProps, useCustomComponents, useCustomStyles, useDebounce, useLocalStorage, useModal, usePopover, usePrompt, useTimeout };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-components",
-  "version": "0.0.100",
+  "version": "0.0.103",
   "repository": "https://github.com/Trackunit/manager",
   "license": "UNLICENSED",
   "dependencies": {
@@ -20,8 +20,7 @@
     "@popperjs/core": "^2.11.4",
     "history": "^5.3.0",
     "react-router-dom": "^6.2.2",
-    "react-select": "^5.4.0",
-    "react-moment": "^1.1.2"
+    "react-select": "^5.4.0"
   },
   "module": "./index.js",
   "main": "./index.js",

package/components/DateField/index.d.ts

@@ -1 +0,0 @@
-export * from "./DateField";