@hitachivantara/uikit-react-core 3.52.5

package/README.md

@@ -0,0 +1,11 @@
+# @hitachivantara/uikit-react-core
+
+A collection of React components for the Hitachi Vantara Design System.
+
+## Installation
+
+Install the package in your project directory with:
+
+```sh
+npm install @hitachivantara/uikit-react-core
+```

package/dist/Accordion/Accordion.d.ts

@@ -0,0 +1,43 @@
+import * as React from "react";
+import { StandardProps } from "@material-ui/core";
+import { HvTypographyProps } from "../Typography";
+
+export type HvAccordionClassKey = "root" | "hidden" | "container" | "label" | "disabled";
+
+export interface HvAccordionProps
+  extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvAccordionClassKey> {
+  /**
+   * The accordion label button.
+   */
+  label: string;
+  /**
+   * An object containing props to be passed onto the accordion label button.
+   */
+  labelProps?: HvTypographyProps;
+  /**
+   * Heading Level to apply to accordion button if ´undefined´ the button won't have a header wrapper.
+   */
+  headingLevel?: 1 | 2 | 3 | 4 | 5 | 6;
+  /**
+   * An object containing props to be passed onto the container holding the accordion children.
+   */
+  containerProps?: React.HTMLAttributes<HTMLDivElement>;
+  /**
+   * Is the accordion disabled.
+   */
+  disabled?: boolean;
+  /**
+   * Whether the accordion is open or not, if this property is defined the accordion must be fully controlled.
+   */
+  expanded?: boolean;
+  /**
+   * When uncontrolled, defines the initial expanded state.
+   */
+  defaultExpanded?: boolean;
+  /**
+   * The content of the accordion.
+   */
+  children?: React.ReactNode;
+}
+
+export default function HvAccordion(props: HvAccordionProps): JSX.Element | null;

package/dist/Accordion/Accordion.js

