@geneui/components 2.11.1

package/Icon.js

@@ -0,0 +1,63 @@
+import { _ as _extends } from './_rollupPluginBabelHelpers-e8fb2e5c.js';
+import React__default from 'react';
+import { c as classnames } from './index-6ff23041.js';
+import { p as propTypesExports } from './index-e0af0caf.js';
+import './globalStyling-9c60a159.js';
+import { s as styleInject } from './style-inject.es-746bb8ed.js';
+
+var css_248z = "[data-gene-ui-version=\"2.11.0\"] .icon{display:block;font-size:2.4rem}[data-gene-ui-version=\"2.11.0\"] .icon.disabled{opacity:.5;pointer-events:none}[data-gene-ui-version=\"2.11.0\"] .icon.bc-icon-loader{overflow:hidden}[data-gene-ui-version=\"2.11.0\"] .icon.bc-icon-loader:before{animation:loader-icon .3s linear infinite;display:block}@keyframes loader-icon{to{transform:rotate(1turn)}}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .bc-icon-arrow-right-nav:before{content:\"\\e906\"}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .bc-icon-arrow-left-nav:before{content:\"\\e90a\"}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .bc-icon-arrow-right:before{content:\"\\e907\"}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .bc-icon-arrow-left:before{content:\"\\e90b\"}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .bc-icon-arrow-forward:before{content:\"\\e901\"}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .bc-icon-left-outline:before{content:\"\\e959\"}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .bc-icon-right-outline:before{content:\"\\e955\"}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .bc-icon-forwards:before{content:\"\\e95b\"}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .bc-icon-backwards:before{content:\"\\e95a\"}";
+styleInject(css_248z);
+
+// This this because in production we need to replace 'nonames.com' with host
+// but in development mode we need to put 'nonames.com'
+function getMainHost() {
+  const parts = window.location.host.split('.');
+  if (parts.length < 2) return 'nonamens.com';
+  return "".concat(parts[parts.length - 2], ".").concat(parts[parts.length - 1]);
+}
+const host = process.env.REACT_APP_ICON_URL || process.env.REACT_APP_NODE === 'production' ? getMainHost() : 'nonamens.com';
+if (process.env.REACT_APP_CUSTOM_ICON_URL) {
+  document.head.appendChild(document.createElement('style')).textContent = "@import url('".concat(window.location.protocol, "//").concat(window.location.host, "/core-icons/import.css?v=").concat(Math.floor(Math.random() * 666) + 1);
+} else {
+  document.head.appendChild(document.createElement('style')).textContent = "@import url('https://sharedassets.".concat(host, "/core-icons/import.css?v=").concat(Math.floor(Math.random() * 666) + 1);
+}
+function Icon(_ref) {
+  let {
+    type,
+    disabled,
+    className,
+    isFilled,
+    ...restProps
+  } = _ref;
+  return /*#__PURE__*/React__default.createElement("i", _extends({}, restProps, {
+    className: classnames('icon', className, {
+      [type]: !!type,
+      disabled
+    })
+  }));
+}
+Icon.propTypes = {
+  /**
+   * Type is the exact icon. You can find valid "type" values in the documentation example
+   */
+  type: propTypesExports.string,
+  /**
+   * Additional className
+   */
+  className: propTypesExports.string,
+  /**
+   * Icon disabled state
+   */
+  disabled: propTypesExports.bool,
+  /**
+   * Will fill the icon when set to "true"
+   */
+  isFilled: propTypesExports.bool
+};
+Icon.defaultProps = {
+  disabled: false,
+  isFilled: false,
+  type: ''
+};
+
+export { Icon as default };

package/Image.js

