@dfds-ui/react-components 1.1.0-alpha.41ec73dd → 1.1.0-alpha.67971614

package/cjs/app-bar/AppBarContext.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+declare type AppBarState = {
+    drawerOpen: boolean;
+    setDrawerOpen: React.Dispatch<React.SetStateAction<boolean>>;
+    height: number;
+    setHeight: React.Dispatch<React.SetStateAction<number>>;
+};
+export declare const AppBarProvider: React.FC;
+export declare const useAppBarContext: () => AppBarState;
+export {};

package/cjs/app-bar/AppBarContext.js

@@ -0,0 +1,65 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useAppBarContext = exports.AppBarProvider = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _react2 = require("@emotion/react");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+const AppBarContext = /*#__PURE__*/React.createContext(undefined);
+
+const AppBarProvider = ({
+  children
+}) => {
+  const _React$useState = React.useState(false),
+        _React$useState2 = _slicedToArray(_React$useState, 2),
+        drawerOpen = _React$useState2[0],
+        setDrawerOpen = _React$useState2[1];
+
+  const _React$useState3 = React.useState(0),
+        _React$useState4 = _slicedToArray(_React$useState3, 2),
+        height = _React$useState4[0],
+        setHeight = _React$useState4[1];
+
+  return (0, _react2.jsx)(AppBarContext.Provider, {
+    value: {
+      drawerOpen,
+      setDrawerOpen,
+      height,
+      setHeight
+    }
+  }, children);
+};
+
+exports.AppBarProvider = AppBarProvider;
+
+const useAppBarContext = () => {
+  const context = React.useContext(AppBarContext);
+
+  if (context === undefined) {
+    throw new Error('useAppBarContext must be used within a AppBarProvider');
+  }
+
+  return context;
+};
+
+exports.useAppBarContext = useAppBarContext;

package/cjs/app-bar/AppBarDrawer.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const AppBarDrawer: React.FC;
+export default AppBarDrawer;