@@ -0,0 +1,246 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _clsx = _interopRequireDefault(require("clsx"));
+
+var _core = require("@material-ui/core");
+
+var _uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+
+var _styles = _interopRequireDefault(require("./styles"));
+
+var _utils = require("../utils");
+
+var _ = require("..");
+
+var _excluded = ["id", "className", "classes", "disabled", "label", "labelProps", "onChange", "children", "expanded", "headingLevel", "defaultExpanded", "containerProps"];
+
+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; }
+
+/**
+ * A accordion is a design element that expands in place to expose hidden information.
+ */
+var HvAccordion = function HvAccordion(_ref) {
+  var id = _ref.id,
+      className = _ref.className,
+      classes = _ref.classes,
+      _ref$disabled = _ref.disabled,
+      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+      label = _ref.label,
+      labelProps = _ref.labelProps,
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? null : _ref$onChange,
+      children = _ref.children,
+      expanded = _ref.expanded,
+      headingLevel = _ref.headingLevel,
+      _ref$defaultExpanded = _ref.defaultExpanded,
+      defaultExpanded = _ref$defaultExpanded === void 0 ? false : _ref$defaultExpanded,
+      containerProps = _ref.containerProps,
+      others = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useControlled = (0, _utils.useControlled)(expanded, Boolean(defaultExpanded)),
+      _useControlled2 = (0, _slicedToArray2.default)(_useControlled, 2),
+      isOpen = _useControlled2[0],
+      setIsOpen = _useControlled2[1];
+
+  var handleAction = (0, _react.useCallback)(function (event) {
+    if (!disabled) {
+      onChange === null || onChange === void 0 ? void 0 : onChange(event, isOpen);
+      setIsOpen(!isOpen);
+      return true;
+    }
+
+    return false;
+  }, [disabled, onChange, isOpen, setIsOpen]);
+  var handleClick = (0, _react.useCallback)(function (event) {
+    handleAction(event);
+    event.preventDefault();
+    event.stopPropagation();
+  }, [handleAction]);
+  var handleKeyDown = (0, _react.useCallback)(function (event) {
+    var isEventHandled = false;
+    var key = event.key;
+
+    if (event.altKey || event.ctrlKey || event.metaKey || event.currentTarget !== event.target) {
+      return;
+    }
+
+    switch (key) {
+      case "Enter":
+      case " ":
+        isEventHandled = handleAction(event);
+        break;
+
+      default:
+        return;
+    }
+
+    if (isEventHandled) {
+      event.preventDefault();
+      event.stopPropagation();
+    }
+  }, [handleAction]);
+  var accordionHeaderId = (0, _utils.setId)(id, "button");
+  var accordionContainer = (0, _utils.setId)(id, "container");
+  var accordionHeader = (0, _react.useMemo)(function () {
+    var color = disabled && ["atmo5"] || undefined;
+    var variantToApply = headingLevel === 1 || headingLevel === 2 ? "sectionTitle" : "highlightText";
+
+    var accordionButton = /*#__PURE__*/_react.default.createElement(_.HvTypography, (0, _extends2.default)({
+      id: accordionHeaderId,
+      component: "div",
+      role: "button",
+      className: (0, _clsx.default)(classes.label, disabled && classes.disabled),
+      tabIndex: 0,
+      onKeyDown: handleKeyDown,
+      onClick: handleClick,
+      variant: variantToApply,
+      "aria-expanded": isOpen,
+      "aria-disabled": disabled
+    }, labelProps), isOpen ? /*#__PURE__*/_react.default.createElement(_uikitReactIcons.DropUpXS, {
+      color: color
+    }) : /*#__PURE__*/_react.default.createElement(_uikitReactIcons.DropDownXS, {
+      color: color
+    }), label);
+
+    var result = headingLevel === undefined ? accordionButton : /*#__PURE__*/_react.default.createElement(_.HvTypography, {
+      component: "h".concat(headingLevel)
+    }, accordionButton);
+    return result;
+  }, [classes, handleClick, handleKeyDown, label, labelProps, accordionHeaderId, disabled, headingLevel, isOpen]);
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+    id: id,
+    className: (0, _clsx.default)(className, classes.root)
+  }, others), accordionHeader, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+    id: accordionContainer,
+    role: "region",
+    "aria-labelledby": accordionHeaderId,
+    className: (0, _clsx.default)(classes.container, !isOpen && classes.hidden)
+  }, containerProps), children));
+};
+
+HvAccordion.propTypes = {
+  /**
+   * Id to be applied to the root node of the accordion.
+   */
+  id: _propTypes.default.string,
+
+  /**
+   * Class names to be applied to the accordion.
+   */
+  className: _propTypes.default.string,
+
+  /**
+   * A Jss Object used to override or extend the styles applied.
+   */
+  classes: _propTypes.default.shape({
+    /**
+     * Styles applied to the component root of the accordion.
+     */
+    root: _propTypes.default.string,
+
+    /**
+     * Styles applied to the content when it is hidden.
+     */
+    hidden: _propTypes.default.string,
+
+    /**
+     * Styles applied to the content when it is hidden.
+     */
+    container: _propTypes.default.string,
+
+    /**
+     * Styles applied to the label button.
+     */
+    label: _propTypes.default.string,
+
+    /**
+     * Styles applied to the label button when it is disabled.
+     */
+    disabled: _propTypes.default.string
+  }).isRequired,
+
+  /**
+   * The accordion label button.
+   */
+  label: _propTypes.default.node.isRequired,
+
+  /**
+   * An object containing props to be passed onto the accordion label button.
+   */
+  labelProps: _propTypes.default.instanceOf(Object),
+
+  /**
+   * The function that will be executed whenever the accordion toggles it will receive the state of the accordion
+   */
+  onChange: _propTypes.default.func,
+
+  /**
+   * Whether the accordion is open or not, if this property is defined the accordion must be fully controlled.
+   */
+  expanded: _propTypes.default.bool,
+
+  /**
+   * When uncontrolled, defines the initial expanded state.
+   */
+  defaultExpanded: _propTypes.default.bool,
+
+  /**
+   * An object containing props to be passed onto container holding the accordion children.
+   */
+  containerProps: _propTypes.default.instanceOf(Object),
+
+  /**
+   * Heading Level to apply to accordion button if ´undefined´ the button won't have a header wrapper.
+   */
+  headingLevel: _propTypes.default.oneOf([1, 2, 3, 4, 5, 6]),
+
+  /**
+   * Is the accordion disabled.
+   */
+  disabled: _propTypes.default.bool,
+
+  /**
+   * The content of the accordion.
+   */
+  children: _propTypes.default.node
+};
+
+var _default = (0, _core.withStyles)(_styles.default, {
+  name: "HvAccordion"
+})(HvAccordion);
+
+exports.default = _default;
+//# sourceMappingURL=Accordion.js.map

