@entur/layout 3.1.8 → 3.1.9-beta.0

package/dist/layout.esm.js

@@ -1,239 +1,280 @@
-import { ConditionalWrapper, warnAboutMissingStyles } from '@entur/utils';
-import React from 'react';
-import classNames from 'classnames';
-import { Heading3, Paragraph, Label } from '@entur/typography';
-import { ForwardIcon } from '@entur/icons';
-
-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);
+import { ConditionalWrapper, warnAboutMissingStyles } from "@entur/utils";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import React from "react";
+import { Heading3, Paragraph, Label } from "@entur/typography";
+import { ForwardIcon } from "@entur/icons";
+function getDefaultExportFromCjs(x) {
+  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
 }
-function _objectWithoutPropertiesLoose(r, e) {
-  if (null == r) return {};
-  var t = {};
-  for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
-    if (e.includes(n)) continue;
-    t[n] = r[n];
-  }
-  return t;
+var classnames = { exports: {} };
+/*!
+	Copyright (c) 2018 Jed Watson.
+	Licensed under the MIT License (MIT), see
+	http://jedwatson.github.io/classnames
+*/
+var hasRequiredClassnames;
+function requireClassnames() {
+  if (hasRequiredClassnames) return classnames.exports;
+  hasRequiredClassnames = 1;
+  (function(module) {
+    (function() {
+      var hasOwn = {}.hasOwnProperty;
+      function classNames2() {
+        var classes = "";
+        for (var i = 0; i < arguments.length; i++) {
+          var arg = arguments[i];
+          if (arg) {
+            classes = appendClass(classes, parseValue(arg));
+          }
+        }
+        return classes;
+      }
+      function parseValue(arg) {
+        if (typeof arg === "string" || typeof arg === "number") {
+          return arg;
+        }
+        if (typeof arg !== "object") {
+          return "";
+        }
+        if (Array.isArray(arg)) {
+          return classNames2.apply(null, arg);
+        }
+        if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes("[native code]")) {
+          return arg.toString();
+        }
+        var classes = "";
+        for (var key in arg) {
+          if (hasOwn.call(arg, key) && arg[key]) {
+            classes = appendClass(classes, key);
+          }
+        }
+        return classes;
+      }
+      function appendClass(value, newClass) {
+        if (!newClass) {
+          return value;
+        }
+        if (value) {
+          return value + " " + newClass;
+        }
+        return value + newClass;
+      }
+      if (module.exports) {
+        classNames2.default = classNames2;
+        module.exports = classNames2;
+      } else {
+        window.classNames = classNames2;
+      }
+    })();
+  })(classnames);
+  return classnames.exports;
 }