package/cjs/app-bar/AppBarDrawer.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+
+var _theme = require("@dfds-ui/theme");
+
+var _Drawer = _interopRequireDefault(require("@material-ui/core/Drawer"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _ = require("./");
+
+var _react2 = require("@emotion/react");
+
+const _excluded = ["children"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+const APPBAR_HEIGHT = '3rem';
+const StyledDrawer = ( /*#__PURE__*/0, _base.default)(_Drawer.default, process.env.NODE_ENV === "production" ? {
+  target: "evgyi4x0"
+} : {
+  target: "evgyi4x0",
+  label: "StyledDrawer"
+})("top:", APPBAR_HEIGHT, "!important;height:calc(100vh - ", APPBAR_HEIGHT, ");.MuiBackdrop-root{top:", APPBAR_HEIGHT, ";opacity:0!important;}.MuiDrawer-paper{top:", APPBAR_HEIGHT, ";box-shadow:", _theme.theme.elevation['8'], ";height:calc(100vh - ", APPBAR_HEIGHT, ");}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9hcHAtYmFyL0FwcEJhckRyYXdlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBU21DIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9hcHAtYmFyL0FwcEJhckRyYXdlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyB0aGVtZSB9IGZyb20gJ0BkZmRzLXVpL3RoZW1lJ1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgRHJhd2VyIGZyb20gJ0BtYXRlcmlhbC11aS9jb3JlL0RyYXdlcidcbmltcG9ydCAqIGFzIFJlYWN0IGZyb20gJ3JlYWN0J1xuXG5pbXBvcnQgeyB1c2VBcHBCYXJDb250ZXh0IH0gZnJvbSAnLi8nXG5cbmNvbnN0IEFQUEJBUl9IRUlHSFQgPSAnM3JlbSdcblxuY29uc3QgU3R5bGVkRHJhd2VyID0gc3R5bGVkKERyYXdlcilgXG4gIC8qIHN0eWxlbGludC1kaXNhYmxlICovXG4gIHRvcDogJHtBUFBCQVJfSEVJR0hUfSAhaW1wb3J0YW50O1xuICAvKiBzdHlsZWxpbnQtZW5hYmxlICovXG5cbiAgaGVpZ2h0OiBjYWxjKDEwMHZoIC0gJHtBUFBCQVJfSEVJR0hUfSk7XG5cbiAgLk11aUJhY2tkcm9wLXJvb3Qge1xuICAgIHRvcDogJHtBUFBCQVJfSEVJR0hUfTtcbiAgICAvKiBzdHlsZWxpbnQtZGlzYWJsZSAqL1xuICAgIG9wYWNpdHk6IDAgIWltcG9ydGFudDtcbiAgICAvKiBzdHlsZWxpbnQtZW5hYmxlICovXG4gIH1cblxuICAuTXVpRHJhd2VyLXBhcGVyIHtcbiAgICB0b3A6ICR7QVBQQkFSX0hFSUdIVH07XG4gICAgYm94LXNoYWRvdzogJHt0aGVtZS5lbGV2YXRpb25bJzgnXX07XG4gICAgaGVpZ2h0OiBjYWxjKDEwMHZoIC0gJHtBUFBCQVJfSEVJR0hUfSk7XG4gIH1cbmBcblxuY29uc3QgQXBwQmFyRHJhd2VyOiBSZWFjdC5GQyA9ICh7IGNoaWxkcmVuLCAuLi5wcm9wcyB9KSA9PiB7XG4gIGNvbnN0IHsgZHJhd2VyT3Blbiwgc2V0RHJhd2VyT3BlbiB9ID0gdXNlQXBwQmFyQ29udGV4dCgpXG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkRHJhd2VyIG9wZW49e2RyYXdlck9wZW59IG9uQ2xvc2U9eygpID0+IHNldERyYXdlck9wZW4oZmFsc2UpfSB7Li4ucHJvcHN9PlxuICAgICAge2NoaWxkcmVufVxuICAgIDwvU3R5bGVkRHJhd2VyPlxuICApXG59XG5cbmV4cG9ydCBkZWZhdWx0IEFwcEJhckRyYXdlclxuIl19 */"));
+
+const AppBarDrawer = _ref => {
+  let children = _ref.children,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  const _useAppBarContext = (0, _.useAppBarContext)(),
+        drawerOpen = _useAppBarContext.drawerOpen,
+        setDrawerOpen = _useAppBarContext.setDrawerOpen;
+
+  return (0, _react2.jsx)(StyledDrawer, _extends({
+    open: drawerOpen,
+    onClose: () => setDrawerOpen(false)
+  }, props), children);
+};
+
+var _default = AppBarDrawer;
+exports.default = _default;

package/cjs/app-bar/AppBarIconButton.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+declare type AppBarIconButtonProps = {
+    isActive?: boolean;
+    ariaLabel: string;
+    icon: React.ElementType;
+    showTooltip?: boolean;
+    onClick?: (event: React.MouseEvent) => void;
+};
+declare const AppBarIconButton: React.FC<AppBarIconButtonProps>;
+export default AppBarIconButton;

package/cjs/app-bar/AppBarIconButton.js

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _button = require("../button");
+
+var _theme = require("@dfds-ui/theme");
+
+var _react2 = require("@emotion/react");
+
+const _excluded = ["isActive", "ariaLabel", "showTooltip"];
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+function iconButtonStyles({
+  isActive
+}) {
+  return /*#__PURE__*/(0, _react2.css)("height:100%;font-size:1.5rem;position:relative;color:", _theme.theme.colors.primary.main, ";padding:0 0.75rem;&:hover{color:", _theme.theme.colors.primary.main, ";}&:active,&:hover,&:focus{outline:none;border:none;padding:0 0.75rem;}&:active{color:", _theme.theme.colors.secondary.main, ";}", _theme.theme.states.overlay(isActive, {
+    color: _theme.theme.colors.secondary.main
+  }), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:iconButtonStyles;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9hcHAtYmFyL0FwcEJhckljb25CdXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWNZIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9hcHAtYmFyL0FwcEJhckljb25CdXR0b24udHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgSWNvbkJ1dHRvbiB9IGZyb20gJy4uL2J1dHRvbidcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSAnQGRmZHMtdWkvdGhlbWUnXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCdcblxudHlwZSBBcHBCYXJJY29uQnV0dG9uUHJvcHMgPSB7XG4gIGlzQWN0aXZlPzogYm9vbGVhblxuICBhcmlhTGFiZWw6IHN0cmluZ1xuICBpY29uOiBSZWFjdC5FbGVtZW50VHlwZVxuICBzaG93VG9vbHRpcD86IGJvb2xlYW5cbiAgb25DbGljaz86IChldmVudDogUmVhY3QuTW91c2VFdmVudCkgPT4gdm9pZFxufVxuXG5mdW5jdGlvbiBpY29uQnV0dG9uU3R5bGVzKHsgaXNBY3RpdmUgfTogeyBpc0FjdGl2ZT86IGJvb2xlYW4gfSkge1xuICByZXR1cm4gY3NzYFxuICAgIGhlaWdodDogMTAwJTtcbiAgICBmb250LXNpemU6IDEuNXJlbTtcbiAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgY29sb3I6ICR7dGhlbWUuY29sb3JzLnByaW1hcnkubWFpbn07XG4gICAgcGFkZGluZzogMCAwLjc1cmVtO1xuXG4gICAgJjpob3ZlciB7XG4gICAgICBjb2xvcjogJHt0aGVtZS5jb2xvcnMucHJpbWFyeS5tYWlufTtcbiAgICB9XG5cbiAgICAmOmFjdGl2ZSxcbiAgICAmOmhvdmVyLFxuICAgICY6Zm9jdXMge1xuICAgICAgb3V0bGluZTogbm9uZTtcbiAgICAgIGJvcmRlcjogbm9uZTtcbiAgICAgIHBhZGRpbmc6IDAgMC43NXJlbTtcbiAgICB9XG5cbiAgICAmOmFjdGl2ZSB7XG4gICAgICBjb2xvcjogJHt0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5Lm1haW59O1xuICAgIH1cblxuICAgICR7dGhlbWUuc3RhdGVzLm92ZXJsYXkoaXNBY3RpdmUsIHtcbiAgICAgIGNvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5Lm1haW4sXG4gICAgfSl9XG4gIGBcbn1cblxuY29uc3QgQXBwQmFySWNvbkJ1dHRvbjogUmVhY3QuRkM8QXBwQmFySWNvbkJ1dHRvblByb3BzPiA9ICh7IGlzQWN0aXZlLCBhcmlhTGFiZWwsIHNob3dUb29sdGlwID0gdHJ1ZSwgLi4ucmVzdCB9KSA9PiB7XG4gIHJldHVybiAoXG4gICAgPEljb25CdXR0b25cbiAgICAgIGNzcz17aWNvbkJ1dHRvblN0eWxlcyh7IGlzQWN0aXZlOiBpc0FjdGl2ZSB9KX1cbiAgICAgIGFyaWFMYWJlbD17YXJpYUxhYmVsfVxuICAgICAgZGlzYWJsZVRvb2x0aXA9eyFzaG93VG9vbHRpcH1cbiAgICAgIHsuLi5yZXN0fVxuICAgIC8+XG4gIClcbn1cblxuZXhwb3J0IGRlZmF1bHQgQXBwQmFySWNvbkJ1dHRvblxuIl19 */");
+}
+
+const AppBarIconButton = _ref => {
+  let isActive = _ref.isActive,
+      ariaLabel = _ref.ariaLabel,
+      _ref$showTooltip = _ref.showTooltip,
+      showTooltip = _ref$showTooltip === void 0 ? true : _ref$showTooltip,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return (0, _react2.jsx)(_button.IconButton, _extends({
+    css: iconButtonStyles({
+      isActive: isActive
+    }),
+    ariaLabel: ariaLabel,
+    disableTooltip: !showTooltip
+  }, rest));
+};
+
+var _default = AppBarIconButton;
+exports.default = _default;

package/cjs/app-bar/AppBarItem.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+export declare type AppBarItemProps = {
+    id: string;
+    Icon?: React.ElementType;
+    LeadingIcon?: React.ElementType;
+    TrailingIcon?: React.ElementType;
+    title: string;
+    divider?: 'start' | 'end' | 'both';
+    children?: React.ReactNode;
+    as?: React.ElementType;
+    onClick?: () => void;
+    placement?: 'bottom-start' | 'bottom-end';
+    isActive?: boolean;
+};
+export declare const MenuPopOverContext: React.Context<{
+    handlePopoverClose: () => void;
+} | undefined>;
+export declare const AppBarPopper: import("@emotion/styled").StyledComponent<import("@material-ui/core/Popper").PopperProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const AppBarItem: React.FC<AppBarItemProps & JSX.IntrinsicElements['a']>;