package/dist/Accordion/Accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Accordion/Accordion.js"],"names":["HvAccordion","id","className","classes","disabled","label","labelProps","onChange","children","expanded","headingLevel","defaultExpanded","containerProps","others","Boolean","isOpen","setIsOpen","handleAction","event","handleClick","preventDefault","stopPropagation","handleKeyDown","isEventHandled","key","altKey","ctrlKey","metaKey","currentTarget","target","accordionHeaderId","accordionContainer","accordionHeader","color","undefined","variantToApply","accordionButton","result","root","container","hidden","propTypes","PropTypes","string","shape","isRequired","node","instanceOf","Object","func","bool","oneOf","styles","name"],"mappings":"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","sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles } from \"@material-ui/core\";\nimport { DropDownXS, DropUpXS } from \"@hitachivantara/uikit-react-icons\";\nimport styles from \"./styles\";\nimport { setId, useControlled } from \"../utils\";\nimport { HvTypography } from \"..\";\n\n/**\n * A accordion is a design element that expands in place to expose hidden information.\n */\nconst HvAccordion = ({\n  id,\n  className,\n  classes,\n  disabled = false,\n  label,\n  labelProps,\n  onChange = null,\n  children,\n  expanded,\n  headingLevel,\n  defaultExpanded = false,\n  containerProps,\n  ...others\n}) => {\n  const [isOpen, setIsOpen] = useControlled(expanded, Boolean(defaultExpanded));\n\n  const handleAction = useCallback(\n    (event) => {\n      if (!disabled) {\n        onChange?.(event, isOpen);\n        setIsOpen(!isOpen);\n        return true;\n      }\n      return false;\n    },\n    [disabled, onChange, isOpen, setIsOpen]\n  );\n\n  const handleClick = useCallback(\n    (event) => {\n      handleAction(event);\n      event.preventDefault();\n      event.stopPropagation();\n    },\n    [handleAction]\n  );\n\n  const handleKeyDown = useCallback(\n    (event) => {\n      let isEventHandled = false;\n      const { key } = event;\n\n      if (event.altKey || event.ctrlKey || event.metaKey || event.currentTarget !== event.target) {\n        return;\n      }\n      switch (key) {\n        case \"Enter\":\n        case \" \":\n          isEventHandled = handleAction(event);\n          break;\n        default:\n          return;\n      }\n\n      if (isEventHandled) {\n        event.preventDefault();\n        event.stopPropagation();\n      }\n    },\n    [handleAction]\n  );\n\n  const accordionHeaderId = setId(id, \"button\");\n  const accordionContainer = setId(id, \"container\");\n  const accordionHeader = useMemo(() => {\n    const color = (disabled && [\"atmo5\"]) || undefined;\n    const variantToApply =\n      headingLevel === 1 || headingLevel === 2 ? \"sectionTitle\" : \"highlightText\";\n    const accordionButton = (\n      <HvTypography\n        id={accordionHeaderId}\n        component=\"div\"\n        role=\"button\"\n        className={clsx(classes.label, {\n          [classes.disabled]: disabled,\n        })}\n        tabIndex={0}\n        onKeyDown={handleKeyDown}\n        onClick={handleClick}\n        variant={variantToApply}\n        aria-expanded={isOpen}\n        aria-disabled={disabled}\n        {...labelProps}\n      >\n        {isOpen ? <DropUpXS color={color} /> : <DropDownXS color={color} />}\n        {label}\n      </HvTypography>\n    );\n    const result =\n      headingLevel === undefined ? (\n        accordionButton\n      ) : (\n        <HvTypography component={`h${headingLevel}`}>{accordionButton}</HvTypography>\n      );\n    return result;\n  }, [\n    classes,\n    handleClick,\n    handleKeyDown,\n    label,\n    labelProps,\n    accordionHeaderId,\n    disabled,\n    headingLevel,\n    isOpen,\n  ]);\n\n  return (\n    <div id={id} className={clsx(className, classes.root)} {...others}>\n      {accordionHeader}\n      <div\n        id={accordionContainer}\n        role=\"region\"\n        aria-labelledby={accordionHeaderId}\n        className={clsx(classes.container, { [classes.hidden]: !isOpen })}\n        {...containerProps}\n      >\n        {children}\n      </div>\n    </div>\n  );\n};\n\nHvAccordion.propTypes = {\n  /**\n   * Id to be applied to the root node of the accordion.\n   */\n  id: PropTypes.string,\n  /**\n   * Class names to be applied to the accordion.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root of the accordion.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the content when it is hidden.\n     */\n    hidden: PropTypes.string,\n    /**\n     * Styles applied to the content when it is hidden.\n     */\n    container: PropTypes.string,\n    /**\n     * Styles applied to the label button.\n     */\n    label: PropTypes.string,\n    /**\n     * Styles applied to the label button when it is disabled.\n     */\n    disabled: PropTypes.string,\n  }).isRequired,\n  /**\n   * The accordion label button.\n   */\n  label: PropTypes.node.isRequired,\n  /**\n   * An object containing props to be passed onto the accordion label button.\n   */\n  labelProps: PropTypes.instanceOf(Object),\n  /**\n   * The function that will be executed whenever the accordion toggles it will receive the state of the accordion\n   */\n  onChange: PropTypes.func,\n  /**\n   * Whether the accordion is open or not, if this property is defined the accordion must be fully controlled.\n   */\n  expanded: PropTypes.bool,\n  /**\n   * When uncontrolled, defines the initial expanded state.\n   */\n  defaultExpanded: PropTypes.bool,\n  /**\n   * An object containing props to be passed onto container holding the accordion children.\n   */\n  containerProps: PropTypes.instanceOf(Object),\n  /**\n   * Heading Level to apply to accordion button if ´undefined´ the button won't have a header wrapper.\n   */\n  headingLevel: PropTypes.oneOf([1, 2, 3, 4, 5, 6]),\n  /**\n   * Is the accordion disabled.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * The content of the accordion.\n   */\n  children: PropTypes.node,\n};\n\nexport default withStyles(styles, { name: \"HvAccordion\" })(HvAccordion);\n"],"file":"Accordion.js"}

