@hitachivantara/uikit-react-core 3.52.5

package/dist/modern/RadioGroup/RadioGroup.js

@@ -0,0 +1,297 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["classes", "className", "id", "name", "value", "defaultValue", "required", "readOnly", "disabled", "label", "aria-label", "aria-labelledby", "description", "aria-describedby", "onChange", "status", "statusMessage", "aria-errormessage", "orientation", "children"];
+
+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) { _defineProperty(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; }
+
+import "core-js/modules/web.dom-collections.iterator.js";
+import React, { useCallback, useMemo } from "react";
+import PropTypes from "prop-types";
+import clsx from "clsx";
+import { withStyles } from "@material-ui/core";
+import { HvFormElement, HvLabel, HvInfoMessage, HvWarningText, useUniqueId } from "..";
+import { setId, useControlled } from "../utils";
+import styles from "./styles";
+
+const getValueFromSelectedChildren = children => {
+  const childrenArray = React.Children.toArray(children);
+  const childrenCount = childrenArray.length;
+
+  for (let i = 0; i !== childrenCount; i += 1) {
+    const child = childrenArray[i];
+    const childIsControlled = child.props.checked !== undefined;
+    const childIsSelected = childIsControlled ? child.props.checked : child.props.defaultChecked;
+
+    if (childIsSelected) {
+      return child.props.value;
+    }
+  }
+
+  return null;
+};
+/**
+ * A group of radio buttons.
+ *
+ * A radio group is a type of selection list that can only have a single entry checked at any one time.
+ */
+
+
+const HvRadioGroup = props => {
+  const {
+    classes,
+    className,
+    id,
+    name,
+    value: valueProp,
+    defaultValue,
+    required = false,
+    readOnly = false,
+    disabled = false,
+    label,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    description,
+    "aria-describedby": ariaDescribedBy,
+    onChange,
+    status,
+    statusMessage,
+    "aria-errormessage": ariaErrorMessage,
+    orientation = "vertical",
+    children
+  } = props,
+        others = _objectWithoutProperties(props, _excluded);
+
+  const elementId = useUniqueId(id, "hvradiogroup");
+  const [value, setValue] = useControlled(valueProp, defaultValue !== undefined ? defaultValue : // when uncontrolled and no default value is given,
+  // extract the initial selected values from the children own state
+  () => getValueFromSelectedChildren(children));
+  const onChildChangeInterceptor = useCallback((childOnChange, evt, isChecked, newValue) => {
+    childOnChange === null || childOnChange === void 0 ? void 0 : childOnChange(evt, isChecked, newValue);
+    onChange === null || onChange === void 0 ? void 0 : onChange(evt, newValue);
+    setValue(newValue);
+  }, [onChange, setValue]);
+  const modifiedChildren = useMemo(() => {
+    return React.Children.map(children, child => {
+      var _child$props$value;
+
+      const childValue = (_child$props$value = child.props.value) !== null && _child$props$value !== void 0 ? _child$props$value : "on";
+      const childIsSelected = childValue === value;
+      return /*#__PURE__*/React.cloneElement(child, {
+        checked: childIsSelected,
+        name: child.props.name || name || elementId,
+        onChange: (evt, isChecked, newValue) => onChildChangeInterceptor(child.props.onChange, evt, isChecked, newValue),
+        inputProps: _objectSpread(_objectSpread({}, child.props.inputProps), {}, {
+          // set the required attribute directly in the input
+          // the radio form element context shouldn't be aware so the
+          // label doesn't show redundant asterisk
+          required
+        }),
+        disabled: disabled || child.props.disabled,
+        readOnly: readOnly || child.props.readOnly
+      });
+    });
+  }, [children, disabled, elementId, name, onChildChangeInterceptor, readOnly, required, value]); // the error message area will only be created if:
+  // - an external element that provides an error message isn't identified via aria-errormessage AND
+  //   - both status and statusMessage properties are being controlled OR
+  //   - status is uncontrolled and required is true
+
+  const canShowError = ariaErrorMessage == null && (status !== undefined && statusMessage !== undefined || status === undefined && required);
+  const errorMessageId = canShowError ? setId(elementId, "error") : ariaErrorMessage;
+  return /*#__PURE__*/React.createElement(HvFormElement, {
+    id: id,
+    name: name,
+    status: status || "standBy",
+    disabled: disabled,
+    required: required,
+    readOnly: readOnly,
+    className: clsx(className, classes.root)
+  }, label && /*#__PURE__*/React.createElement(HvLabel, {
+    id: setId(elementId, "label"),
+    label: label,
+    className: clsx(classes.label)
+  }), description && /*#__PURE__*/React.createElement(HvInfoMessage, {
+    id: setId(elementId, "description")
+  }, description), /*#__PURE__*/React.createElement("div", _extends({
+    role: "radiogroup",
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy || label && setId(elementId, "label"),
+    "aria-invalid": status === "invalid" ? true : undefined,
+    "aria-errormessage": status === "invalid" ? errorMessageId : undefined,
+    "aria-describedby": [description && setId(elementId, "description"), ariaDescribedBy].join(" ").trim() || undefined,
+    className: clsx(classes.group, {
+      "vertical": classes.vertical,
+      "horizontal": classes.horizontal
+    }[orientation], status === "invalid" && classes.invalid)
+  }, others), modifiedChildren), canShowError && /*#__PURE__*/React.createElement(HvWarningText, {
+    id: setId(elementId, "error"),
+    disableBorder: true,
+    className: classes.error
+  }, statusMessage));
+};
+
+HvRadioGroup.propTypes = {
+  /**
+   * Class names to be applied.
+   */
+  className: PropTypes.string,
+
+  /**
+   * A Jss Object used to override or extend the component styles applied.
+   */
+  classes: PropTypes.shape({
+    /**
+     * Styles applied to the component root class.
+     */
+    root: PropTypes.string,
+
+    /**
+     * Styles applied to the label.
+     */
+    label: PropTypes.string,
+
+    /**
+     * Styles applied to the radio button group.
+     */
+    group: PropTypes.string,
+
+    /**
+     * Styles applied to the radio button group when orientation is vertical.
+     */
+    vertical: PropTypes.string,
+
+    /**
+     * Styles applied to the radio button group when orientation is horizontal.
+     */
+    horizontal: PropTypes.string,
+
+    /**
+     * Styles applied to the radio button group when validation status is invalid.
+     */
+    invalid: PropTypes.string,
+
+    /**
+     * Styles applied to the error area.
+     */
+    error: PropTypes.string
+  }).isRequired,
+
+  /**
+   * Id to be applied to the form element root node.
+   */
+  id: PropTypes.string,
+
+  /**
+   * The form element name.
+   * It is propagated to the children radio buttons, unless they already have one (which they shouldn't).
+   */
+  name: PropTypes.string,
+
+  /**
+   * The value of the form element, represented in one of the child radio buttons values.
+   *
+   * When defined the radio button group state becomes controlled.
+   */
+  // eslint-disable-next-line react/forbid-prop-types
+  value: PropTypes.any,
+
+  /**
+   * When uncontrolled, defines the initial value.
+   */
+  // eslint-disable-next-line react/forbid-prop-types
+  defaultValue: PropTypes.any,
+
+  /**
+   * The label of the form element.
+   *
+   * The form element must be labeled for accessibility reasons.
+   * If not provided, an aria-label or aria-labelledby must be provided instead.
+   */
+  label: PropTypes.node,
+
+  /**
+   * @ignore
+   */
+  "aria-label": PropTypes.string,
+
+  /**
+   * @ignore
+   */
+  "aria-labelledby": PropTypes.string,
+
+  /**
+   * Provide additional descriptive text for the form element.
+   */
+  description: PropTypes.node,
+
+  /**
+   * @ignore
+   */
+  "aria-describedby": PropTypes.string,
+
+  /**
+   * Indicates that the form element is disabled.
+   * If `true` the state is propagated to the children radio buttons.
+   */
+  disabled: PropTypes.bool,
+
+  /**
+   * Indicates that the form element is not editable.
+   * If `true` the state is propagated to the children radio buttons.
+   */
+  readOnly: PropTypes.bool,
+
+  /**
+   * Indicates that user input is required on the form element.
+   * If `true` the state is propagated to the children radio buttons' input element.
+   */
+  required: PropTypes.bool,
+
+  /**
+   * The status of the form element.
+   *
+   * Valid is correct, invalid is incorrect and standBy means no validations have run.
+   *
+   * When uncontrolled and unspecified it will default to "standBy" and change to either "valid"
+   * or "invalid" after any change to the state.
+   */
+  status: PropTypes.oneOf(["standBy", "valid", "invalid"]),
+
+  /**
+   * The error message to show when `status` is "invalid".
+   */
+  statusMessage: PropTypes.node,
+
+  /**
+   * Identifies the element that provides an error message for the radio group.
+   *
+   * Will only be used when the validation status is invalid.
+   */
+  "aria-errormessage": PropTypes.string,
+
+  /**
+   * The callback fired when the value changes.
+   */
+  onChange: PropTypes.func,
+
+  /**
+   * Indicates whether the radio buttons group's orientation is horizontal or vertical.
+   *
+   * Defaults to vertical.
+   */
+  orientation: PropTypes.oneOf(["vertical", "horizontal"]),
+
+  /**
+   * The radio buttons that are part of the group.
+   *
+   * Their state will always be controlled by the group.
+   * However the individual radio button onChange callback will still be called if defined.
+   */
+  children: PropTypes.node
+};
+export default withStyles(styles, {
+  name: "HvRadioGroup"
+})(HvRadioGroup);
+//# sourceMappingURL=RadioGroup.js.map

package/dist/modern/RadioGroup/RadioGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/RadioGroup/RadioGroup.js"],"names":["React","useCallback","useMemo","PropTypes","clsx","withStyles","HvFormElement","HvLabel","HvInfoMessage","HvWarningText","useUniqueId","setId","useControlled","styles","getValueFromSelectedChildren","children","childrenArray","Children","toArray","childrenCount","length","i","child","childIsControlled","props","checked","undefined","childIsSelected","defaultChecked","value","HvRadioGroup","classes","className","id","name","valueProp","defaultValue","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","status","statusMessage","ariaErrorMessage","orientation","others","elementId","setValue","onChildChangeInterceptor","childOnChange","evt","isChecked","newValue","modifiedChildren","map","childValue","cloneElement","inputProps","canShowError","errorMessageId","root","join","trim","group","vertical","horizontal","invalid","error","propTypes","string","shape","isRequired","any","node","bool","oneOf","func"],"mappings":"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","sourcesContent":["import React, { useCallback, useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport clsx from \"clsx\";\n\nimport { withStyles } from \"@material-ui/core\";\n\nimport { HvFormElement, HvLabel, HvInfoMessage, HvWarningText, useUniqueId } from \"..\";\n\nimport { setId, useControlled } from \"../utils\";\n\nimport styles from \"./styles\";\n\nconst getValueFromSelectedChildren = (children) => {\n  const childrenArray = React.Children.toArray(children);\n  const childrenCount = childrenArray.length;\n  for (let i = 0; i !== childrenCount; i += 1) {\n    const child = childrenArray[i];\n\n    const childIsControlled = child.props.checked !== undefined;\n    const childIsSelected = childIsControlled ? child.props.checked : child.props.defaultChecked;\n\n    if (childIsSelected) {\n      return child.props.value;\n    }\n  }\n\n  return null;\n};\n\n/**\n * A group of radio buttons.\n *\n * A radio group is a type of selection list that can only have a single entry checked at any one time.\n */\nconst HvRadioGroup = (props) => {\n  const {\n    classes,\n    className,\n\n    id,\n    name,\n    value: valueProp,\n    defaultValue,\n\n    required = false,\n    readOnly = false,\n    disabled = false,\n\n    label,\n    \"aria-label\": ariaLabel,\n    \"aria-labelledby\": ariaLabelledBy,\n    description,\n    \"aria-describedby\": ariaDescribedBy,\n\n    onChange,\n\n    status,\n    statusMessage,\n    \"aria-errormessage\": ariaErrorMessage,\n\n    orientation = \"vertical\",\n\n    children,\n    ...others\n  } = props;\n\n  const elementId = useUniqueId(id, \"hvradiogroup\");\n\n  const [value, setValue] = useControlled(\n    valueProp,\n    defaultValue !== undefined\n      ? defaultValue\n      : // when uncontrolled and no default value is given,\n        // extract the initial selected values from the children own state\n        () => getValueFromSelectedChildren(children)\n  );\n\n  const onChildChangeInterceptor = useCallback(\n    (childOnChange, evt, isChecked, newValue) => {\n      childOnChange?.(evt, isChecked, newValue);\n\n      onChange?.(evt, newValue);\n\n      setValue(newValue);\n    },\n    [onChange, setValue]\n  );\n\n  const modifiedChildren = useMemo(() => {\n    return React.Children.map(children, (child) => {\n      const childValue = child.props.value ?? \"on\";\n\n      const childIsSelected = childValue === value;\n\n      return React.cloneElement(child, {\n        checked: childIsSelected,\n        name: child.props.name || name || elementId,\n        onChange: (evt, isChecked, newValue) =>\n          onChildChangeInterceptor(child.props.onChange, evt, isChecked, newValue),\n        inputProps: {\n          ...child.props.inputProps,\n          // set the required attribute directly in the input\n          // the radio form element context shouldn't be aware so the\n          // label doesn't show redundant asterisk\n          required,\n        },\n        disabled: disabled || child.props.disabled,\n        readOnly: readOnly || child.props.readOnly,\n      });\n    });\n  }, [children, disabled, elementId, name, onChildChangeInterceptor, readOnly, required, value]);\n\n  // the error message area will only be created if:\n  // - an external element that provides an error message isn't identified via aria-errormessage AND\n  //   - both status and statusMessage properties are being controlled OR\n  //   - status is uncontrolled and required is true\n  const canShowError =\n    ariaErrorMessage == null &&\n    ((status !== undefined && statusMessage !== undefined) || (status === undefined && required));\n\n  const errorMessageId = canShowError ? setId(elementId, \"error\") : ariaErrorMessage;\n\n  return (\n    <HvFormElement\n      id={id}\n      name={name}\n      status={status || \"standBy\"}\n      disabled={disabled}\n      required={required}\n      readOnly={readOnly}\n      className={clsx(className, classes.root)}\n    >\n      {label && (\n        <HvLabel id={setId(elementId, \"label\")} label={label} className={clsx(classes.label)} />\n      )}\n      {description && (\n        <HvInfoMessage id={setId(elementId, \"description\")}>{description}</HvInfoMessage>\n      )}\n      <div\n        role=\"radiogroup\"\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledBy || (label && setId(elementId, \"label\"))}\n        aria-invalid={status === \"invalid\" ? true : undefined}\n        aria-errormessage={status === \"invalid\" ? errorMessageId : undefined}\n        aria-describedby={\n          [description && setId(elementId, \"description\"), ariaDescribedBy].join(\" \").trim() ||\n          undefined\n        }\n        className={clsx(classes.group, {\n          [classes.vertical]: orientation === \"vertical\",\n          [classes.horizontal]: orientation === \"horizontal\",\n          [classes.invalid]: status === \"invalid\",\n        })}\n        {...others}\n      >\n        {modifiedChildren}\n      </div>\n      {canShowError && (\n        <HvWarningText id={setId(elementId, \"error\")} disableBorder className={classes.error}>\n          {statusMessage}\n        </HvWarningText>\n      )}\n    </HvFormElement>\n  );\n};\n\nHvRadioGroup.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the label.\n     */\n    label: PropTypes.string,\n    /**\n     * Styles applied to the radio button group.\n     */\n    group: PropTypes.string,\n    /**\n     * Styles applied to the radio button group when orientation is vertical.\n     */\n    vertical: PropTypes.string,\n    /**\n     * Styles applied to the radio button group when orientation is horizontal.\n     */\n    horizontal: PropTypes.string,\n    /**\n     * Styles applied to the radio button group when validation status is invalid.\n     */\n    invalid: PropTypes.string,\n    /**\n     * Styles applied to the error area.\n     */\n    error: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Id to be applied to the form element root node.\n   */\n  id: PropTypes.string,\n\n  /**\n   * The form element name.\n   * It is propagated to the children radio buttons, unless they already have one (which they shouldn't).\n   */\n  name: PropTypes.string,\n  /**\n   * The value of the form element, represented in one of the child radio buttons values.\n   *\n   * When defined the radio button group state becomes controlled.\n   */\n  // eslint-disable-next-line react/forbid-prop-types\n  value: PropTypes.any,\n  /**\n   * When uncontrolled, defines the initial value.\n   */\n  // eslint-disable-next-line react/forbid-prop-types\n  defaultValue: PropTypes.any,\n\n  /**\n   * The label of the form element.\n   *\n   * The form element must be labeled for accessibility reasons.\n   * If not provided, an aria-label or aria-labelledby must be provided instead.\n   */\n  label: PropTypes.node,\n  /**\n   * @ignore\n   */\n  \"aria-label\": PropTypes.string,\n  /**\n   * @ignore\n   */\n  \"aria-labelledby\": PropTypes.string,\n  /**\n   * Provide additional descriptive text for the form element.\n   */\n  description: PropTypes.node,\n  /**\n   * @ignore\n   */\n  \"aria-describedby\": PropTypes.string,\n\n  /**\n   * Indicates that the form element is disabled.\n   * If `true` the state is propagated to the children radio buttons.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * Indicates that the form element is not editable.\n   * If `true` the state is propagated to the children radio buttons.\n   */\n  readOnly: PropTypes.bool,\n  /**\n   * Indicates that user input is required on the form element.\n   * If `true` the state is propagated to the children radio buttons' input element.\n   */\n  required: PropTypes.bool,\n\n  /**\n   * The status of the form element.\n   *\n   * Valid is correct, invalid is incorrect and standBy means no validations have run.\n   *\n   * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n   * or \"invalid\" after any change to the state.\n   */\n  status: PropTypes.oneOf([\"standBy\", \"valid\", \"invalid\"]),\n  /**\n   * The error message to show when `status` is \"invalid\".\n   */\n  statusMessage: PropTypes.node,\n  /**\n   * Identifies the element that provides an error message for the radio group.\n   *\n   * Will only be used when the validation status is invalid.\n   */\n  \"aria-errormessage\": PropTypes.string,\n\n  /**\n   * The callback fired when the value changes.\n   */\n  onChange: PropTypes.func,\n\n  /**\n   * Indicates whether the radio buttons group's orientation is horizontal or vertical.\n   *\n   * Defaults to vertical.\n   */\n  orientation: PropTypes.oneOf([\"vertical\", \"horizontal\"]),\n\n  /**\n   * The radio buttons that are part of the group.\n   *\n   * Their state will always be controlled by the group.\n   * However the individual radio button onChange callback will still be called if defined.\n   */\n  children: PropTypes.node,\n};\n\nexport default withStyles(styles, { name: \"HvRadioGroup\" })(HvRadioGroup);\n"],"file":"RadioGroup.js"}