-
-var _excluded$5 = ["className", "as"];
-var defaultElement$8 = 'div';
-var Contrast = /*#__PURE__*/React.forwardRef(function Contrast(_ref, ref) {
-  var className = _ref.className,
-    as = _ref.as,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
-  var Element = as || defaultElement$8;
-  return React.createElement(ContrastContext.Provider, {
-    value: true
-  }, React.createElement(Element, _extends({
-    className: classNames('eds-contrast', className),
-    ref: ref
-  }, rest)));
+var classnamesExports = requireClassnames();
+const classNames = /* @__PURE__ */ getDefaultExportFromCjs(classnamesExports);
+const defaultElement$8 = "div";
+const Contrast = React.forwardRef(function Contrast2({ className, as, ...rest }, ref) {
+  const Element = as || defaultElement$8;
+  return /* @__PURE__ */ jsx(ContrastContext.Provider, { value: true, children: /* @__PURE__ */ jsx(
+    Element,
+    {
+      className: classNames("eds-contrast", className),
+      ref,
+      ...rest
+    }
+  ) });
 });
-var ContrastContext = /*#__PURE__*/React.createContext(false);
-var useContrast = function useContrast() {
-  return React.useContext(ContrastContext);
-};
-
-var _excluded$4 = ["children", "className", "as"];
-var defaultElement$7 = 'div';
-var BaseCard = function BaseCard(_ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    as = _ref.as,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
-  var Element = as || defaultElement$7;
-  var classList = classNames('eds-base-card', className);
-  return React.createElement(Element, _extends({
-    className: classList
-  }, rest), children);
+const ContrastContext = React.createContext(false);
+const useContrast = () => React.useContext(ContrastContext);
+const defaultElement$7 = "div";
+const BaseCard = ({
+  children,
+  className,
+  as,
+  ...rest
+}) => {
+  const Element = as || defaultElement$7;
+  const classList = classNames("eds-base-card", className);
+  return /* @__PURE__ */ jsx(Element, { className: classList, ...rest, children });
 };
-
-var _excluded$3 = ["title", "children", "titleIcon", "compact", "className", "as"];
-var defaultElement$6 = 'a';
-var NavigationCard = function NavigationCard(_ref) {
-  var title = _ref.title,
-    children = _ref.children,
-    titleIcon = _ref.titleIcon,
-    _ref$compact = _ref.compact,
-    compact = _ref$compact === void 0 ? false : _ref$compact,
-    className = _ref.className,
-    as = _ref.as,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
-  var Element = as || defaultElement$6;
-  var classList = classNames('eds-navigation-card', className, {
-    'eds-base-card--red-line': compact,
-    'eds-navigation-card--compact': compact
+const defaultElement$6 = "a";
+const NavigationCard = ({
+  title,
+  children,
+  titleIcon,
+  compact = false,
+  className,
+  as,
+  ...rest
+}) => {
+  const Element = as || defaultElement$6;
+  const classList = classNames("eds-navigation-card", className, {
+    "eds-base-card--red-line": compact,
+    "eds-navigation-card--compact": compact
   });
-  return React.createElement(BaseCard, _extends({
-    as: Element,
-    className: classList
-  }, rest), React.createElement("div", {
-    className: "eds-navigation-card-header"
-  }, React.createElement("div", {
-    className: "eds-navigation-card-header__content"
-  }, titleIcon && React.createElement("div", {
-    className: "eds-navigation-card-header__title-icon",
-    "aria-hidden": "true"
-  }, titleIcon), React.createElement("span", {
-    className: "eds-navigation-card-header__title"
-  }, React.createElement(Heading3, {
-    as: "span"
-  }, title))), !compact && React.createElement("div", {
-    className: "eds-navigation-card-header__highlight"
-  })), !compact && React.createElement(React.Fragment, null, React.createElement(Paragraph, null, children)));
+  return /* @__PURE__ */ jsxs(BaseCard, { as: Element, className: classList, ...rest, children: [
+    /* @__PURE__ */ jsxs("div", { className: "eds-navigation-card-header", children: [
+      /* @__PURE__ */ jsxs("div", { className: "eds-navigation-card-header__content", children: [
+        titleIcon && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "eds-navigation-card-header__title-icon",
+            "aria-hidden": "true",
+            children: titleIcon
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "eds-navigation-card-header__title", children: /* @__PURE__ */ jsx(Heading3, { as: "span", children: title }) })
+      ] }),
+      !compact && /* @__PURE__ */ jsx("div", { className: "eds-navigation-card-header__highlight" })
+    ] }),
+    !compact && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Paragraph, { children }) })
+  ] });
 };
-
-var _excluded$2 = ["title", "description", "children", "className", "category", "style", "as", "headingLevel", "wholeCardAsElement", "hideArrow", "wrapperProps", "orientation"];
-var defaultElement$5 = 'a';
-var MediaCard = function MediaCard(_ref) {
-  var title = _ref.title,
-    description = _ref.description,
-    children = _ref.children,
-    className = _ref.className,
-    category = _ref.category,
-    style = _ref.style,
-    as = _ref.as,
-    _ref$headingLevel = _ref.headingLevel,
-    headingLevel = _ref$headingLevel === void 0 ? 'h2' : _ref$headingLevel,
-    whole = _ref.wholeCardAsElement,
-    hideArrow = _ref.hideArrow,
-    wrapperProps = _ref.wrapperProps,
-    orientation = _ref.orientation,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
-  var Element = as || defaultElement$5;
-  var Heading = Heading3;
-  var _wrapperProps = whole ? _extends({}, wrapperProps, rest) : _extends({}, wrapperProps);
-  var classList = classNames('eds-base-card, eds-media-card', className, {
-    'eds-media-card--horizontal': orientation === 'horizontal'
+const defaultElement$5 = "a";
+const MediaCard = ({
+  title,
+  description,
+  children,
+  className,
+  category,
+  style,
+  as,
+  headingLevel = "h2",
+  wholeCardAsElement: whole,
+  hideArrow,
+  wrapperProps,
+  orientation,
+  ...rest
+}) => {
+  const Element = as || defaultElement$5;
+  const Heading = Heading3;
+  const _wrapperProps = whole ? { ...wrapperProps, ...rest } : { ...wrapperProps };
+  const classList = classNames("eds-base-card, eds-media-card", className, {
+    "eds-media-card--horizontal": orientation === "horizontal"
   });
-  return React.createElement(BaseCard, _extends({
-    className: classList,
-    style: style
-  }, _wrapperProps), React.createElement("div", {
-    className: "eds-media-card__media"
-  }, children), React.createElement("div", {
-    className: "eds-media-card__text"
-  }, category && React.createElement(Label, {
-    className: "eds-media-card__text__category"
-  }, category), React.createElement(ConditionalWrapper, {
-    condition: description !== undefined,
-    wrapper: function wrapper(children) {
-      return React.createElement(Heading, {
-        as: headingLevel,
-        className: "eds-media-card__text__title"
-      }, children);
-    }
-  }, React.createElement(Element, _extends({
-    tabIndex: 0,
-    className: "eds-media-card__text__title-link"
-  }, rest), title)), description !== undefined && React.createElement(Paragraph, null, description), !hideArrow && React.createElement(ForwardIcon, {
-    className: "eds-media-card__arrow-icon",
-    "aria-hidden": "true"
-  })));
+  return /* @__PURE__ */ jsxs(BaseCard, { className: classList, style, ..._wrapperProps, children: [
+    /* @__PURE__ */ jsx("div", { className: "eds-media-card__media", children }),
+    /* @__PURE__ */ jsxs("div", { className: "eds-media-card__text", children: [
+      category && /* @__PURE__ */ jsx(Label, { className: "eds-media-card__text__category", children: category }),
+      /* @__PURE__ */ jsx(
+        ConditionalWrapper,
+        {
+          condition: description !== void 0,
+          wrapper: (children2) => /* @__PURE__ */ jsx(Heading, { as: headingLevel, className: "eds-media-card__text__title", children: children2 }),
+          children: /* @__PURE__ */ jsx(
+            Element,
+            {
+              tabIndex: 0,
+              className: "eds-media-card__text__title-link",
+              ...rest,
+              children: title
+            }
+          )
+        }
+      ),
+      description !== void 0 && /* @__PURE__ */ jsx(Paragraph, { children: description }),
+      !hideArrow && /* @__PURE__ */ jsx(
+        ForwardIcon,
+        {
+          className: "eds-media-card__arrow-icon",
+          "aria-hidden": "true"
+        }
+      )
+    ] })
+  ] });
 };
-
-var _excluded$1 = ["children", "className", "max", "variant", "showZero", "invisible", "hide", "as", "type"];
-var defaultElement$4 = 'span';
-var Badge = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    _ref$max = _ref.max,
-    max = _ref$max === void 0 ? 99 : _ref$max,
-    variant = _ref.variant,
-    _ref$showZero = _ref.showZero,
-    showZero = _ref$showZero === void 0 ? false : _ref$showZero,
-    _ref$invisible = _ref.invisible,
-    invisibleProp = _ref$invisible === void 0 ? false : _ref$invisible,
-    _ref$hide = _ref.hide,
-    hideProp = _ref$hide === void 0 ? false : _ref$hide,
-    as = _ref.as,
-    _ref$type = _ref.type,
-    type = _ref$type === void 0 ? 'status' : _ref$type,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
-  var Element = as || defaultElement$4;
-  var computedHide = hideProp || invisibleProp || children === 0 && !showZero || children == null;
-  var displayValue;
-  if (typeof children === 'number') {
-    displayValue = children > max ? max + "+" : children;
-  } else {
-    displayValue = children;
+const defaultElement$4 = "span";
+const Badge = React.forwardRef(
+  ({
+    children,
+    className,
+    max = 99,
+    variant,
+    showZero = false,
+    invisible: invisibleProp = false,
+    hide: hideProp = false,
+    as,
+    type = "status",
+    ...rest
+  }, ref) => {
+    const Element = as || defaultElement$4;
+    const computedHide = hideProp || invisibleProp || children === 0 && !showZero || children == null;
+    let displayValue;
+    if (typeof children === "number") {
+      displayValue = children > max ? `${max}+` : children;
+    } else {
+      displayValue = children;
+    }
+    const classList = classNames(
+      className,
+      "eds-badge",
+      {
+        "eds-badge--hide": computedHide,
+        "eds-badge--show-zero": showZero
+      },
+      `eds-badge--variant-${variant}`,
+      `eds-badge--type-${type}`
+    );
+    return /* @__PURE__ */ jsx(Element, { className: classList, ref, ...rest, children: displayValue });
   }
-  var classList = classNames(className, 'eds-badge', {
-    'eds-badge--hide': computedHide,
-    'eds-badge--show-zero': showZero
-  }, "eds-badge--variant-" + variant, "eds-badge--type-" + type);
-  return React.createElement(Element, _extends({
-    className: classList,
-    ref: ref
-  }, rest), displayValue);
-});
-
-var defaultElement$3 = 'span';
-var BulletBadge = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Element = props.as || defaultElement$3;
-  // @ts-expect-error type error due to props not being BadgeOwnProps
-  return React.createElement(Badge, _extends({
-    as: Element
-  }, props, {
-    ref: ref,
-    type: "bullet"
-  }));
-});
-
-var defaultElement$2 = 'span';
-var NotificationBadge = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Element = props.as || defaultElement$2;
-  // @ts-expect-error type error due to props not being BadgeOwnProps
-  return React.createElement(Badge, _extends({
-    as: Element
-  }, props, {
-    ref: ref,
-    type: "notification"
-  }));
-});
-
-var defaultElement$1 = 'span';
-var StatusBadge = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var Element = props.as || defaultElement$1;
-  // @ts-expect-error type error due to props not being BadgeOwnProps
-  return React.createElement(Badge, _extends({
-    as: Element
-  }, props, {
-    ref: ref,
-    type: "status"
-  }));
-});
-
-var _excluded = ["className", "children", "compact", "as"];
-var defaultElement = 'div';
-var Tag = function Tag(_ref) {
-  var className = _ref.className,
-    children = _ref.children,
-    compact = _ref.compact,
-    as = _ref.as,
-    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
-  var Element = as || defaultElement;
-  var childrenArray = React.Children.toArray(children);
-  var hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== 'string';
-  var hasTrailingIcon = childrenArray.length > 1 && typeof childrenArray[childrenArray.length - 1] !== 'string';
-  return React.createElement(Element, _extends({
-    className: classNames('eds-tag', className, {
-      'eds-tag--leading-icon': hasLeadingIcon,
-      'eds-tag--trailing-icon': hasTrailingIcon,
-      'eds-tag--compact': compact
-    })
-  }, rest), children);
+);
+const defaultElement$3 = "span";
+const BulletBadge = React.forwardRef(
+  (props, ref) => {
+    const Element = props.as || defaultElement$3;
+    return /* @__PURE__ */ jsx(Badge, { as: Element, ...props, ref, type: "bullet" });
+  }
+);
+const defaultElement$2 = "span";
+const NotificationBadge = React.forwardRef(
+  (props, ref) => {
+    const Element = props.as || defaultElement$2;
+    return /* @__PURE__ */ jsx(Badge, { as: Element, ...props, ref, type: "notification" });
+  }
+);
+const defaultElement$1 = "span";
+const StatusBadge = React.forwardRef(
+  (props, ref) => {
+    const Element = props.as || defaultElement$1;
+    return /* @__PURE__ */ jsx(Badge, { as: Element, ...props, ref, type: "status" });
+  }
+);
+const defaultElement = "div";
+const Tag = ({
+  className,
+  children,
+  compact,
+  as,
+  ...rest
+}) => {
+  const Element = as || defaultElement;
+  const childrenArray = React.Children.toArray(children);
+  const hasLeadingIcon = childrenArray.length > 1 && typeof childrenArray[0] !== "string";
+  const hasTrailingIcon = childrenArray.length > 1 && typeof childrenArray[childrenArray.length - 1] !== "string";
+  return /* @__PURE__ */ jsx(
+    Element,
+    {
+      className: classNames("eds-tag", className, {
+        "eds-tag--leading-icon": hasLeadingIcon,
+        "eds-tag--trailing-icon": hasTrailingIcon,
+        "eds-tag--compact": compact
+      }),
+      ...rest,
+      children
+    }
+  );
+};
+warnAboutMissingStyles("layout", "typography");
+export {
+  Badge,
+  BaseCard,
+  BulletBadge,
+  Contrast,
+  ContrastContext,
+  MediaCard,
+  NavigationCard,
+  NotificationBadge,
+  StatusBadge,
+  Tag,
+  useContrast
 };
-
-warnAboutMissingStyles('layout', 'typography');
-
-export { Badge, BaseCard, BulletBadge, Contrast, ContrastContext, MediaCard, NavigationCard, NotificationBadge, StatusBadge, Tag, useContrast };
 //# sourceMappingURL=layout.esm.js.map