package/dist/Accordion/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./Accordion";
+export * from "./Accordion";

package/dist/Accordion/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _Accordion.default;
+  }
+});
+
+var _Accordion = _interopRequireDefault(require("./Accordion"));
+//# sourceMappingURL=index.js.map

package/dist/Accordion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Accordion/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA","sourcesContent":["export { default } from \"./Accordion\";\n"],"file":"index.js"}

package/dist/Accordion/styles.js

@@ -0,0 +1,84 @@
+"use strict";
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _styles = require("../Focus/styles");
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+var hover = function hover(theme) {
+  return {
+    background: theme.hv.palette.atmosphere.atmo3
+  };
+};
+
+var styles = function styles(theme) {
+  return {
+    root: {
+      "& + $root": {
+        paddingTop: 8
+      }
+    },
+    nav: {},
+    container: {
+      paddingTop: 8,
+      height: "auto"
+    },
+    hidden: {
+      height: 0,
+      display: "none"
+    },
+    label: {
+      width: "100%",
+      display: "flex",
+      justifyContent: "flex-start",
+      alignItems: "center",
+      height: "32px",
+      // hover
+      ":not($disabled)&:hover": hover(theme),
+      // focus
+      ":not($disabled)&:focus": hover(theme),
+      "&[disabled], &:active": {
+        outline: "none"
+      },
+      "&:focus": {
+        outline: "none"
+      },
+      "&.focus-visible": _objectSpread({}, _styles.outlineStyles),
+      // cursor
+      cursor: "pointer",
+      "&$disabled": {
+        cursor: "not-allowed",
+        color: theme.hv.palette.atmosphere.atmo5
+      }
+    },
+    disabled: {}
+  };
+};
+
+var _default = styles;
+exports.default = _default;
+//# sourceMappingURL=styles.js.map