package/dist/modern/RadioGroup/index.d.ts

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

package/dist/modern/RadioGroup/index.js

@@ -0,0 +1,2 @@
+export { default } from "./RadioGroup";
+//# sourceMappingURL=index.js.map

package/dist/modern/RadioGroup/index.js.map

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

package/dist/modern/RadioGroup/styles.js

@@ -0,0 +1,47 @@
+const styles = theme => ({
+  root: {
+    display: "inline-block",
+    padding: 0,
+    margin: 0,
+    overflow: "hidden",
+    verticalAlign: "top"
+  },
+  label: {
+    marginBottom: theme.hv.spacing.xs
+  },
+  group: {
+    display: "flex"
+  },
+  vertical: {
+    flexDirection: "column",
+    // prevent the focus ring to be hidden by simbling hover background
+    "&>*": {
+      zIndex: 0
+    },
+    "&>*:focus-within": {
+      zIndex: 1
+    },
+    // IE fallback code (using focus-within-polyfill)
+    "&>*.focus-within": {
+      zIndex: 1
+    }
+  },
+  horizontal: {
+    flexDirection: "row",
+    flexWrap: "wrap",
+    marginLeft: -theme.hv.spacing.sm,
+    "&>*": {
+      marginLeft: theme.hv.spacing.sm
+    },
+    width: "calc(100% + 20px)" // compensate the negative margin left which increases the width
+
+  },
+  invalid: {
+    paddingBottom: theme.hv.spacing.xs,
+    borderBottom: `1px solid ${theme.hv.palette.semantic.sema4}`
+  },
+  error: {}
+});
+
+export default styles;
+//# sourceMappingURL=styles.js.map