@@ -0,0 +1,130 @@
+import { _ as _extends } from './_rollupPluginBabelHelpers-e8fb2e5c.js';
+import React__default, { useMemo } from 'react';
+import { p as propTypesExports } from './index-e0af0caf.js';
+import { c as classnames } from './index-6ff23041.js';
+import Empty from './Empty.js';
+import Tooltip from './Tooltip.js';
+import Checkbox from './Checkbox.js';
+import './globalStyling-9c60a159.js';
+import { s as styleInject } from './style-inject.es-746bb8ed.js';
+import './Popover-f4d1cac0.js';
+import './_commonjsHelpers-24198af3.js';
+import 'react-dom';
+import './configs-91c86664.js';
+import './index-ac59cb10.js';
+import './dateValidation-67caec66.js';
+import './useDeviceType-dd51db38.js';
+import './useWindowSize-80369d76.js';
+import './GeneUIProvider.js';
+import './checkboxRadioSwitcher-5b69d7bd.js';
+import './guid-8ddf77b3.js';
+
+var css_248z = "[data-gene-ui-version=\"2.11.0\"] .image-holder{--image-border-radius:1rem;padding:100% 0 0;position:relative;transition:box-shadow .4s;-webkit-user-select:none;user-select:none;width:100%}[data-gene-ui-version=\"2.11.0\"] .image-holder.with-border{--distance:0.8rem;--image-border-radius:0.6rem;border-radius:1rem;box-shadow:inset 0 0 0 1px rgba(var(--background-sc-rgb),.2)}[data-gene-ui-version=\"2.11.0\"] .image-holder.with-border:hover{box-shadow:inset 0 0 0 1px rgba(var(--background-sc-rgb),.5)}[data-gene-ui-version=\"2.11.0\"] .image-holder.with-border.error{box-shadow:inset 0 0 0 1px rgba(var(--danger-rgb),.5)}[data-gene-ui-version=\"2.11.0\"] .image-holder.with-border.error:hover{box-shadow:inset 0 0 0 1px var(--danger)}[data-gene-ui-version=\"2.11.0\"] .image-content{bottom:var(--distance,0);left:var(--distance,0);position:absolute;right:var(--distance,0);top:var(--distance,0)}[data-gene-ui-version=\"2.11.0\"] .image-content img{border-radius:var(--image-border-radius);display:block;height:100%;object-fit:cover;width:100%}[data-gene-ui-version=\"2.11.0\"] .image-label-holder{background:#0003;border-radius:var(--image-border-radius);cursor:pointer;height:100%;left:0;position:absolute;top:0;width:100%}[data-gene-ui-version=\"2.11.0\"] .image-heading{align-items:center;display:flex;left:0;padding:0 .7rem;position:absolute;top:1.2rem;width:100%}[data-gene-ui-version=\"2.11.0\"] .image-heading>li{margin:0 .5rem}[data-gene-ui-version=\"2.11.0\"] .image-heading>li.image-cra{background:#fff;border-radius:.3rem;flex-shrink:0}[data-gene-ui-version=\"2.11.0\"] .image-heading>li.image-title{color:#fff;flex:auto;font:700 1.2rem/2rem var(--font-family)}[data-gene-ui-version=\"2.11.0\"] .image-actions-holder{align-items:center;background:#0009;border-radius:var(--image-border-radius);display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;transition:opacity .4s,visibility .4s;width:100%}[data-gene-ui-version=\"2.11.0\"] .image-holder:not(:hover) .image-actions-holder{opacity:0;visibility:hidden}[data-gene-ui-version=\"2.11.0\"] .image-actions{align-items:center;display:flex}[data-gene-ui-version=\"2.11.0\"] .image-actions>*{box-shadow:inset 0 0 0 5rem #ffffffe6}html:not([dir=rtl]) .image-actions>*+*{margin-left:.5rem}html[dir=rtl] .image-actions>*+*{margin-right:.5rem}[data-gene-ui-version=\"2.11.0\"] .image-empty-state-holder{bottom:0;left:0;margin:auto;position:absolute;right:0;top:0}";
+styleInject(css_248z);
+
+function Image(_ref) {
+  let {
+    src,
+    withBorder,
+    selectMode,
+    actions,
+    title,
+    imageProps,
+    checkboxProps,
+    className,
+    isValid,
+    tooltipTitle,
+    emptyText,
+    ...restProps
+  } = _ref;
+  const isValidSource = useMemo(() => typeof src === 'string' && src !== '', [src]);
+  return /*#__PURE__*/React__default.createElement(Tooltip, {
+    title: tooltipTitle
+  }, /*#__PURE__*/React__default.createElement("div", _extends({
+    className: classnames('image-holder', className, {
+      'with-border': withBorder,
+      error: !isValid
+    })
+  }, restProps), isValidSource ? /*#__PURE__*/React__default.createElement("div", {
+    className: "image-content"
+  }, /*#__PURE__*/React__default.createElement("img", _extends({
+    src: src,
+    alt: title
+  }, imageProps)), selectMode && /*#__PURE__*/React__default.createElement("label", {
+    className: "image-label-holder"
+  }, /*#__PURE__*/React__default.createElement("ul", {
+    className: "image-heading"
+  }, /*#__PURE__*/React__default.createElement("li", {
+    className: "image-cra"
+  }, /*#__PURE__*/React__default.createElement(Checkbox, _extends({
+    size: "big"
+  }, checkboxProps))), title && /*#__PURE__*/React__default.createElement("li", {
+    className: "image-title ellipsis-text"
+  }, title))), actions && !selectMode && /*#__PURE__*/React__default.createElement("div", {
+    className: "image-actions-holder"
+  }, title && /*#__PURE__*/React__default.createElement("ul", {
+    className: "image-heading"
+  }, /*#__PURE__*/React__default.createElement("li", {
+    className: "image-title ellipsis-text"
+  }, title)), /*#__PURE__*/React__default.createElement("div", {
+    className: "image-actions"
+  }, actions))) : /*#__PURE__*/React__default.createElement(Empty, {
+    type: "data",
+    title: emptyText,
+    className: "image-empty-state-holder"
+  })));
+}
+Image.propTypes = {
+  /**
+   * Image path to display
+   */
+  src: propTypesExports.string.isRequired,
+  /**
+   * Will add a border when set to "true"
+   */
+  withBorder: propTypesExports.bool,
+  /**
+   * The property will add a checkbox and an overlay over the image.
+   */
+  selectMode: propTypesExports.bool,
+  /**
+   * Customize checkbox(will be rendered only when "selectMode" is set to "true").
+   */
+  checkboxProps: propTypesExports.object,
+  /**
+   * Customize image tag with this property.
+   */
+  imageProps: propTypesExports.object,
+  /**
+   * The property will render "actions" when "selectMode" is not setted to "true". Any valid React node
+   */
+  actions: propTypesExports.node,
+  /**
+   * Will add a title to the top of Image atom. Any valid React node
+   */
+  title: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
+  /**
+   * Title for 'Tooltip'.
+   */
+  tooltipTitle: propTypesExports.oneOfType([propTypesExports.string, propTypesExports.node]),
+  /**
+   * Addional className
+   */
+  className: propTypesExports.string,
+  /**
+   * Image atom also can be included in "Form" organism. It can be validated as other "Form" elements
+   */
+  isValid: propTypesExports.bool,
+  /**
+   * Empty state text for component
+   */
+  emptyText: propTypesExports.string
+};
+Image.defaultProps = {
+  withBorder: false,
+  selectMode: false,
+  isValid: true,
+  emptyText: 'No image to display'
+};
+
+export { Image as default };