package/dist/Accordion/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/Accordion/styles.js"],"names":["hover","theme","background","hv","palette","atmosphere","atmo3","styles","root","paddingTop","nav","container","height","hidden","display","label","width","justifyContent","alignItems","outline","outlineStyles","cursor","color","atmo5","disabled"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;AAEA,IAAMA,KAAK,GAAG,SAARA,KAAQ,CAACC,KAAD;AAAA,SAAY;AACxBC,IAAAA,UAAU,EAAED,KAAK,CAACE,EAAN,CAASC,OAAT,CAAiBC,UAAjB,CAA4BC;AADhB,GAAZ;AAAA,CAAd;;AAIA,IAAMC,MAAM,GAAG,SAATA,MAAS,CAACN,KAAD;AAAA,SAAY;AACzBO,IAAAA,IAAI,EAAE;AACJ,mBAAa;AACXC,QAAAA,UAAU,EAAE;AADD;AADT,KADmB;AAMzBC,IAAAA,GAAG,EAAE,EANoB;AAOzBC,IAAAA,SAAS,EAAE;AACTF,MAAAA,UAAU,EAAE,CADH;AAETG,MAAAA,MAAM,EAAE;AAFC,KAPc;AAWzBC,IAAAA,MAAM,EAAE;AACND,MAAAA,MAAM,EAAE,CADF;AAENE,MAAAA,OAAO,EAAE;AAFH,KAXiB;AAezBC,IAAAA,KAAK,EAAE;AACLC,MAAAA,KAAK,EAAE,MADF;AAELF,MAAAA,OAAO,EAAE,MAFJ;AAGLG,MAAAA,cAAc,EAAE,YAHX;AAILC,MAAAA,UAAU,EAAE,QAJP;AAKLN,MAAAA,MAAM,EAAE,MALH;AAOL;AACA,gCAA0BZ,KAAK,CAACC,KAAD,CAR1B;AAUL;AACA,gCAA0BD,KAAK,CAACC,KAAD,CAX1B;AAaL,+BAAyB;AACvBkB,QAAAA,OAAO,EAAE;AADc,OAbpB;AAiBL,iBAAW;AACTA,QAAAA,OAAO,EAAE;AADA,OAjBN;AAqBL,2CACKC,qBADL,CArBK;AAyBL;AACAC,MAAAA,MAAM,EAAE,SA1BH;AA2BL,oBAAc;AACZA,QAAAA,MAAM,EAAE,aADI;AAEZC,QAAAA,KAAK,EAAErB,KAAK,CAACE,EAAN,CAASC,OAAT,CAAiBC,UAAjB,CAA4BkB;AAFvB;AA3BT,KAfkB;AA+CzBC,IAAAA,QAAQ,EAAE;AA/Ce,GAAZ;AAAA,CAAf;;eAkDejB,M","sourcesContent":["import { outlineStyles } from \"../Focus/styles\";\n\nconst hover = (theme) => ({\n  background: theme.hv.palette.atmosphere.atmo3,\n});\n\nconst styles = (theme) => ({\n  root: {\n    \"& + $root\": {\n      paddingTop: 8,\n    },\n  },\n  nav: {},\n  container: {\n    paddingTop: 8,\n    height: \"auto\",\n  },\n  hidden: {\n    height: 0,\n    display: \"none\",\n  },\n  label: {\n    width: \"100%\",\n    display: \"flex\",\n    justifyContent: \"flex-start\",\n    alignItems: \"center\",\n    height: \"32px\",\n\n    // hover\n    \":not($disabled)&:hover\": hover(theme),\n\n    // focus\n    \":not($disabled)&:focus\": hover(theme),\n\n    \"&[disabled], &:active\": {\n      outline: \"none\",\n    },\n\n    \"&:focus\": {\n      outline: \"none\",\n    },\n\n    \"&.focus-visible\": {\n      ...outlineStyles,\n    },\n\n    // cursor\n    cursor: \"pointer\",\n    \"&$disabled\": {\n      cursor: \"not-allowed\",\n      color: theme.hv.palette.atmosphere.atmo5,\n    },\n  },\n  disabled: {},\n});\n\nexport default styles;\n"],"file":"styles.js"}

package/dist/ActionBar/ActionBar.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { StandardProps } from "@material-ui/core";
+
+export type HvActionContainerClassKey = "root";
+
+type HvActionContainerProps = StandardProps<React.HTMLAttributes<HTMLDivElement>, HvActionContainerClassKey>
+
+export default function HvActionContainer(props: HvActionContainerProps): JSX.Element | null;

