@pingux/astro 1.27.0-alpha.21 → 1.27.0-alpha.22

package/lib/components/FileInputField/FileItem.js

@@ -1,101 +0,0 @@
-import _Object$values from "@babel/runtime-corejs3/core-js-stable/object/values";
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import React, { useCallback, useRef } from 'react';
-import InsertDriveFileIcon from 'mdi-react/InsertDriveFileIcon';
-import ErrorIcon from 'mdi-react/ErrorIcon';
-import DeleteIcon from 'mdi-react/DeleteIcon';
-import PropTypes from 'prop-types';
-import { useVisuallyHidden } from '@react-aria/visually-hidden';
-import { Box, Button, IconButton, Icon, Text } from '../../index';
-import statuses from '../../utils/devUtils/constants/statuses';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-
-var FileItem = function FileItem(props) {
-  var downloadLink = props.downloadLink,
-      handleFileDelete = props.handleFileDelete,
-      id = props.id,
-      isDisabled = props.isDisabled,
-      name = props.name,
-      status = props.status,
-      textProps = props.textProps;
-  var handleDeleteButtonPress = useCallback(function (e) {
-    return handleFileDelete(e, id);
-  }, [id, handleFileDelete]);
-
-  var _useVisuallyHidden = useVisuallyHidden(),
-      visuallyHiddenProps = _useVisuallyHidden.visuallyHiddenProps;
-
-  var downloadRef = useRef();
-  var getFileIconProps = useCallback(function () {
-    switch (status) {
-      case statuses.ERROR:
-        return {
-          icon: ErrorIcon,
-          color: 'critical.dark',
-          'data-testid': 'file-uploaded__file-icon--is-error'
-        };
-
-      default:
-        return {
-          icon: InsertDriveFileIcon,
-          color: 'neutral.10'
-        };
-    }
-  }, [status]);
-
-  var handleDownloadPress = function handleDownloadPress() {
-    downloadRef.current.click();
-  };
-
-  return ___EmotionJSX(Box, {
-    isRow: true,
-    alignItems: "center",
-    mx: 15,
-    my: 5
-  }, ___EmotionJSX(Icon, _extends({
-    size: 15,
-    "data-testid": "file-uploaded__file-icon"
-  }, getFileIconProps(), {
-    isDisabled: isDisabled
-  })), ___EmotionJSX(Button, {
-    variant: "fileInputField",
-    mx: 5,
-    isDisabled: isDisabled,
-    "aria-label": name,
-    "data-testid": "file-uploaded__download-file-button",
-    onPress: handleDownloadPress
-  }, ___EmotionJSX(Text, _extends({
-    color: "active"
-  }, textProps), name)), ___EmotionJSX(IconButton, {
-    "aria-label": "Delete ".concat(name, " file icon"),
-    "data-testid": "file-uploaded__delete-file-button",
-    isDisabled: isDisabled,
-    onPress: handleDeleteButtonPress,
-    sx: {
-      alignSelf: 'auto'
-    }
-  }, ___EmotionJSX(Icon, {
-    icon: DeleteIcon,
-    size: 15,
-    isDisabled: isDisabled
-  })), ___EmotionJSX("a", _extends({
-    href: downloadLink
-  }, visuallyHiddenProps, {
-    download: true,
-    ref: downloadRef,
-    "aria-label": "download",
-    "data-testid": "file-uploaded__download-link",
-    tabIndex: -1
-  })));
-};
-
-export default FileItem;
-FileItem.propTypes = {
-  downloadLink: PropTypes.string,
-  handleFileDelete: PropTypes.func,
-  id: PropTypes.string,
-  isDisabled: PropTypes.bool,
-  name: PropTypes.string,
-  status: PropTypes.oneOf(_Object$values(statuses)),
-  textProps: PropTypes.shape({})
-};

package/lib/components/FileInputField/FileSelect.js