package/dist/modern/RadioGroup/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/RadioGroup/styles.js"],"names":["styles","theme","root","display","padding","margin","overflow","verticalAlign","label","marginBottom","hv","spacing","xs","group","vertical","flexDirection","zIndex","horizontal","flexWrap","marginLeft","sm","width","invalid","paddingBottom","borderBottom","palette","semantic","sema4","error"],"mappings":"AAAA,MAAMA,MAAM,GAAIC,KAAD,KAAY;AACzBC,EAAAA,IAAI,EAAE;AACJC,IAAAA,OAAO,EAAE,cADL;AAEJC,IAAAA,OAAO,EAAE,CAFL;AAGJC,IAAAA,MAAM,EAAE,CAHJ;AAIJC,IAAAA,QAAQ,EAAE,QAJN;AAKJC,IAAAA,aAAa,EAAE;AALX,GADmB;AASzBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,YAAY,EAAER,KAAK,CAACS,EAAN,CAASC,OAAT,CAAiBC;AAD1B,GATkB;AAazBC,EAAAA,KAAK,EAAE;AACLV,IAAAA,OAAO,EAAE;AADJ,GAbkB;AAgBzBW,EAAAA,QAAQ,EAAE;AACRC,IAAAA,aAAa,EAAE,QADP;AAGR;AACA,WAAO;AACLC,MAAAA,MAAM,EAAE;AADH,KAJC;AAOR,wBAAoB;AAClBA,MAAAA,MAAM,EAAE;AADU,KAPZ;AAUR;AACA,wBAAoB;AAClBA,MAAAA,MAAM,EAAE;AADU;AAXZ,GAhBe;AA+BzBC,EAAAA,UAAU,EAAE;AACVF,IAAAA,aAAa,EAAE,KADL;AAEVG,IAAAA,QAAQ,EAAE,MAFA;AAGVC,IAAAA,UAAU,EAAE,CAAClB,KAAK,CAACS,EAAN,CAASC,OAAT,CAAiBS,EAHpB;AAIV,WAAO;AACLD,MAAAA,UAAU,EAAElB,KAAK,CAACS,EAAN,CAASC,OAAT,CAAiBS;AADxB,KAJG;AAOVC,IAAAA,KAAK,EAAE,mBAPG,CAOkB;;AAPlB,GA/Ba;AAyCzBC,EAAAA,OAAO,EAAE;AACPC,IAAAA,aAAa,EAAEtB,KAAK,CAACS,EAAN,CAASC,OAAT,CAAiBC,EADzB;AAEPY,IAAAA,YAAY,EAAG,aAAYvB,KAAK,CAACS,EAAN,CAASe,OAAT,CAAiBC,QAAjB,CAA0BC,KAAM;AAFpD,GAzCgB;AA8CzBC,EAAAA,KAAK,EAAE;AA9CkB,CAAZ,CAAf;;AAiDA,eAAe5B,MAAf","sourcesContent":["const styles = (theme) => ({\n  root: {\n    display: \"inline-block\",\n    padding: 0,\n    margin: 0,\n    overflow: \"hidden\",\n    verticalAlign: \"top\",\n  },\n\n  label: {\n    marginBottom: theme.hv.spacing.xs,\n  },\n\n  group: {\n    display: \"flex\",\n  },\n  vertical: {\n    flexDirection: \"column\",\n\n    // prevent the focus ring to be hidden by simbling hover background\n    \"&>*\": {\n      zIndex: 0,\n    },\n    \"&>*:focus-within\": {\n      zIndex: 1,\n    },\n    // IE fallback code (using focus-within-polyfill)\n    \"&>*.focus-within\": {\n      zIndex: 1,\n    },\n  },\n  horizontal: {\n    flexDirection: \"row\",\n    flexWrap: \"wrap\",\n    marginLeft: -theme.hv.spacing.sm,\n    \"&>*\": {\n      marginLeft: theme.hv.spacing.sm,\n    },\n    width: \"calc(100% + 20px)\", // compensate the negative margin left which increases the width\n  },\n\n  invalid: {\n    paddingBottom: theme.hv.spacing.xs,\n    borderBottom: `1px solid ${theme.hv.palette.semantic.sema4}`,\n  },\n\n  error: {},\n});\n\nexport default styles;\n"],"file":"styles.js"}

package/dist/modern/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.js

@@ -0,0 +1,114 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["id", "className", "classes", "selected", "children", "onClick", "onKeyDown", "tooltipWrapper"];
+import React from "react";
+import PropTypes from "prop-types";
+import clsx from "clsx";
+import { withStyles } from "@material-ui/core";
+import { setId } from "../../..";
+import styles from "./styles";
+/**
+ * HvHorizontalScrollListItem a focusable item to be used as part of the horizontal scroll
+ */
+
+const HvHorizontalScrollListItem = props => {
+  const {
+    id,
+    className,
+    classes,
+    selected,
+    children,
+    onClick,
+    onKeyDown,
+    tooltipWrapper
+  } = props,
+        others = _objectWithoutProperties(props, _excluded);
+
+  const variant = selected ? "highlightText" : "normalText";
+  const labelId = setId(id, "label");
+  const buttonId = setId(id, "button");
+  const Tooltip = tooltipWrapper;
+  return /*#__PURE__*/React.createElement("li", {
+    id: id,
+    className: clsx(className, classes.root),
+    "aria-current": selected
+  }, /*#__PURE__*/React.createElement("div", _extends({
+    id: buttonId,
+    role: "button",
+    tabIndex: 0,
+    onClick: onClick,
+    onKeyDown: onKeyDown,
+    className: classes.button,
+    "aria-labelledby": labelId
+  }, others), /*#__PURE__*/React.createElement(Tooltip, {
+    id: labelId,
+    className: clsx(classes.text, selected && classes.selected),
+    variant: variant
+  }, children)));
+};
+
+HvHorizontalScrollListItem.propTypes = {
+  /**
+   * Id to be applied to the tab.
+   */
+  id: PropTypes.string,
+
+  /**
+   * Class names to be applied.
+   */
+  className: PropTypes.string,
+
+  /**
+   * A Jss Object used to override or extend the styles applied.
+   */
+  classes: PropTypes.shape({
+    /**
+     * Styles applied to the component root class.
+     */
+    root: PropTypes.string,
+
+    /**
+     * Styles applied to the component when it is selected.
+     */
+    selected: PropTypes.string,
+
+    /**
+     * Styles applied to the text inside the component.
+     */
+    text: PropTypes.string,
+
+    /**
+     * Styles applied to the button inside the component.
+     */
+    button: PropTypes.string
+  }).isRequired,
+
+  /**
+   * Whether the element is selected.
+   */
+  selected: PropTypes.bool,
+
+  /**
+   * The text to render.
+   */
+  children: PropTypes.node.isRequired,
+
+  /**
+   * a function component that renders a typography wrapped with a tooltip.
+   */
+  tooltipWrapper: PropTypes.func.isRequired,
+
+  /**
+   * The function to be executed when the element is clicked.
+   */
+  onClick: PropTypes.func,
+
+  /**
+   * The function to be executed when the element is clicked.
+   */
+  onKeyDown: PropTypes.func
+};
+export default withStyles(styles, {
+  name: "HvHorizontalScrollListItem"
+})(HvHorizontalScrollListItem);
+//# sourceMappingURL=HorizontalScrollListItem.js.map

package/dist/modern/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.js"],"names":["React","PropTypes","clsx","withStyles","setId","styles","HvHorizontalScrollListItem","props","id","className","classes","selected","children","onClick","onKeyDown","tooltipWrapper","others","variant","labelId","buttonId","Tooltip","root","button","text","propTypes","string","shape","isRequired","bool","node","func","name"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles } from \"@material-ui/core\";\nimport { setId } from \"../../..\";\nimport styles from \"./styles\";\n\n/**\n * HvHorizontalScrollListItem a focusable item to be used as part of the horizontal scroll\n */\nconst HvHorizontalScrollListItem = (props) => {\n  const {\n    id,\n    className,\n    classes,\n    selected,\n    children,\n    onClick,\n    onKeyDown,\n    tooltipWrapper,\n    ...others\n  } = props;\n  const variant = selected ? \"highlightText\" : \"normalText\";\n  const labelId = setId(id, \"label\");\n  const buttonId = setId(id, \"button\");\n  const Tooltip = tooltipWrapper;\n  return (\n    <li id={id} className={clsx(className, classes.root)} aria-current={selected}>\n      <div\n        id={buttonId}\n        role=\"button\"\n        tabIndex={0}\n        onClick={onClick}\n        onKeyDown={onKeyDown}\n        className={classes.button}\n        aria-labelledby={labelId}\n        {...others}\n      >\n        <Tooltip\n          id={labelId}\n          className={clsx(classes.text, { [classes.selected]: selected })}\n          variant={variant}\n        >\n          {children}\n        </Tooltip>\n      </div>\n    </li>\n  );\n};\n\nHvHorizontalScrollListItem.propTypes = {\n  /**\n   * Id to be applied to the tab.\n   */\n  id: PropTypes.string,\n  /**\n   * Class names to be applied.\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 class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the component when it is selected.\n     */\n    selected: PropTypes.string,\n    /**\n     * Styles applied to the text inside the component.\n     */\n    text: PropTypes.string,\n    /**\n     * Styles applied to the button inside the component.\n     */\n    button: PropTypes.string,\n  }).isRequired,\n  /**\n   * Whether the element is selected.\n   */\n  selected: PropTypes.bool,\n  /**\n   * The text to render.\n   */\n  children: PropTypes.node.isRequired,\n  /**\n   * a function component that renders a typography wrapped with a tooltip.\n   */\n  tooltipWrapper: PropTypes.func.isRequired,\n  /**\n   * The function to be executed when the element is clicked.\n   */\n  onClick: PropTypes.func,\n  /**\n   * The function to be executed when the element is clicked.\n   */\n  onKeyDown: PropTypes.func,\n};\n\nexport default withStyles(styles, { name: \"HvHorizontalScrollListItem\" })(\n  HvHorizontalScrollListItem\n);\n"],"file":"HorizontalScrollListItem.js"}