package/ImagePreview.js

@@ -0,0 +1,99 @@
+import './_rollupPluginBabelHelpers-e8fb2e5c.js';
+import 'react';
+import './index-e0af0caf.js';
+export { I as default } from './index-0cf65939.js';
+import './Portal.js';
+import './index-b7a33c58.js';
+import './Editor.js';
+import './_commonjsHelpers-24198af3.js';
+import 'react-dom';
+import './index-6ff23041.js';
+import './index-ac59cb10.js';
+import './dateValidation-67caec66.js';
+import './useMount-6fef51a5.js';
+import './useDeviceType-dd51db38.js';
+import './configs-91c86664.js';
+import './useWindowSize-80369d76.js';
+import './Button.js';
+import './Icon.js';
+import './globalStyling-9c60a159.js';
+import './style-inject.es-746bb8ed.js';
+import './ValidatableUploader.js';
+import './index-d9e8a888.js';
+import './Grid.js';
+import './useWidth-9f4647f8.js';
+import './useKeyDown-38102ae7.js';
+import './BusyLoader.js';
+import './Image.js';
+import './Empty.js';
+import './Tooltip.js';
+import './Popover-f4d1cac0.js';
+import './GeneUIProvider.js';
+import './Checkbox.js';
+import './checkboxRadioSwitcher-5b69d7bd.js';
+import './guid-8ddf77b3.js';
+import './ExtendedInput.js';
+import './index-5cea9a7d.js';
+import './useClickOutside-5183e396.js';
+import './Scrollbar.js';
+import './ValidatableRadio.js';
+import './RadioGroup.js';
+import './Radio.js';
+import './ValidatableCheckbox.js';
+import './ValidatableSwitcher.js';
+import './Switcher.js';
+import './ValidatableNumberInput.js';
+import './ValidatableTextInput.js';
+import './ValidatableDatePicker.js';
+import './index-5e722d91.js';
+import './index-702bf24a.js';
+import './index-122432cd.js';
+import './debounce-4419bc2f.js';
+import './DatePicker.js';
+import './localization-4ba17032.js';
+import './checkTimeValidation-e56771be.js';
+import './useEllipsisDetection-ef536015.js';
+import './Tabs.js';
+import './Steps.js';
+import './index-a4635754.js';
+import './Timeline.js';
+import './Card.js';
+import './MobilePopup.js';
+import './Menu.js';
+import './Option.js';
+import './SkeletonLoader.js';
+import './KeyValue.js';
+import './configs.js';
+import './Tag.js';
+import './Alert.js';
+import './index-00fe8887.js';
+import './rangeAndSlider-20599da4.js';
+import './Slider.js';
+import './Pagination.js';
+import './Divider.js';
+import './objectWithoutPropertiesLoose-299691d8.js';
+import './clsx.m-2bb6df4b.js';
+import './index-a59530cd.js';
+import './Notification.js';
+import './Modal.js';
+import './Collapse.js';
+import './Status.js';
+import './Avatar.js';
+import './Search.js';
+import './TextLink.js';
+import './Label.js';
+import './Paper.js';
+import './Badge.js';
+import './Time.js';
+import './Title.js';
+import './QRCode.js';
+import './Progress.js';
+import './MobileNavigation.js';
+import './Products.js';
+import './Breadcrumb.js';
+import './Section.js';
+import './ColorPicker.js';
+import './NavigationMenu.js';
+import './Textarea.js';
+import './AdvancedSearch.js';
+import './LinkButton.js';