package/dist/ActionBar/ActionBar.js

@@ -0,0 +1,73 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _clsx = _interopRequireDefault(require("clsx"));
+
+var _core = require("@material-ui/core");
+
+var _styles = _interopRequireDefault(require("./styles"));
+
+var _excluded = ["classes", "className", "id", "children"];
+
+/**
+ * This component acts as a container for the Action Bar pattern.
+ */
+var HvActionBar = function HvActionBar(props) {
+  var classes = props.classes,
+      className = props.className,
+      id = props.id,
+      children = props.children,
+      others = (0, _objectWithoutProperties2.default)(props, _excluded);
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+    id: id,
+    className: (0, _clsx.default)(classes.root, className)
+  }, others), children);
+};
+
+HvActionBar.propTypes = {
+  /**
+   * Class names to be applied.
+   */
+  className: _propTypes.default.string,
+
+  /**
+   * Id to be applied to the root node.
+   */
+  id: _propTypes.default.string,
+
+  /**
+   * A Jss Object used to override or extend the styles applied.
+   */
+  classes: _propTypes.default.shape({
+    /**
+     * Styles applied to the component root class.
+     */
+    root: _propTypes.default.string
+  }).isRequired,
+
+  /**
+   * The content of the action container.
+   */
+  children: _propTypes.default.node.isRequired
+};
+
+var _default = (0, _core.withStyles)(_styles.default, {
+  name: "HvActionBar"
+})(HvActionBar);
+
+exports.default = _default;
+//# sourceMappingURL=ActionBar.js.map

package/dist/ActionBar/ActionBar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ActionBar/ActionBar.js"],"names":["HvActionBar","props","classes","className","id","children","others","root","propTypes","PropTypes","string","shape","isRequired","node","styles","name"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;AAEA;AACA;AACA;AACA,IAAMA,WAAW,GAAG,SAAdA,WAAc,CAACC,KAAD,EAAW;AAC7B,MAAQC,OAAR,GAAwDD,KAAxD,CAAQC,OAAR;AAAA,MAAiBC,SAAjB,GAAwDF,KAAxD,CAAiBE,SAAjB;AAAA,MAA4BC,EAA5B,GAAwDH,KAAxD,CAA4BG,EAA5B;AAAA,MAAgCC,QAAhC,GAAwDJ,KAAxD,CAAgCI,QAAhC;AAAA,MAA6CC,MAA7C,0CAAwDL,KAAxD;AAEA,sBACE;AAAK,IAAA,EAAE,EAAEG,EAAT;AAAa,IAAA,SAAS,EAAE,mBAAKF,OAAO,CAACK,IAAb,EAAmBJ,SAAnB;AAAxB,KAA2DG,MAA3D,GACGD,QADH,CADF;AAKD,CARD;;AAUAL,WAAW,CAACQ,SAAZ,GAAwB;AACtB;AACF;AACA;AACEL,EAAAA,SAAS,EAAEM,mBAAUC,MAJC;;AAKtB;AACF;AACA;AACEN,EAAAA,EAAE,EAAEK,mBAAUC,MARQ;;AAStB;AACF;AACA;AACER,EAAAA,OAAO,EAAEO,mBAAUE,KAAV,CAAgB;AACvB;AACJ;AACA;AACIJ,IAAAA,IAAI,EAAEE,mBAAUC;AAJO,GAAhB,EAKNE,UAjBmB;;AAkBtB;AACF;AACA;AACEP,EAAAA,QAAQ,EAAEI,mBAAUI,IAAV,CAAeD;AArBH,CAAxB;;eAwBe,sBAAWE,eAAX,EAAmB;AAAEC,EAAAA,IAAI,EAAE;AAAR,CAAnB,EAA4Cf,WAA5C,C","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles } from \"@material-ui/core\";\nimport styles from \"./styles\";\n\n/**\n * This component acts as a container for the Action Bar pattern.\n */\nconst HvActionBar = (props) => {\n  const { classes, className, id, children, ...others } = props;\n\n  return (\n    <div id={id} className={clsx(classes.root, className)} {...others}>\n      {children}\n    </div>\n  );\n};\n\nHvActionBar.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * Id to be applied to the root node.\n   */\n  id: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n  }).isRequired,\n  /**\n   * The content of the action container.\n   */\n  children: PropTypes.node.isRequired,\n};\n\nexport default withStyles(styles, { name: \"HvActionBar\" })(HvActionBar);\n"],"file":"ActionBar.js"}