package/dist/modern/ScrollTo/Horizontal/HorizontalScrollListItem/index.js

@@ -0,0 +1,2 @@
+export { default } from "./HorizontalScrollListItem";
+//# sourceMappingURL=index.js.map

package/dist/modern/ScrollTo/Horizontal/HorizontalScrollListItem/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ScrollTo/Horizontal/HorizontalScrollListItem/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,4BAAxB","sourcesContent":["export { default } from \"./HorizontalScrollListItem\";\n"],"file":"index.js"}

package/dist/modern/ScrollTo/Horizontal/HorizontalScrollListItem/styles.js

@@ -0,0 +1,42 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+
+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) { _defineProperty(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; }
+
+import { outlineStyles } from "../../../Focus/styles";
+
+const styles = theme => ({
+  root: {
+    padding: "10px 0"
+  },
+  button: {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    height: "32px",
+    cursor: "pointer",
+    borderBottom: `2px solid transparent`,
+    "&:hover": {
+      backgroundColor: theme.hv.palette.atmosphere.atmo3
+    },
+    "&:focus": {
+      outline: "none"
+    },
+    "&.focus-visible": _objectSpread({}, outlineStyles)
+  },
+  text: {
+    height: "32px",
+    padding: "8px 10px",
+    borderBottom: `2px solid transparent`,
+    maxWidth: "180px",
+    textOverflow: "ellipsis",
+    overflow: "hidden"
+  },
+  selected: {
+    borderBottom: `2px solid ${theme.hv.palette.accent.acce1}`
+  }
+});
+
+export default styles;
+//# sourceMappingURL=styles.js.map

package/dist/modern/ScrollTo/Horizontal/HorizontalScrollListItem/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/ScrollTo/Horizontal/HorizontalScrollListItem/styles.js"],"names":["outlineStyles","styles","theme","root","padding","button","display","justifyContent","alignItems","height","cursor","borderBottom","backgroundColor","hv","palette","atmosphere","atmo3","outline","text","maxWidth","textOverflow","overflow","selected","accent","acce1"],"mappings":";;;;;;AAAA,SAASA,aAAT,QAA8B,uBAA9B;;AAEA,MAAMC,MAAM,GAAIC,KAAD,KAAY;AACzBC,EAAAA,IAAI,EAAE;AACJC,IAAAA,OAAO,EAAE;AADL,GADmB;AAIzBC,EAAAA,MAAM,EAAE;AACNC,IAAAA,OAAO,EAAE,MADH;AAENC,IAAAA,cAAc,EAAE,QAFV;AAGNC,IAAAA,UAAU,EAAE,QAHN;AAINC,IAAAA,MAAM,EAAE,MAJF;AAKNC,IAAAA,MAAM,EAAE,SALF;AAMNC,IAAAA,YAAY,EAAG,uBANT;AAON,eAAW;AACTC,MAAAA,eAAe,EAAEV,KAAK,CAACW,EAAN,CAASC,OAAT,CAAiBC,UAAjB,CAA4BC;AADpC,KAPL;AAUN,eAAW;AACTC,MAAAA,OAAO,EAAE;AADA,KAVL;AAaN,yCACKjB,aADL;AAbM,GAJiB;AAqBzBkB,EAAAA,IAAI,EAAE;AACJT,IAAAA,MAAM,EAAE,MADJ;AAEJL,IAAAA,OAAO,EAAE,UAFL;AAGJO,IAAAA,YAAY,EAAG,uBAHX;AAIJQ,IAAAA,QAAQ,EAAE,OAJN;AAKJC,IAAAA,YAAY,EAAE,UALV;AAMJC,IAAAA,QAAQ,EAAE;AANN,GArBmB;AA6BzBC,EAAAA,QAAQ,EAAE;AACRX,IAAAA,YAAY,EAAG,aAAYT,KAAK,CAACW,EAAN,CAASC,OAAT,CAAiBS,MAAjB,CAAwBC,KAAM;AADjD;AA7Be,CAAZ,CAAf;;AAkCA,eAAevB,MAAf","sourcesContent":["import { outlineStyles } from \"../../../Focus/styles\";\n\nconst styles = (theme) => ({\n  root: {\n    padding: \"10px 0\",\n  },\n  button: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: \"32px\",\n    cursor: \"pointer\",\n    borderBottom: `2px solid transparent`,\n    \"&:hover\": {\n      backgroundColor: theme.hv.palette.atmosphere.atmo3,\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n    \"&.focus-visible\": {\n      ...outlineStyles,\n    },\n  },\n  text: {\n    height: \"32px\",\n    padding: \"8px 10px\",\n    borderBottom: `2px solid transparent`,\n    maxWidth: \"180px\",\n    textOverflow: \"ellipsis\",\n    overflow: \"hidden\",\n  },\n  selected: {\n    borderBottom: `2px solid ${theme.hv.palette.accent.acce1}`,\n  },\n});\n\nexport default styles;\n"],"file":"styles.js"}