package/KeyValue.js

@@ -0,0 +1,63 @@
+import { _ as _extends } from './_rollupPluginBabelHelpers-e8fb2e5c.js';
+import React__default from 'react';
+import { p as propTypesExports } from './index-e0af0caf.js';
+import { c as classnames } from './index-6ff23041.js';
+import Icon from './Icon.js';
+import { keyValueConfig } from './configs.js';
+import './globalStyling-9c60a159.js';
+import { s as styleInject } from './style-inject.es-746bb8ed.js';
+
+var css_248z = "[data-gene-ui-version=\"2.11.0\"] .geneKeyValue{align-items:flex-start;display:flex;flex-wrap:wrap;width:100%}[data-gene-ui-version=\"2.11.0\"] .geneKeyValue--horizontal{align-items:center;flex-wrap:nowrap}[data-gene-ui-version=\"2.11.0\"] .geneKeyValue__icon{padding:0 0 0 8px}[data-gene-ui-version=\"2.11.0\"] .geneKeyValue__label{color:#3c4043b3;flex:1 1;font-size:12px;font-weight:600;line-height:24px;margin:0 0 1rem 1rem;max-width:100%;width:100%}[data-gene-ui-version=\"2.11.0\"] .geneKeyValue__label--horizontal{flex:none;margin:0 0 0 1rem;max-width:50%;width:auto}[data-gene-ui-version=\"2.11.0\"] .geneKeyValue__value{font-size:14px;font-weight:600;line-height:24px;margin:0 1rem;max-width:100%;width:100%}[data-gene-ui-version=\"2.11.0\"] .geneKeyValue__value--horizontal{margin:0 1rem;max-width:50%}[data-gene-ui-version=\"2.11.0\"] .geneKeyValue__iconWrapper+p+p:not(.geneKeyValue__value--horizontal){margin:0 3.2rem 0 4.2rem}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .geneKeyValue__iconWrapper+p+p:not(.geneKeyValue__value--horizontal){margin:0 3.2rem 0 0}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .geneKeyValue__label{direction:ltr;margin:0 1rem 1rem 0}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .geneKeyValue__label--horizontal{margin:0 0 0 1rem}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .geneKeyValue__value{direction:ltr}[data-gene-ui-version=\"2.11.0\"] [dir=rtl] .geneKeyValue__iconWrapper+p:not(.geneKeyValue__label--horizontal){margin:0 0 1rem}";
+styleInject(css_248z);
+
+// TODO need to refine where is using restProps
+function KeyValue(_ref) {
+  var _keyValueConfig$appea, _keyValueConfig$appea2, _keyValueConfig$appea3, _keyValueConfig$appea4;
+  let {
+    label,
+    value,
+    className,
+    icon,
+    appearance,
+    ...restProps
+  } = _ref;
+  return /*#__PURE__*/React__default.createElement("div", _extends({}, restProps, {
+    className: classnames("geneKeyValue ".concat(className), (_keyValueConfig$appea = keyValueConfig.appearance[appearance]) === null || _keyValueConfig$appea === void 0 ? void 0 : _keyValueConfig$appea.parentItemClassName)
+  }), icon && /*#__PURE__*/React__default.createElement("div", {
+    className: "geneKeyValue__iconWrapper"
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    type: icon,
+    className: classnames('geneKeyValue__icon', (_keyValueConfig$appea2 = keyValueConfig.appearance[appearance]) === null || _keyValueConfig$appea2 === void 0 ? void 0 : _keyValueConfig$appea2.iconClassName)
+  })), /*#__PURE__*/React__default.createElement("p", {
+    role: "heading",
+    "aria-level": "1",
+    className: classnames('geneKeyValue__label ellipsis-text', (_keyValueConfig$appea3 = keyValueConfig.appearance[appearance]) === null || _keyValueConfig$appea3 === void 0 ? void 0 : _keyValueConfig$appea3.labelClassName)
+  }, label), /*#__PURE__*/React__default.createElement("p", {
+    className: classnames('geneKeyValue__value ellipsis-text', (_keyValueConfig$appea4 = keyValueConfig.appearance[appearance]) === null || _keyValueConfig$appea4 === void 0 ? void 0 : _keyValueConfig$appea4.valueClassName)
+  }, value));
+}
+KeyValue.propTypes = {
+  /**
+   * Label for 'KeyValue'.
+   */
+  label: propTypesExports.node.isRequired,
+  /**
+   * Value for 'KeyValue'.
+   */
+  value: propTypesExports.node,
+  /**
+   * External/Additional className that can be added to 'KeyValue' component.
+   */
+  className: propTypesExports.string,
+  /**
+   * The way how the KeyValue should be displayed.
+   */
+  appearance: propTypesExports.oneOf(Object.keys(keyValueConfig.appearance))
+};
+KeyValue.defaultProps = {
+  value: '',
+  className: '',
+  appearance: keyValueConfig.appearance.horizontal._key
+};
+
+export { KeyValue as default };

