@spaced-out/ui-design-system 0.4.12 → 0.4.13-beta.1

package/lib/components/DateRangePicker/DateRangePicker.stories.js

@@ -0,0 +1,406 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports._WithSelectedDateRange = exports._WithMinAndMaxDate = exports._WithInputDropdown = exports._Default = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _react2 = require("@floating-ui/react");
+var _size = require("../../styles/variables/_size");
+var _space = require("../../styles/variables/_space");
+var _utils = require("../../utils");
+var _classify = require("../../utils/classify");
+var _clickAway = require("../../utils/click-away");
+var _mergeRefs = require("../../utils/merge-refs");
+var _Input = require("../Input");
+var _DateRangePicker = require("./DateRangePicker");
+var _DateRangePickerStoriesModule = _interopRequireDefault(require("./DateRangePicker.stories.module.css"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+var _default = exports.default = {
+  tags: ['autodocs'],
+  title: 'Form Components/Date Range Picker',
+  component: _DateRangePicker.DateRangePicker,
+  argTypes: {
+    classNames: {
+      description: 'Provide an optional className to be applied to the wrapper.',
+      control: {
+        type: 'object'
+      },
+      table: {
+        type: {
+          summary: '{wrapper?: string}'
+        }
+      }
+    },
+    selectedDateRange: {
+      description: 'An optional date range in the YYYY-MM-DD format and timezone.',
+      control: {
+        type: 'object'
+      },
+      table: {
+        type: {
+          summary: '{startDate: string, endDate: string, timezone: string}'
+        }
+      }
+    },
+    minDate: {
+      description: 'The minimum permissible date that a user can specify is set to 8 years before the current date by default.',
+      control: {
+        type: 'text'
+      },
+      table: {
+        type: {
+          summary: 'string'
+        },
+        defaultValue: {
+          summary: (0, _utils.getSubtractedDate)((0, _utils.formatIsoDate)(), 8, 'y')
+        }
+      }
+    },
+    maxDate: {
+      description: 'The maximum permissible date that a user can select is set to the current date by default.',
+      control: {
+        type: 'text'
+      },
+      table: {
+        type: {
+          summary: 'string'
+        },
+        defaultValue: {
+          summary: (0, _utils.formatIsoDate)()
+        }
+      }
+    },
+    hideTimezone: {
+      description: 'Hide timezone filter.',
+      control: {
+        type: 'boolean'
+      },
+      table: {
+        type: {
+          summary: 'boolean'
+        },
+        defaultValue: {
+          summary: false
+        }
+      }
+    },
+    onCancel: {
+      description: 'Function that is triggered upon clicking the Cancel button.',
+      control: null,
+      table: {
+        type: {
+          summary: '() => void'
+        }
+      }
+    },
+    onError: {
+      description: 'Function that is triggered when an error occurs.',
+      control: null,
+      table: {
+        type: {
+          summary: `({
+            type: string,
+            description: string
+          }) => void`
+        }
+      }
+    },
+    onApply: {
+      description: 'Function that is triggered upon clicking the Apply button.',
+      control: null,
+      table: {
+        type: {
+          summary: `({
+            startDateUTC: string,
+            endDateUTC: string,
+            startDate: string,
+            endDate: string,
+            timezone: string,
+          }) => void`
+        }
+      }
+    },
+    startDateLabel: {
+      description: 'Label for the start date.',
+      control: {
+        type: 'text'
+      }
+    },
+    endDateLabel: {
+      description: 'Label for the end date.',
+      control: {
+        type: 'text'
+      }
+    },
+    t: {
+      description: 'Translation function that takes a key and fallback value and returns the translated string.',
+      control: null,
+      table: {
+        type: {
+          summary: '(key: string, fallback: string) => string'
+        }
+      }
+    },
+    locale: {
+      description: 'Language code for localization.',
+      control: {
+        type: 'text'
+      },
+      table: {
+        type: {
+          summary: 'string'
+        }
+      }
+    }
+  },
+  parameters: {
+    docs: {
+      subtitle: 'Generates a DateRangePicker component.',
+      description: {
+        component: `
+\`\`\`js
+import { DateRangePicker } from "@spaced-out/ui-design-system/lib/components/DateRangePicker";
+\`\`\`
+**DateRangePicker** simplifies the selection of date ranges with precision and ease, offering a comprehensive set of features designed to streamline the process.
+
+**Note:**
+
+- **DST and Timezone Selection:** When users select a timezone in our \`DateRangePicker\`, it's crucial to recognize the impact of Daylight Saving Time (DST).
+In regions observing DST, the UTC offset can vary depending on the date. For accurate time conversions, we dynamically adjust the UTC offset based on the selected date's DST observance. This ensures precise time representations across different timezones.
+
+\`\`\`jsx
+// You can create a Date Range Picker input dropdown using floating UI and ClickAway.
+export const _WithInputDropdown = ({
+  onApply,
+  onCancel,
+  selectedDateRange,
+  classNames,
+}: DateRangePickerProps): React.ReactNode => {
+  const [dateRange, setDateRange] = React.useState<DateRangeWithTimezone>({
+    ...selectedDateRange,
+  });
+  const { x, y, refs, strategy } = useFloating({
+    open: true,
+    strategy: 'absolute',
+    placement: 'bottom-start',
+    whileElementsMounted: autoUpdate,
+    middleware: [offset(parseInt(spaceXXSmall))],
+  });
+
+  const onApplyClick = ({startDate, endDate}: DateRangeWithTimezone) => {
+    setDateRange({
+      startDate,
+      endDate,
+    });
+  };
+  const startDate = dateRange.startDate
+    ? formatIsoDate(dateRange.startDate, 'MMM DD, YYYY')
+    : 'MMM DD, YYYY';
+  const endDate = dateRange.endDate
+    ? formatIsoDate(dateRange.endDate, 'MMM DD, YYYY')
+    : 'MMM DD, YYYY';
+
+  return (
+        <ClickAway>
+          {({isOpen = true, onOpen, clickAway, boundaryRef, triggerRef}) => (
+            <div data-testid="Dropdown" className={classify(css.dropdownContainer)}>
+              <Input
+                size="small"
+                placeholder="Select Date"
+                boxRef={mergeRefs([refs.setReference, triggerRef])}
+                value={
+                  startDate.replaceAll('-', '.') +
+                  '  -  ' +
+                  endDate.replaceAll('-', '.')
+                }
+                classNames={{box: classify(css.inputBox)}}
+                iconRightName={isOpen ? 'angle-up' : 'angle-down'}
+                readOnly
+                onContainerClick={(e) => {
+                  e.stopPropagation();
+                  onOpen();
+                }}
+              />
+
+              {isOpen && (
+                <div
+                  ref={mergeRefs([refs.setFloating, boundaryRef])}
+                  style={{
+                    position: strategy,
+                    top: y ?? spaceNone,
+                    left: x ?? spaceNone,
+                    width: sizeFluid,
+                  }}
+                >
+                  <DateRangePicker
+                    onApply={(dateRange: DateRangeWithTimezone) => {
+                      onApplyClick(dateRange);
+                      clickAway();
+                    }}
+                    onCancel={() => {
+                      clickAway();
+                    }}
+                    selectedDateRange={{
+                      ...dateRange,
+                    }}
+                    classNames={classNames}
+                  />
+                </div>
+              )}
+            </div>
+          )}
+        </ClickAway>
+  );
+};
+\`\`\`
+`
+      }
+    },
+    storySource: {
+      componentPath: '/src/components/DateRangePicker/DateRangePicker.jsx'
+    }
+  }
+};
+const _Default = args => /*#__PURE__*/React.createElement("div", {
+  className: _DateRangePickerStoriesModule.default.container
+}, /*#__PURE__*/React.createElement(_DateRangePicker.DateRangePicker, _extends({}, args, {
+  onApply: () => {},
+  onCancel: () => {}
+})));
+exports._Default = _Default;
+_Default.args = {
+  classNames: {
+    wrapper: ''
+  }
+};
+const _WithSelectedDateRange = args => /*#__PURE__*/React.createElement("div", {
+  className: _DateRangePickerStoriesModule.default.container
+}, /*#__PURE__*/React.createElement(_DateRangePicker.DateRangePicker, _extends({}, args, {
+  onApply: () => {},
+  onCancel: () => {}
+})));
+exports._WithSelectedDateRange = _WithSelectedDateRange;
+_WithSelectedDateRange.args = {
+  classNames: {
+    wrapper: ''
+  },
+  selectedDateRange: {
+    startDate: '2024-02-04',
+    endDate: '2024-04-16',
+    timezone: 'America/Los_Angeles'
+  }
+};
+const _WithInputDropdown = _ref => {
+  let {
+    selectedDateRange,
+    classNames
+  } = _ref;
+  const [dateRange, setDateRange] = React.useState({
+    ...selectedDateRange
+  });
+  const {
+    x,
+    y,
+    refs,
+    strategy,
+    context
+  } = (0, _react2.useFloating)({
+    open: true,
+    strategy: 'absolute',
+    placement: 'bottom-start',
+    whileElementsMounted: _react2.autoUpdate,
+    middleware: [(0, _react2.offset)(parseInt(_space.spaceXXSmall))]
+  });
+  const onApplyClick = _ref2 => {
+    let {
+      startDate,
+      endDate
+    } = _ref2;
+    setDateRange({
+      startDate,
+      endDate
+    });
+  };
+  const startDate = dateRange.startDate ? (0, _utils.formatIsoDate)(dateRange.startDate, 'MMM DD, YYYY') : 'MMM DD, YYYY';
+  const endDate = dateRange.endDate ? (0, _utils.formatIsoDate)(dateRange.endDate, 'MMM DD, YYYY') : 'MMM DD, YYYY';
+  return /*#__PURE__*/React.createElement(_clickAway.ClickAway, {
+    containsNestedFloatingPortals: true
+  }, _ref3 => {
+    let {
+      isOpen = true,
+      onOpen,
+      clickAway,
+      boundaryRef,
+      triggerRef
+    } = _ref3;
+    return /*#__PURE__*/React.createElement("div", {
+      "data-testid": "Dropdown",
+      className: (0, _classify.classify)(_DateRangePickerStoriesModule.default.dropdownContainer)
+    }, /*#__PURE__*/React.createElement(_Input.Input, {
+      size: "small",
+      placeholder: "Select Date"
+      // @ts-ignore - TS2322 - Type '((node: ReferenceType | null) => void) & ((node: ReferenceType | null) => void)' is not assignable to type '{ current: HTMLElement | null | undefined; }'.
+      ,
+      boxRef: (0, _mergeRefs.mergeRefs)([refs.setReference, triggerRef]),
+      value: startDate.replaceAll('-', '.') + '  -  ' + endDate.replaceAll('-', '.'),
+      classNames: {
+        box: (0, _classify.classify)(_DateRangePickerStoriesModule.default.inputBox)
+      },
+      iconRightName: isOpen ? 'angle-up' : 'angle-down',
+      readOnly: true,
+      onContainerClick: e => {
+        e.stopPropagation();
+        onOpen();
+      }
+    }), isOpen && /*#__PURE__*/React.createElement(_react2.FloatingPortal, null, /*#__PURE__*/React.createElement(_react2.FloatingFocusManager, {
+      context: context
+      // @ts-ignore - TS2322 - Type 'MutableRefObject<ReferenceType | null> & MutableRefObject<ReferenceType | null>' is not assignable to type 'number | MutableRefObject<HTMLElement | null> | undefined'.
+      ,
+      initialFocus: refs.reference
+    }, /*#__PURE__*/React.createElement("div", {
+      // @ts-ignore - TS2322 - Type '((node: HTMLElement | null) => void) & ((node: HTMLElement | null) => void)' is not assignable to type '{ current: HTMLElement | null | undefined; }'.
+      ref: (0, _mergeRefs.mergeRefs)([refs.setFloating, boundaryRef]),
+      style: {
+        position: strategy,
+        top: y ?? _space.spaceNone,
+        left: x ?? _space.spaceNone,
+        width: _size.sizeFluid
+      }
+    }, /*#__PURE__*/React.createElement(_DateRangePicker.DateRangePicker, {
+      onApply: dateRange => {
+        onApplyClick(dateRange);
+        clickAway();
+      },
+      onCancel: () => {
+        clickAway();
+      },
+      selectedDateRange: {
+        ...dateRange
+      },
+      classNames: classNames
+    })))));
+  });
+};
+exports._WithInputDropdown = _WithInputDropdown;
+_WithInputDropdown.args = {
+  classNames: {
+    wrapper: ''
+  }
+};
+const _WithMinAndMaxDate = args => /*#__PURE__*/React.createElement("div", {
+  className: _DateRangePickerStoriesModule.default.container
+}, /*#__PURE__*/React.createElement(_DateRangePicker.DateRangePicker, _extends({}, args, {
+  onApply: () => {},
+  onCancel: () => {}
+})));
+exports._WithMinAndMaxDate = _WithMinAndMaxDate;
+_WithMinAndMaxDate.args = {
+  classNames: {
+    wrapper: ''
+  },
+  minDate: (0, _utils.getSubtractedDate)((0, _utils.formatIsoDate)(), 15, 'M'),
+  maxDate: (0, _utils.formatIsoDate)()
+};

package/lib/components/DateRangePicker/DateRangeWrapper.d.ts

@@ -0,0 +1,33 @@
+import { Flow } from 'flow-to-typescript-codemod';
+import type { DateRange, DateRangeWithTimezone } from '../../types';
+import { MARKERS, NAVIGATION_ACTION } from '../../utils';
+type DateRangeWrapperProps = {
+    dateRange: DateRange;
+    hoverDay: string;
+    minDate: string;
+    maxDate: string;
+    rangeStartMonth: string;
+    rangeEndMonth: string;
+    cardWrapperClass: string | null | undefined;
+    setRangeStartMonth: (arg1: string) => void;
+    setRangeEndMonth: (arg1: string) => void;
+    setTimezone: (arg1: string) => void;
+    timezone: string;
+    onApply: (datePickerSelectedRange: DateRangeWithTimezone) => void;
+    onCancel: () => void;
+    inHoverRange: (day: string) => boolean;
+    hideTimezone: boolean;
+    handlers: {
+        onDayClick: (day: string) => void;
+        onDayHover: (day: string) => void;
+        onMonthNavigate: (marker: typeof MARKERS[keyof typeof MARKERS], action: typeof NAVIGATION_ACTION[keyof typeof NAVIGATION_ACTION]) => void;
+    };
+    today: string;
+    startDateLabel?: string;
+    endDateLabel?: string;
+    t?: ((key: string, fallback: string) => string) | null | undefined;
+    locale?: string;
+};
+export declare const DateRangeWrapper: Flow.AbstractComponent<DateRangeWrapperProps, HTMLDivElement>;
+export {};
+//# sourceMappingURL=DateRangeWrapper.d.ts.map

package/lib/components/DateRangePicker/DateRangeWrapper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateRangeWrapper.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/DateRangeWrapper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,4BAA4B,CAAC;AAKhD,OAAO,KAAK,EAAC,SAAS,EAAE,qBAAqB,EAAC,MAAM,aAAa,CAAC;AAClE,OAAO,EAML,OAAO,EACP,iBAAiB,EAClB,MAAM,aAAa,CAAC;AA8CrB,KAAK,qBAAqB,GAAG;IAC3B,SAAS,EAAE,SAAS,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,CAAC;IACtB,gBAAgB,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IAC5C,kBAAkB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,gBAAgB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,CAAC,uBAAuB,EAAE,qBAAqB,KAAK,IAAI,CAAC;IAClE,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,YAAY,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;IACvC,YAAY,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE;QACR,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;QAClC,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;QAClC,eAAe,EAAE,CACf,MAAM,EAAE,OAAO,OAAO,CAAC,MAAM,OAAO,OAAO,CAAC,EAC5C,MAAM,EAAE,OAAO,iBAAiB,CAAC,MAAM,OAAO,iBAAiB,CAAC,KAC7D,IAAI,CAAC;KACX,CAAC;IACF,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,MAAM,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;IACnE,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AA0FF,eAAO,MAAM,gBAAgB,EAAE,IAAI,CAAC,iBAAiB,CAAC,qBAAqB,EAAE,cAAc,CA8MzF,CAAC"}

package/lib/components/DateRangePicker/DateRangeWrapper.js

@@ -15,11 +15,11 @@ var _Dropdown = require("../Dropdown");
 var _FocusManager = require("../FocusManager");
 var _Icon = require("../Icon");
 var _Text = require("../Text");
-var _Calendar = require("./Calendar.js");
+var _Calendar = require("./Calendar");
 var _DateRangeWrapperModule = _interopRequireDefault(require("./DateRangeWrapper.module.css"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } // $FlowFixMe[untyped-import]
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 const CalendarHeader = _ref => {
   let {
     t,
@@ -70,6 +70,7 @@ const CalendarHeader = _ref => {
       options: availableMonths
     },
     onChange: event => {
+      // @ts-ignore - TS2345 - Argument of type 'Moment' is not assignable to parameter of type 'string'. | TS2339 - Property 'key' does not exist on type 'ChangeEvent<HTMLInputElement> | MenuOption'.
       setMonth((0, _utils.getMonthEndDate)(_moment.default.utc(date).set('M', event.key)));
     },
     dropdownInputText: MONTHS[_moment.default.utc(date).month()].label,
@@ -82,8 +83,11 @@ const CalendarHeader = _ref => {
     },
     size: "small",
     onChange: event => {
+      // @ts-ignore - TS2345 - Argument of type 'Moment' is not assignable to parameter of type 'string'. | TS2339 - Property 'key' does not exist on type 'ChangeEvent<HTMLInputElement> | MenuOption'.
       setMonth((0, _utils.getMonthEndDate)(_moment.default.utc(date).set('y', event.key)));
-    },
+    }
+    // @ts-ignore - TS2769 - No overload matches this call.
+    ,
     dropdownInputText: _moment.default.utc(date).year(),
     scrollMenuToBottom: true
   }), /*#__PURE__*/React.createElement(_Icon.ClickableIcon, {
@@ -223,12 +227,16 @@ const DateRangeWrapper = exports.DateRangeWrapper = /*#__PURE__*/React.forwardRe
         RESULT: (0, _dateRangePicker.getTranslation)(t, 'result'),
         RESULTS: (0, _dateRangePicker.getTranslation)(t, 'results')
       }
-    },
+    }
+    // @ts-ignore - TS7053 - Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{ readonly 'Pacific/Niue': "(GMT-11:00) Niue"; readonly 'Pacific/Pago_Pago': "(GMT-11:00) Pago Pago"; readonly 'Pacific/Honolulu': "(GMT-10:00) Hawaii Time"; readonly 'Pacific/Rarotonga': "(GMT-10:00) Rarotonga"; ... 247 more ...; readonly 'Pacific/Kiritimati': "(GMT+14:00) Kiritimati"; }'.
+    ,
     dropdownInputText: (0, _dateRangePicker.getTranslation)(t, _dateRangePicker.TIMEZONES[timezone]),
     disabled: (0, _dateRangePicker.isAfter)(minDate, maxDate),
     classNames: {
       box: _DateRangeWrapperModule.default.timezoneDropdown
-    },
+    }
+    // @ts-ignore - TS2339 - Property 'key' does not exist on type 'ChangeEvent<HTMLInputElement> | MenuOption'.
+    ,
     onChange: event => setTimezone(event.key),
     size: "small"
   })), /*#__PURE__*/React.createElement(_Card.CardActions, null, /*#__PURE__*/React.createElement(_Button.Button, {

package/lib/components/DateRangePicker/Day.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+type DayProps = {
+    date: string;
+    value: string;
+    filled: boolean;
+    hoverDay: string;
+    outlined: boolean;
+    disabled: boolean;
+    endOfRange: boolean;
+    highlighted: boolean;
+    startOfRange: boolean;
+    onClick: () => void;
+    onHover: () => void;
+};
+export declare const Day: ({ date, value, filled, onHover, onClick, disabled, hoverDay, outlined, endOfRange, highlighted, startOfRange, }: DayProps) => React.JSX.Element;
+export {};
+//# sourceMappingURL=Day.d.ts.map

package/lib/components/DateRangePicker/Day.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Day.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/Day.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,KAAK,QAAQ,GAAG;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAYF,eAAO,MAAM,GAAG,GACd,iHAYG,QAAQ,sBA0BK,CAAC"}

package/lib/components/DateRangePicker/Day.js

@@ -12,8 +12,6 @@ var _Text = require("../Text");
 var _DayModule = _interopRequireDefault(require("./Day.module.css"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-// $FlowFixMe[untyped-import]
-// $FlowFixMe[untyped-import]
 const getTextColor = (disabled, filled) => {
   if (disabled) {
     return _Text.TEXT_COLORS.disabled;
@@ -42,11 +40,15 @@ const Day = _ref => {
     className: (0, _classify.default)(_DayModule.default.calendarItemButton, {
       [_DayModule.default.calendarRowItemDisabled]: disabled,
       [_DayModule.default.calendarRowItemHighlighted]: !disabled && (highlighted || startOfRange || endOfRange)
-    }),
+    })
+    // @ts-ignore - TS2769 - No overload matches this call.
+    ,
     onMouseOver: onHover,
     onClick: onClick,
     onKeyUp: onHover
-  }, /*#__PURE__*/React.createElement(_Text.BodyMedium, {
+  }, /*#__PURE__*/React.createElement(_Text.BodyMedium
+  // @ts-ignore - TS2769 - No overload matches this call.
+  , {
     type: "ghost",
     color: getTextColor(disabled, filled),
     className: (0, _classify.default)(_DayModule.default.calendarRowItem, {

package/lib/components/DateRangePicker/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DateRangePicker';
+//# sourceMappingURL=index.d.ts.map

package/lib/components/DateRangePicker/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangePicker/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

package/lib/components/Dialog/Dialog.d.ts

@@ -0,0 +1,46 @@
+import * as React from 'react';
+import type { ModalProps } from '../Modal';
+type FooterClassNames = Readonly<{
+    wrapper?: string;
+    actions?: string;
+}>;
+export declare const DIALOG_SEMANTIC: Readonly<{
+    neutral: "neutral";
+    success: "success";
+    information: "information";
+    warning: "warning";
+    danger: "danger";
+}>;
+export type DialogSemanticType = typeof DIALOG_SEMANTIC[keyof typeof DIALOG_SEMANTIC];
+export type DialogHeaderProps = {
+    children?: React.ReactNode;
+    className?: string;
+};
+export type DialogFooterProps = {
+    children?: React.ReactNode;
+    classNames?: FooterClassNames;
+};
+export type DialogBodyProps = {
+    children?: React.ReactNode;
+    className?: string;
+};
+export type DialogPropsBase = (ModalProps);
+export type DialogProps = ((DialogPropsBase) & {
+    semantic?: DialogSemanticType;
+    iconName?: string;
+});
+export type BasicDialogProps = ((DialogProps) & {
+    heading?: React.ReactNode;
+    body?: React.ReactNode;
+    confirmText?: string;
+    abortText?: string;
+    handleConfirm?: (event: React.SyntheticEvent) => unknown;
+    handleAbort?: (event: React.SyntheticEvent) => unknown;
+});
+export declare const DialogHeader: ({ children, className, }: DialogHeaderProps) => React.JSX.Element;
+export declare const DialogBody: ({ children, className, }: DialogBodyProps) => React.JSX.Element;
+export declare const DialogFooter: ({ children, classNames, }: DialogFooterProps) => React.JSX.Element;
+export declare const Dialog: ({ children, isOpen, hideBackdrop, onClose, tapOutsideToClose, iconName, semantic, classNames, ...restDialogProps }: DialogProps) => React.JSX.Element;
+export declare const BasicDialog: ({ heading, body, confirmText, abortText, handleConfirm, handleAbort, ...restDialogProps }: BasicDialogProps) => React.JSX.Element;
+export {};
+//# sourceMappingURL=Dialog.d.ts.map

package/lib/components/Dialog/Dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,UAAU,CAAC;AAMzC,KAAK,gBAAgB,GAAG,QAAQ,CAAC;IAC/B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC,CAAC;AAEH,eAAO,MAAM,eAAe;;;;;;EAM1B,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG,OAAO,eAAe,CAAC,MAAM,OAAO,eAAe,CAAC,CAAC;AAEtF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,UAAU,CAAC,EAAE,gBAAgB,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,CAAC,UAAU,CAAC,CAAC;AAE3C,MAAM,MAAM,WAAW,GAAG,CAAC,CAAC,eAAe,CAAC,GAAG;IAC7C,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,CAAC,CAAC,WAAW,CAAC,GAAG;IAC9C,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,KAAK,OAAO,CAAC;IACzD,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,cAAc,KAAK,OAAO,CAAC;CACxD,CAAC,CAAC;AAiEH,eAAO,MAAM,YAAY,GACvB,0BAGG,iBAAiB,sBAOlB,CAAC;AAEL,eAAO,MAAM,UAAU,GACrB,0BAGG,eAAe,sBACwD,CAAC;AAE7E,eAAO,MAAM,YAAY,GACvB,2BAGG,iBAAiB,sBASlB,CAAC;AAEL,eAAO,MAAM,MAAM,GACjB,oHAUG,WAAW,sBA2BP,CAAC;AAEV,eAAO,MAAM,WAAW,GACtB,2FAQG,gBAAgB,sBAgBX,CAAC"}