package/dist/modern/ScrollTo/Horizontal/ScrollToHorizontal.d.ts

@@ -0,0 +1,69 @@
+import { StandardProps } from "@material-ui/core";
+import React from "react";
+import { HvScrollToTooltipPositions } from "../tooltipPositions";
+
+interface Option {
+  key?: string;
+  label: string;
+  value: string;
+  offset?: number;
+}
+
+export type HvScrollToHorizontalClassKey = "root" | "positionSticky" | "positionFixed";
+export type HvScrollToHorizontalPositions = "sticky" | "fixed" | "relative";
+export type HvScrollToHorizontalTooltipPositions =  "left" | "right" | "top" | "bottom";
+type newStandardProps = Omit<
+  StandardProps<React.HTMLAttributes<HTMLDivElement>, HvScrollToHorizontalClassKey>,
+  "onChange" | "onClick"
+>;
+
+export interface HvScrollToHorizontalProps extends newStandardProps {
+  /**
+   * An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied
+   */
+  options: Option[];
+  /**
+   * True if the href location link should be applied. It will create an a element around every list item
+   */
+  href?: boolean;
+  /**
+   * Default selected index passed from the parent.
+   */
+  defaultSelectedIndex?: number;
+  /**
+   * The Id of the scrollable container containing displayed elements.
+   *
+   * Defaults to `window` if unspecified.
+   */
+  scrollElementId?: string;
+  /**
+   * Defines the offset from the top of each element for getting an optimal viewing region in the container.
+   * This allows to exclude regions of the container that are obscured by other content (such as fixed-positioned toolbars or titles)
+   * or to put more breathing room between the targeted element and the edges of the container.
+   *
+   * Each element can alse have a specific offset via the options property.
+   */
+  offset?: number;
+  /**
+   * Position of the Horizontal scroll to.
+   */
+  position?: HvScrollToHorizontalPositions;
+  /**
+   * Position of tooltip identifying the current item.
+   */
+   tooltipPosition?: HvScrollToTooltipPositions;
+  /**
+   * A function called each time the selected index changes.
+   */
+  onChange?: (event: React.SyntheticEvent | React.UIEvent, index: number) => void;
+  /**
+   * A function called each time an user clicks on a tab element.
+   */
+  onClick?: (event: React.MouseEventHandler<HTMLButtonElement>, index: number) => void;
+  /**
+   * A function called each time an user press enter on a tab element.
+   */
+  onEnter?: (event: React.KeyboardEvent<HTMLButtonElement>, index: number) => void;
+}
+
+export default function HvScrollToHorizontal(props: HvScrollToHorizontalProps): JSX.Element | null;