package/Label.js

@@ -0,0 +1,58 @@
+import React__default from 'react';
+import { p as propTypesExports } from './index-e0af0caf.js';
+import { c as classnames } from './index-6ff23041.js';
+import './globalStyling-9c60a159.js';
+import { s as styleInject } from './style-inject.es-746bb8ed.js';
+
+var css_248z = "[data-gene-ui-version=\"2.11.0\"] .label{display:inline-block;font-weight:400;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:top;white-space:nowrap}[data-gene-ui-version=\"2.11.0\"] .label.bold{font-weight:bolder}[data-gene-ui-version=\"2.11.0\"] .label.semiBold{font-weight:700}";
+styleInject(css_248z);
+
+const labels = {
+  headingExtraLarge: 'h1',
+  headingLarge: 'h1',
+  headingBig: 'h2',
+  heading: 'h3',
+  bodyBig: 'h4',
+  body: 'h5',
+  bodySmall: 'h6',
+  content: 'p'
+};
+function Label(_ref) {
+  let {
+    children,
+    className,
+    size,
+    font,
+    ...restProps
+  } = _ref;
+  return /*#__PURE__*/React__default.createElement(labels[size], {
+    className: classnames('label', className, font, {
+      large: size === 'headingExtraLarge'
+    }),
+    ...restProps
+  }, children);
+}
+Label.propTypes = {
+  /**
+   * Any valid React node.
+   */
+  children: propTypesExports.string.isRequired,
+  /**
+   * Label sizing
+   */
+  size: propTypesExports.oneOf(['headingExtraLarge', 'headingLarge', 'headingBig', 'heading', 'bodyBig', 'body', 'bodySmall', 'content']),
+  /**
+   * Label font to be used
+   */
+  font: propTypesExports.oneOf(['regular', 'semiBold', 'bold']),
+  /**
+   * Addional className
+   */
+  className: propTypesExports.string
+};
+Label.defaultProps = {
+  size: 'content',
+  font: 'regular'
+};
+
+export { Label as default };