@@ -1,31 +0,0 @@
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Button, Text } from '../../index';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-
-var FileSelect = function FileSelect(props) {
-  var buttonText = props.buttonText,
-      handleFileSelect = props.handleFileSelect,
-      isDisabled = props.isDisabled,
-      textProps = props.textProps;
-  return ___EmotionJSX(Button, {
-    "aria-label": buttonText,
-    "data-testid": "file-input-field__file-select",
-    isDisabled: isDisabled,
-    mx: 15,
-    my: 5,
-    onPress: handleFileSelect,
-    variant: "fileInputField"
-  }, ___EmotionJSX(Text, _extends({
-    color: "active"
-  }, textProps), buttonText));
-};
-
-export default FileSelect;
-FileSelect.propTypes = {
-  buttonText: PropTypes.string,
-  handleFileSelect: PropTypes.func,
-  isDisabled: PropTypes.bool,
-  textProps: PropTypes.shape({})
-};

package/lib/components/FileInputField/index.js

@@ -1 +0,0 @@
-export { default } from './FileInputField';

package/lib/components/HelpHint/HelpHint.js

@@ -1,55 +0,0 @@
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
-var _excluded = ["children", "tooltipProps", "iconButtonProps"];
-import React, { forwardRef } from 'react';
-import PropTypes from 'prop-types';
-import IconButton from '../IconButton';
-import TooltipTrigger, { Tooltip } from '../TooltipTrigger';
-import Icon from '../Icon';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-
-var HelpIcon = function HelpIcon() {
-  return ___EmotionJSX("svg", {
-    width: "7",
-    height: "9",
-    viewBox: "0 0 7 9",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, ___EmotionJSX("path", {
-    d: "M2.56685 7.306V9H4.29385V7.306H2.56685ZM0.795848 3.676H2.41285C2.41285 3.478 2.43485 3.29467 2.47885 3.126C2.52285 2.95 2.58885 2.79967 2.67685 2.675C2.77218 2.543 2.88951 2.44033 3.02885 2.367C3.17551 2.28633 3.34785 2.246 3.54585 2.246C3.83918 2.246 4.06651 2.32667 4.22785 2.488C4.39651 2.64933 4.48085 2.89867 4.48085 3.236C4.48818 3.434 4.45151 3.599 4.37085 3.731C4.29751 3.863 4.19851 3.984 4.07385 4.094C3.94918 4.204 3.81351 4.314 3.66685 4.424C3.52018 4.534 3.38085 4.666 3.24885 4.82C3.11685 4.96667 2.99951 5.14633 2.89685 5.359C2.80151 5.57167 2.74285 5.83567 2.72085 6.151V6.646H4.20585V6.228C4.23518 6.008 4.30485 5.82467 4.41485 5.678C4.53218 5.53133 4.66418 5.403 4.81085 5.293C4.95751 5.17567 5.11151 5.062 5.27285 4.952C5.44151 4.83467 5.59185 4.69533 5.72385 4.534C5.86318 4.37267 5.97685 4.17833 6.06485 3.951C6.16018 3.72367 6.20785 3.434 6.20785 3.082C6.20785 2.86933 6.16018 2.642 6.06485 2.4C5.97685 2.15067 5.82651 1.91967 5.61385 1.707C5.40118 1.49433 5.11885 1.31833 4.76685 1.179C4.42218 1.03233 3.98951 0.959 3.46885 0.959C3.06551 0.959 2.69885 1.02867 2.36885 1.168C2.04618 1.3 1.76751 1.487 1.53285 1.729C1.30551 1.971 1.12585 2.257 0.993848 2.587C0.869181 2.917 0.803181 3.28 0.795848 3.676Z",
-    fill: "#3B4A58"
-  }));
-};
-/**
- * A `HelpHint` is a composed component using tooltip trigger and icon button.
- *
- * For customization the trigger icon,
- * please see the [TooltipTrigger](./?path=/docs/tooltiptrigger--default) docs.
- */
-
-
-var HelpHint = /*#__PURE__*/forwardRef(function (props, ref) {
-  var children = props.children,
-      tooltipProps = props.tooltipProps,
-      iconButtonProps = props.iconButtonProps,
-      others = _objectWithoutProperties(props, _excluded);
-
-  return ___EmotionJSX(TooltipTrigger, _extends({
-    ref: ref,
-    direction: "top"
-  }, others, tooltipProps), ___EmotionJSX(IconButton, _extends({
-    variant: "helpHint",
-    "aria-label": "label help hint",
-    "data-testid": "help-hint__button"
-  }, iconButtonProps), ___EmotionJSX(Icon, {
-    icon: HelpIcon
-  })), ___EmotionJSX(Tooltip, tooltipProps, children));
-});
-HelpHint.propTypes = {
-  /** Props object that is spread directly into the tooltip element. */
-  tooltipProps: PropTypes.shape({}),
-
-  /** Props object that is spread directly into the IconButton element. */
-  iconButtonProps: PropTypes.shape({})
-};
-export default HelpHint;

package/lib/components/HelpHint/HelpHint.stories.js

@@ -1,34 +0,0 @@
-import React from 'react';
-import HelpHint from '.';
-import Box from '../Box';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-export default {
-  title: 'HelpHint',
-  component: HelpHint,
-  argTypes: {
-    children: {
-      description: 'Tooltip content',
-      defaultValue: 'Text of the tooltip right here...',
-      control: {
-        type: 'text'
-      }
-    }
-  }
-};
-export var Default = function Default(args) {
-  return ___EmotionJSX(Box, {
-    p: 50
-  }, ___EmotionJSX(HelpHint, args));
-};
-export var WithTooltipAndIconButtonProps = function WithTooltipAndIconButtonProps() {
-  return ___EmotionJSX(Box, {
-    p: 50
-  }, ___EmotionJSX(HelpHint, {
-    tooltipProps: {
-      direction: 'bottom'
-    },
-    iconButtonProps: {
-      'aria-label': 'Help hint'
-    }
-  }, "Text of the tooltip right here..."));
-};

package/lib/components/HelpHint/HelpHint.test.js

@@ -1,58 +0,0 @@
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import React from 'react';
-import userEvent from '@testing-library/user-event';
-import { fireEvent, render, screen } from '../../utils/testUtils/testWrapper';
-import axeTest from '../../utils/testUtils/testAxe';
-import HelpHint from './HelpHint';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var testId = 'help-hint__button';
-var tooltipValue = 'Some text';
-var defaultProps = {
-  children: tooltipValue
-};
-
-var getComponent = function getComponent() {
-  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return render(___EmotionJSX(HelpHint, _extends({}, defaultProps, props)));
-}; // Need to be added to each test file to test accessibility using axe.
-
-
-axeTest(getComponent);
-test('renders HelpHint component', function () {
-  getComponent();
-  var helpHintButton = screen.getByTestId(testId);
-  expect(helpHintButton).toBeInTheDocument();
-});
-test('shows tooltip on hover', function () {
-  getComponent();
-  var helpHintButton = screen.getByTestId(testId);
-  expect(screen.queryByText(tooltipValue)).not.toBeInTheDocument();
-  fireEvent.mouseMove(helpHintButton);
-  fireEvent.mouseEnter(helpHintButton);
-  expect(screen.getByText(tooltipValue)).toBeInTheDocument();
-});
-test('shows tooltip on focus', function () {
-  getComponent();
-  var helpHintButton = screen.getByTestId(testId);
-  expect(screen.queryByText(tooltipValue)).not.toBeInTheDocument();
-  userEvent.tab();
-  expect(helpHintButton).toHaveFocus();
-  expect(screen.queryByText(tooltipValue)).toBeInTheDocument();
-});
-test('applies tooltipProps', function () {
-  getComponent({
-    tooltipProps: {
-      isOpen: true
-    }
-  });
-  expect(screen.getByText(tooltipValue)).toBeInTheDocument();
-});
-test('applies iconButtonProps', function () {
-  var newLabel = 'New label';
-  getComponent({
-    iconButtonProps: {
-      'aria-label': newLabel
-    }
-  });
-  expect(screen.getByLabelText(newLabel)).toBeInTheDocument();
-});

package/lib/components/HelpHint/index.js

@@ -1 +0,0 @@
-export { default } from './HelpHint';

package/lib/components/Icon/Icon.js

@@ -1,66 +0,0 @@
-import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
-import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
-import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
-import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
-import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
-import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
-import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
-import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
-
-function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, 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 _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-import React, { forwardRef } from 'react';
-import PropTypes from 'prop-types';
-import Box from '../Box';
-/**
- * Basic icon component.
- * Icons will fill the given container, which is '1em' x '1em' by default, and will maintain their
- * aspect ratio.
- * Use SVGR to import SVG files as React components and pass them into this component, and you can
- * use the theme to color the icon. But ensure you pass `dimensions: false` in webpack config
- * (see [SVGR docs](https://react-svgr.com/docs/options/#dimensions)).
- * Otherwise icon will not be resizable by `size` prop.
- * Icons can also be used from the [Material UI Icon Library](https://materialdesignicons.com/).
- * Built on top of the [Box from Theme-UI](https://theme-ui.com/components/box/) and uses the
- * available [props from Theme-UI](https://theme-ui.com/sx-prop).
-*/
-
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var Icon = /*#__PURE__*/forwardRef(function (props, ref) {
-  var color = props.color,
-      IconComponent = props.icon,
-      size = props.size,
-      sx = props.sx;
-  return ___EmotionJSX(Box, _extends({
-    as: IconComponent,
-    ref: ref
-  }, props, {
-    sx: _objectSpread({
-      fill: color,
-      size: "".concat(size, "px"),
-      minWidth: size
-    }, sx)
-  }));
-});
-Icon.propTypes = {
-  /** The icon to render. */
-  icon: PropTypes.elementType.isRequired,
-
-  /**
-   * The size of the icon container. If given a number value, it will be converted to pixels.
-   * Standard icon sizes are 15, 22, and 40.
-  */
-  size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-
-  /** A theme-aware prop to set the icon's color. */
-  color: PropTypes.string
-};
-Icon.defaultProps = {
-  size: 20
-};
-Icon.displayName = 'Icon';
-export default Icon;

package/lib/components/Icon/Icon.stories.js

@@ -1,66 +0,0 @@
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
-import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
-import React from 'react';
-import SearchIcon from 'mdi-react/SearchIcon';
-import Icon from '.';
-import { flatColorList } from '../../styles/colors';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-export default {
-  title: 'Icon',
-  component: Icon,
-  parameters: {
-    docs: {
-      source: {
-        type: 'code'
-      }
-    }
-  },
-  argTypes: {
-    icon: {
-      control: {
-        type: 'none'
-      },
-      defaultValue: SearchIcon,
-      description: 'The icon to render. List of icons at https://materialdesignicons.com/'
-    },
-    size: {
-      control: {
-        type: 'text'
-      },
-      description: 'The size of the icon container. If given a number value, it will be converted to pixels. ' + 'Standard icon sizes are 15, 22, and 40. ' + 'Numeric value and/or paired with a unit. https://www.w3schools.com/cssref/css_units.asp'
-    },
-    color: {
-      control: {
-        type: 'select',
-        options: _mapInstanceProperty(flatColorList).call(flatColorList, function (_ref) {
-          var _ref2 = _slicedToArray(_ref, 1),
-              colorName = _ref2[0];
-
-          return colorName;
-        })
-      },
-      defaultValue: 'active'
-    }
-  }
-};
-export var Default = function Default(args) {
-  return ___EmotionJSX(Icon, args);
-};
-export var SVGIcons = function SVGIcons() {
-  // SVGR can used to convert .svg files to components instead of doing this manually
-  var SVGComponent = function SVGComponent(props) {
-    return ___EmotionJSX("svg", _extends({
-      viewBox: "0 0 24 24"
-    }, props), ___EmotionJSX("path", {
-      fill: "currentColor",
-      d: "M12,4A4,4 0 0,1 16,8A4,4 0 0,1 12,12A4,4 0 0,1 8,8A4,4 0 0,1 12,4M12,14C16.42,14 20,15.79 20,18V20H4V18C4,15.79 7.58,14 12,14Z"
-    }));
-  };
-
-  return ___EmotionJSX(Icon, {
-    icon: SVGComponent,
-    color: "active",
-    size: 40
-  });
-};

package/lib/components/Icon/Icon.test.js

@@ -1,26 +0,0 @@
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import Earth from 'mdi-react/EarthIcon';
-import Icon from '../Icon';
-import axeTest from '../../utils/testUtils/testAxe';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var testId = 'test-icon';
-var defaultProps = {
-  'data-testid': testId,
-  icon: Earth
-};
-
-var getComponent = function getComponent() {
-  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return render(___EmotionJSX(Icon, _extends({}, defaultProps, props)));
-}; // Need to be added to each test file to test accessibility using axe.
-
-
-axeTest(getComponent);
-test('default icon', function () {
-  getComponent();
-  var icon = screen.getByTestId(testId);
-  expect(icon).toBeInstanceOf(SVGSVGElement);
-  expect(icon).toBeInTheDocument();
-});

package/lib/components/Icon/index.js

@@ -1 +0,0 @@
-export { default } from './Icon';

package/lib/components/IconButton/IconButton.js

@@ -1,153 +0,0 @@
-import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
-import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
-import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
-import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
-import _Object$getOwnPropertyDescriptor from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor";
-import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
-import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
-import _Object$keys from "@babel/runtime-corejs3/core-js-stable/object/keys";
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
-import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
-var _excluded = ["children", "className", "title", "onPress", "onPressStart", "onPressEnd", "onPressChange", "onPressUp", "isDisabled"];
-
-function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, 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 _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-import React, { forwardRef, useRef, useImperativeHandle, useContext } from 'react';
-import PropTypes from 'prop-types';
-import { IconButton as ThemeUIIconButton } from 'theme-ui';
-import { useButton } from '@react-aria/button';
-import { useFocusRing } from '@react-aria/focus';
-import { Pressable, useHover } from '@react-aria/interactions';
-import { mergeProps } from '@react-aria/utils';
-import { useAriaLabelWarning, useStatusClasses } from '../../hooks';
-import { ChipContext } from '../Chip/ChipContext';
-import TooltipTrigger, { Tooltip } from '../TooltipTrigger';
-/**
- * Convenience wrapper for a Button + Icon. This component applies specific styles necessary for
- * icons and changes the behavior pattern for Button. This ensures compatibility across browsers
- * and devices.
- *
- * In addition to the props below, `IconButton` accepts the same props available to the normal
- * `Button` component.
- */
-
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var IconButton = /*#__PURE__*/forwardRef(function (props, ref) {
-  var children = props.children,
-      className = props.className,
-      title = props.title,
-      onPress = props.onPress,
-      onPressStart = props.onPressStart,
-      onPressEnd = props.onPressEnd,
-      onPressChange = props.onPressChange,
-      onPressUp = props.onPressUp,
-      isDisabled = props.isDisabled,
-      others = _objectWithoutProperties(props, _excluded);
-
-  var buttonRef = useRef();
-  /* istanbul ignore next */
-
-  useImperativeHandle(ref, function () {
-    return buttonRef.current;
-  });
-
-  var _useButton = useButton(_objectSpread({}, props), buttonRef),
-      buttonProps = _useButton.buttonProps,
-      isPressed = _useButton.isPressed;
-
-  var _useContext = useContext(ChipContext),
-      chipBg = _useContext.bg;
-
-  var _useHover = useHover(props),
-      hoverProps = _useHover.hoverProps,
-      isHovered = _useHover.isHovered;
-
-  var _useFocusRing = useFocusRing(),
-      isFocusVisible = _useFocusRing.isFocusVisible,
-      focusProps = _useFocusRing.focusProps;
-
-  var _useStatusClasses = useStatusClasses(className, {
-    isHovered: isHovered,
-    isPressed: isPressed,
-    isFocused: isFocusVisible,
-    isDisabled: isDisabled
-  }),
-      classNames = _useStatusClasses.classNames;
-
-  var ariaLabel = props['aria-label'] || title;
-  useAriaLabelWarning('IconButton', ariaLabel);
-
-  var button = ___EmotionJSX(ThemeUIIconButton, _extends({
-    tabIndex: 0,
-    ref: buttonRef,
-    className: classNames,
-    "aria-label": ariaLabel,
-    sx: chipBg && isHovered && {
-      'path': {
-        fill: chipBg
-      }
-    }
-  }, mergeProps(buttonProps, others, hoverProps, focusProps)), children);
-
-  if (title) {
-    return ___EmotionJSX(TooltipTrigger, {
-      isDisabled: !title
-    }, ___EmotionJSX(Pressable, null, button), title && ___EmotionJSX(Tooltip, null, title));
-  }
-
-  return button;
-});
-IconButton.propTypes = {
-  /** Styling to apply to the IconButton. */
-  variant: PropTypes.string,
-
-  /** Defines a string value that labels the current element. */
-  'aria-label': PropTypes.string,
-
-  /** Content will be displayed in a tooltip on hover or focus. */
-  title: PropTypes.string,
-
-  /**
-   * Handler that is called when the press is released over the target.
-   * (e: PressEvent) => void
-   */
-  onPress: PropTypes.func,
-
-  /**
-   * Handler that is called when a press interaction starts.
-   * (e: PressEvent) => void
-   */
-  onPressStart: PropTypes.func,
-
-  /**
-   * Handler that is called when a press interaction ends, either over the target or when the
-   * pointer leaves the target.
-   * (e: PressEvent) => void
-   */
-  onPressEnd: PropTypes.func,
-
-  /**
-   * Handler that is called when the press state changes.
-   * (isPressed: boolean) => void
-   */
-  onPressChange: PropTypes.func,
-
-  /**
-   * Handler that is called when a press is released over the target, regardless of whether it
-   * started on the target or not.
-   * (e: PressEvent) => void
-   */
-  onPressUp: PropTypes.func,
-
-  /** Whether the icon is disabled. */
-  isDisabled: PropTypes.bool
-};
-IconButton.defaultProps = {
-  variant: 'iconButton',
-  isDisabled: false
-};
-IconButton.displayName = 'Icon Button';
-export default IconButton;

package/lib/components/IconButton/IconButton.stories.js

@@ -1,67 +0,0 @@
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import React from 'react';
-import CreateIcon from 'mdi-react/CreateIcon';
-import IconButton from '.';
-import Icon from '../Icon';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-export default {
-  title: 'Icon Button',
-  component: IconButton,
-  parameters: {
-    docs: {
-      source: {
-        type: 'code'
-      }
-    }
-  },
-  argTypes: {
-    icon: {
-      control: {
-        type: 'none'
-      },
-      defaultValue: CreateIcon,
-      description: 'The icon to render. List of icons at https://materialdesignicons.com/'
-    },
-    title: {
-      control: {
-        type: 'text'
-      }
-    },
-    'aria-label': {
-      control: {
-        type: 'text'
-      }
-    },
-    isDisabled: {},
-    variant: {
-      control: {
-        type: 'select',
-        options: ['iconButton', 'inverted', 'square', 'invertedSquare']
-      },
-      defaultValue: 'iconButton'
-    }
-  }
-};
-export var Default = function Default(args) {
-  return ___EmotionJSX(IconButton, _extends({
-    "aria-label": "default icon button"
-  }, args), ___EmotionJSX(Icon, {
-    icon: CreateIcon
-  }));
-};
-export var WithTooltip = function WithTooltip() {
-  return ___EmotionJSX(IconButton, {
-    "aria-label": "icon button with tooltip",
-    title: "Edit"
-  }, ___EmotionJSX(Icon, {
-    icon: CreateIcon
-  }));
-};
-export var Disabled = function Disabled() {
-  return ___EmotionJSX(IconButton, {
-    "aria-label": "disabled icon button",
-    isDisabled: true
-  }, ___EmotionJSX(Icon, {
-    icon: CreateIcon
-  }));
-};