package/dist/ActionBar/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./ActionBar";
+export * from "./ActionBar";

package/dist/ActionBar/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _ActionBar.default;
+  }
+});
+
+var _ActionBar = _interopRequireDefault(require("./ActionBar"));
+//# sourceMappingURL=index.js.map

package/dist/ActionBar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ActionBar/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA","sourcesContent":["export { default } from \"./ActionBar\";\n"],"file":"index.js"}

package/dist/ActionBar/styles.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var styles = function styles(theme) {
+  return {
+    root: {
+      width: "100%",
+      height: "75px",
+      padding: theme.hv.spacing.sm,
+      borderTop: "3px solid ".concat(theme.hv.palette.atmosphere.atmo2),
+      display: "flex",
+      justifyContent: "flex-end"
+    }
+  };
+};
+
+var _default = styles;
+exports.default = _default;
+//# sourceMappingURL=styles.js.map

package/dist/ActionBar/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ActionBar/styles.js"],"names":["styles","theme","root","width","height","padding","hv","spacing","sm","borderTop","palette","atmosphere","atmo2","display","justifyContent"],"mappings":";;;;;;;AAAA,IAAMA,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBC,IAAAA,IAAI,EAAE;AACJC,MAAAA,KAAK,EAAE,MADH;AAEJC,MAAAA,MAAM,EAAE,MAFJ;AAGJC,MAAAA,OAAO,EAAEJ,KAAK,CAACK,EAAN,CAASC,OAAT,CAAiBC,EAHtB;AAIJC,MAAAA,SAAS,sBAAeR,KAAK,CAACK,EAAN,CAASI,OAAT,CAAiBC,UAAjB,CAA4BC,KAA3C,CAJL;AAKJC,MAAAA,OAAO,EAAE,MALL;AAMJC,MAAAA,cAAc,EAAE;AANZ;AADmB,GAAZ;AAAA,CAAf;;eAWed,M","sourcesContent":["const styles = (theme) => ({\n  root: {\n    width: \"100%\",\n    height: \"75px\",\n    padding: theme.hv.spacing.sm,\n    borderTop: `3px solid ${theme.hv.palette.atmosphere.atmo2}`,\n    display: \"flex\",\n    justifyContent: \"flex-end\",\n  },\n});\n\nexport default styles;\n"],"file":"styles.js"}

package/dist/ActionsGeneric/ActionsGeneric.d.ts

@@ -0,0 +1,43 @@
+import * as React from "react";
+import { StandardProps } from "@material-ui/core";
+import { HvButtonCategories } from "../Button";
+
+export type ActionGeneric = {
+  id: string;
+  label: string;
+  icon?: React.ReactNode | ((params: { isDisabled?: boolean }) => React.ReactNode);
+  disabled?: boolean;
+};
+
+export interface HvActionsGenericCommonProps {
+  /**
+   * Button category.
+   */
+  category?: HvButtonCategories;
+  /**
+   * The renderable content inside the actions slot of the footer,
+   * or an Array of actions `{id, label, icon, disabled}`
+   */
+  actions?: React.ReactNode | ActionGeneric[];
+  /**
+   *  The callback function ran when an action is triggered, receiving `action` as param
+   */
+  actionsCallback?: (event: Event, id: string, action: ActionGeneric) => void;
+  /**
+   *  The number of maximum visible actions before they're collapsed into a `DropDownMenu`.
+   */
+  maxVisibleActions?: number;
+}
+
+export type HvActionsGenericClassKey =
+  | "button"
+  | "actionContainer"
+  | "dropDownMenu"
+  | "dropDownMenuButton"
+  | "dropDownMenuButtonSelected";
+
+export interface HvActionsGenericProps
+  extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvActionsGenericClassKey>,
+    HvActionsGenericCommonProps {}
+
+export default function HvActionsGeneric(props: HvActionsGenericProps): JSX.Element | null;