package/LinkButton.js

@@ -0,0 +1,104 @@
+import { _ as _extends } from './_rollupPluginBabelHelpers-e8fb2e5c.js';
+import React__default, { useCallback, useMemo } from 'react';
+import { p as propTypesExports } from './index-e0af0caf.js';
+import { c as classnames } from './index-6ff23041.js';
+import { s as styleInject } from './style-inject.es-746bb8ed.js';
+import Icon from './Icon.js';
+import { n as noop } from './index-b7a33c58.js';
+import './globalStyling-9c60a159.js';
+import './dateValidation-67caec66.js';
+import './_commonjsHelpers-24198af3.js';
+import 'react-dom';
+
+var css_248z = "[data-gene-ui-version=\"2.11.0\"] .linkButton{align-items:center;color:var(--hero);cursor:pointer;display:flex;max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding:0 .8rem}[data-gene-ui-version=\"2.11.0\"] .linkButton:focus-visible{border-radius:.4rem;outline:.2rem var(--hero) solid}[data-gene-ui-version=\"2.11.0\"] .linkButton__icon{display:inline-block}[data-gene-ui-version=\"2.11.0\"] .linkButton-disable{opacity:.3;pointer-events:none}";
+styleInject(css_248z);
+
+function LinkButton(_ref) {
+  let {
+    href,
+    onClick,
+    children,
+    iconAfter,
+    className,
+    iconBefore,
+    isDisabled,
+    onMouseDown,
+    ariaLabel,
+    ...restProps
+  } = _ref;
+  const onClickHandler = useCallback(e => onClick(e), [href]);
+  const onMouseDownHandler = useCallback(e => onMouseDown(e), [href]);
+  const attributes = useMemo(() => ({
+    className: classnames('linkButton', {
+      'linkButton-disable': isDisabled
+    }, className),
+    onMouseDown: onMouseDownHandler,
+    onClick: onClickHandler,
+    ...(ariaLabel ? {
+      'aria-label': ariaLabel
+    } : {}),
+    ...restProps
+  }), [isDisabled, className, onMouseDownHandler, onClickHandler, restProps]);
+  const content = useMemo(() => /*#__PURE__*/React__default.createElement(React__default.Fragment, null, iconBefore && /*#__PURE__*/React__default.createElement(Icon, {
+    type: iconBefore,
+    className: "linkButton__icon"
+  }), children, iconAfter && /*#__PURE__*/React__default.createElement(Icon, {
+    type: iconAfter,
+    className: "linkButton__icon"
+  })), [iconBefore, children, iconAfter]);
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, href ? /*#__PURE__*/React__default.createElement("a", _extends({}, attributes, {
+    href: href
+  }), content) : /*#__PURE__*/React__default.createElement("button", _extends({}, attributes, {
+    type: "button"
+  }), content));
+}
+LinkButton.propTypes = {
+  /**
+   * Href for <code>\<a\></code> tag if you don't pass instead of <code>\<a\></code> tag will be <code>\<button\></code> tag .
+   */
+  href: propTypesExports.string,
+  /**
+   * Fires event when user click on LinkButton.
+   * <br>
+   * <code>(event: Event) => void </code>
+   */
+  onClick: propTypesExports.func,
+  /**
+   * Fires event when the element has been pressed.
+   * <br>
+   * <code>(event: Event) => void</code>
+   */
+  onMouseDown: propTypesExports.func,
+  /**
+   * The LinkButton additional className.
+   */
+  className: propTypesExports.string,
+  /**
+   * Any valid React node.
+   */
+  children: propTypesExports.node,
+  /**
+   * Icon to render before the LinkButton. Should be an icon component's type.
+   */
+  iconBefore: propTypesExports.string,
+  /**
+   * Icon to render after the LinkButton. Should be an icon component's type.
+   */
+  iconAfter: propTypesExports.string,
+  /**
+   * Makes the LinkButton disabled.
+   */
+  isDisabled: propTypesExports.bool,
+  /**
+   * aria-label for button or LinkButton.
+   */
+  ariaLabel: propTypesExports.string
+};
+LinkButton.defaultProps = {
+  children: 'LinkButton example',
+  isDisabled: false,
+  onMouseDown: noop
+};
+LinkButton.displayName = 'LinkButton';
+
+export { LinkButton as default };