@pingux/astro 1.1.1-alpha.0 → 1.1.1-alpha.1

package/lib/components/ScrollBox/ScrollBox.stories.js

@@ -1,26 +0,0 @@
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import React from 'react';
-import ScrollBox from './ScrollBox';
-import Box from '../Box';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-export default {
-  title: 'ScrollBox',
-  component: ScrollBox,
-  argTypes: {
-    maxHeight: {
-      control: {
-        type: 'text'
-      },
-      defaultValue: '100px'
-    }
-  }
-};
-export var Default = function Default(args) {
-  return ___EmotionJSX(ScrollBox, _extends({
-    maxHeight: "100px"
-  }, args), ___EmotionJSX(Box, {
-    sx: {
-      height: '150px'
-    }
-  }, ___EmotionJSX("p", null, "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?")));
-};

package/lib/components/ScrollBox/ScrollBox.test.js

@@ -1,63 +0,0 @@
-import _setTimeout from "@babel/runtime-corejs3/core-js-stable/set-timeout";
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import React from 'react';
-import { fireEvent, render, screen } from '../../utils/testUtils/testWrapper';
-import ScrollBox from './ScrollBox';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var testId = 'scrollBoxTestId';
-var defaultProps = {
-  'data-testid': testId,
-  'maxHeight': '100px'
-};
-
-var getComponent = function getComponent() {
-  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  return render(___EmotionJSX(ScrollBox, _extends({}, defaultProps, props)));
-};
-
-test('maxHeight passes into the component', function () {
-  getComponent();
-  var scrollBoxComponent = screen.getByTestId(testId);
-  expect(scrollBoxComponent).toBeInTheDocument();
-  expect(scrollBoxComponent).toHaveStyle({
-    maxHeight: '100px'
-  });
-});
-test('passing hasShadows renders the shadow css', function () {
-  getComponent({
-    hasShadows: true
-  });
-  var scrollBoxComponent = screen.getByTestId(testId);
-  expect(scrollBoxComponent).toBeInTheDocument();
-  var shadows = screen.getAllByRole('separator');
-  expect(shadows[0]).toHaveClass('has-shadows');
-  expect(shadows[1]).toHaveClass('has-shadows');
-});
-test('with hasShadows prop only the bottom shadow is rendered first', function () {
-  getComponent({
-    hasShadows: true
-  });
-  var scrollBoxComponent = screen.getByTestId(testId);
-  expect(scrollBoxComponent).toBeInTheDocument();
-  var shadows = screen.getAllByRole('separator');
-  expect(shadows[0]).not.toHaveClass('is-top-shadow-showing');
-  expect(shadows[1]).toHaveClass('is-bottom-shadow-showing');
-});
-test('with hasShadows prop only the top shadow is rendered after scroll to down', function () {
-  getComponent({
-    hasShadows: true
-  });
-  var scrollBoxComponent = screen.getByTestId(testId);
-  expect(scrollBoxComponent).toBeInTheDocument();
-  fireEvent.scroll(scrollBoxComponent, {
-    target: {
-      scrollY: 100
-    }
-  });
-  var shadows = screen.getAllByRole('separator');
-
-  _setTimeout(function () {
-    expect(shadows[0]).toHaveClass('is-top-shadow-showing');
-    expect(shadows[1]).not.toHaveClass('is-bottom-shadow-showing');
-  }, 200);
-});

package/lib/components/ScrollBox/index.js

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

package/lib/components/SearchField/SearchField.js

@@ -1,324 +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); if (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 source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty(_context = ownKeys(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors) { _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)); } else { var _context2; _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-import React, { forwardRef, useImperativeHandle, useRef } from 'react';
-import PropTypes from 'prop-types';
-import { useSearchField } from '@react-aria/searchfield';
-import { useSearchFieldState } from '@react-stately/searchfield';
-import SearchIcon from 'mdi-react/SearchIcon';
-import CloseIcon from 'mdi-react/CloseIcon';
-import { useField, usePropWarning } from '../../hooks';
-import { Box, Icon, IconButton, Input, Label } from '../../index';
-/**
- * Renders a search field with associated controls including visual elements and keyboard
- * interaction handlers.
- *
- * Built with [useSearchField](https://react-spectrum.adobe.com/react-aria/useSearchField.html)
- * from React Aria and
- * [useSearchFieldState](https://react-spectrum.adobe.com/react-stately/useSearchFieldState.html)
- * from React Stately.
- */
-
-import { jsx as ___EmotionJSX } from "@emotion/react";
-var SearchField = /*#__PURE__*/forwardRef(function (props, ref) {
-  var autocomplete = props.autocomplete,
-      hasAutoFocus = props.hasAutoFocus,
-      hasNoClearButton = props.hasNoClearButton,
-      icon = props.icon,
-      isExcludedFromTabOrder = props.isExcludedFromTabOrder,
-      label = props.label,
-      controlProps = props.controlProps,
-      iconProps = props.iconProps,
-      labelProps = props.labelProps;
-  var searchRef = useRef();
-  usePropWarning(props, 'disabled', 'isDisabled');
-  /* istanbul ignore next */
-
-  useImperativeHandle(ref, function () {
-    return searchRef.current;
-  });
-  var state = useSearchFieldState(props);
-
-  var _useSearchField = useSearchField(_objectSpread({
-    autoComplete: autocomplete,
-    autoFocus: hasAutoFocus,
-    excludeFromTabOrder: isExcludedFromTabOrder
-  }, props), state, searchRef),
-      raLabelProps = _useSearchField.labelProps,
-      raInputProps = _useSearchField.inputProps,
-      clearButtonProps = _useSearchField.clearButtonProps;
-
-  var _useField = useField(_objectSpread(_objectSpread({}, props), {}, {
-    labelProps: _objectSpread(_objectSpread({}, labelProps), raLabelProps),
-    controlProps: _objectSpread(_objectSpread({}, controlProps), raInputProps)
-  })),
-      fieldContainerProps = _useField.fieldContainerProps,
-      fieldControlProps = _useField.fieldControlProps,
-      fieldLabelProps = _useField.fieldLabelProps;
-
-  return ___EmotionJSX(Box, fieldContainerProps, label && ___EmotionJSX(Label, fieldLabelProps), ___EmotionJSX(Box, {
-    variant: "forms.search.container"
-  }, ___EmotionJSX(Input, _extends({
-    ref: searchRef,
-    pl: 40,
-    pr: 40
-  }, fieldControlProps)), icon && ___EmotionJSX(Icon, _extends({
-    icon: icon,
-    variant: "forms.search.icon",
-    size: 22
-  }, iconProps)), !hasNoClearButton && state.value !== '' && ___EmotionJSX(IconButton, _extends({
-    sx: {
-      position: 'absolute',
-      top: 8,
-      right: 10,
-      path: {
-        fill: 'text.secondary'
-      }
-    }
-  }, clearButtonProps), ___EmotionJSX(Icon, {
-    icon: CloseIcon
-  }))));
-});
-SearchField.propTypes = {
-  /** Describes the type of autocomplete functionality the input should provide if any. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefautocomplete). */
-  autocomplete: PropTypes.string,
-
-  /** The default value (uncontrolled). */
-  defaultValue: PropTypes.string,
-
-  /** Whether the element should receive focus on render. */
-  hasAutoFocus: PropTypes.bool,
-
-  /** Whether to display the clear button or not. */
-  hasNoClearButton: PropTypes.bool,
-
-  /** The icon to display alongside the placeholder text. */
-  icon: PropTypes.elementType,
-
-  /** The element's unique identifier. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id). */
-  id: PropTypes.string,
-
-  /** Whether the input is disabled. */
-  isDisabled: PropTypes.bool,
-
-  /** The content to display as the label. */
-  label: PropTypes.node,
-
-  /** The name of the input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname). */
-  name: PropTypes.string,
-
-  /** Temporary text that occupies the text input when it is empty. */
-  placeholder: PropTypes.string,
-
-  /** The current value (controlled). */
-  value: PropTypes.string,
-
-  /**
-   * Handler that is called when the SearchField is submitted.
-   * (value: string) => void
-   */
-  onSubmit: PropTypes.func,
-
-  /**
-   * Handler that is called when the clear button is pressed.
-   * () => void
-   */
-  onClear: PropTypes.func,
-
-  /**
-   * Handler that is called when the element receives focus.
-   * (e: FocusEvent) => void
-   */
-  onFocus: PropTypes.func,
-
-  /**
-   * Handler that is called when the element loses focus.
-   * (e: FocusEvent) => void
-   */
-  onBlur: PropTypes.func,
-
-  /**
-   * Handler that is called when a key is pressed.
-   * (e: KeyboardEvent) => void
-   */
-  onKeyDown: PropTypes.func,
-
-  /**
-   * Handler that is called when a key is released.
-   * (e: KeyboardEvent) => void
-   */
-  onKeyUp: PropTypes.func,
-
-  /**
-   * Handler that is called when the value changes.
-   * (value: string) => void
-   */
-  onChange: PropTypes.func,
-
-  /**
-   * Indicates whether inputting text could trigger display of one or more predictions of the
-   * user's intended value for an input and specifies how predictions would be presented if they
-   * are made.
-   */
-  'aria-autocomplete': PropTypes.oneOf(['none', 'inline', 'list', 'both']),
-
-  /** Defines a string value that labels the current element. */
-  'aria-label': PropTypes.string,
-
-  /** Identifies the element (or elements) that labels the current element. */
-  'aria-labelledby': PropTypes.string,
-
-  /** Props object that is spread directly into the root (top-level) element. */
-  containerProps: PropTypes.shape({}),
-
-  /** Props object that is spread into the input element. */
-  controlProps: PropTypes.shape({}),
-
-  /** Props object that is spread into the icon element. */
-  iconProps: PropTypes.shape({}),
-
-  /** Props object that is spread into the label element. */
-  labelProps: PropTypes.shape({}),
-  // NOTE: unsurfaced useSearchField / useSearchFieldState props listed below
-
-  /** @ignore Whether the input can be selected but not changed by the user. */
-  isReadOnly: PropTypes.bool,
-
-  /**
-   * @ignore
-   * Whether user input is required on the input before form submission.
-   * Often paired with the necessityIndicator prop to add a visual indicator to the input.
-   */
-  isRequired: PropTypes.bool,
-
-  /**
-   * @ignore
-   * Handler that is called when the element's focus status changes.
-   * (isFocused: boolean) => void
-   */
-  onFocusChange: PropTypes.func,
-
-  /**
-   * @ignore
-   * Identifies the currently active element when DOM focus is on a composite widget, textbox,
-   * group, or application.
-   */
-  'aria-activedescendant': PropTypes.string,
-
-  /**
-   * @ignore
-   * Indicates the availability and type of interactive popup element, such as menu or dialog, that
-   * can be triggered by an element.
-   */
-  'aria-haspopup': PropTypes.oneOf([true, false, 'menu', 'listbox', 'tree', 'grid', 'dialog']),
-
-  /** @ignore Identifies the element (or elements) that describes the object. */
-  'aria-describedby': PropTypes.string,
-
-  /**
-   * @ignore
-   * Identifies the element (or elements) that provide a detailed, extended description for the
-   * object.
-   */
-  'aria-details': PropTypes.string,
-
-  /**
-   * @ignore
-   * Whether to exclude the element from the sequential tab order. If true, the element will not be
-   * focusable via the keyboard by tabbing. This should be avoided except in rare scenarios where
-   * an alternative means of accessing the element or its functionality via the keyboard is
-   * available.
-   */
-  isExcludedFromTabOrder: PropTypes.bool,
-
-  /** The maximum number of characters supported by the input set by the user. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefmaxlength). */
-  maxLength: PropTypes.number,
-
-  /** @ignore The minimum number of characters required by the input. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefminlength). */
-  minLength: PropTypes.number,
-
-  /** @ignore Regex pattern that the value of the input must match to be valid. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefpattern). */
-  pattern: PropTypes.string,
-
-  /** @ignore The type of input to render. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdeftype). */
-  type: PropTypes.string,
-
-  /**
-   * @ignore
-   * Hints at the type of data that might be entered by the user while editing the element or its
-   * contents. See [MDN](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute).
-   */
-  inputMode: PropTypes.oneOf(['none', 'text', 'tel', 'url', 'email', 'numeric', 'decimal', 'search']),
-
-  /**
-   * @ignore
-   * Handler that is called when the user copies text. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/oncopy).
-   */
-  onCopy: PropTypes.func,
-
-  /** @ignore Handler that is called when the user cuts text. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/oncut). */
-  onCut: PropTypes.func,
-
-  /** @ignore Handler that is called when the user pastes text. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/onpaste). */
-  onPaste: PropTypes.func,
-
-  /**
-   * @ignore
-   * Handler that is called when a text composition system starts a new text composition session.
-   * See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/compositionstart_event).
-   */
-  onCompositionStart: PropTypes.func,
-
-  /**
-   * @ignore
-   * Handler that is called when a text composition system completes or cancels the current text
-   * composition session. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/compositionend_event).
-   */
-  onCompositionEnd: PropTypes.func,
-
-  /**
-   * @ignore
-   * Handler that is called when a new character is received in the current text composition
-   * session. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/compositionupdate_event).
-   */
-  onCompositionUpdate: PropTypes.func,
-
-  /**
-   * @ignore
-   * Handler that is called when text in the input is selected. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/select_event).
-   */
-  onSelect: PropTypes.func,
-
-  /**
-   * @ignore
-   * Handler that is called when the input value is about to be modified. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforeinput_event).
-   */
-  onBeforeInput: PropTypes.func,
-
-  /**
-   * @ignore
-   * Handler that is called when the input value is modified. See [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/input_event).
-   */
-  onInput: PropTypes.func,
-
-  /** @ignore Identifies the element that provides an error message for the object. */
-  'aria-errormessage': PropTypes.string
-};
-SearchField.defaultProps = {
-  hasNoClearButton: false,
-  icon: SearchIcon
-};
-SearchField.displayName = 'SearchField';
-export default SearchField;

package/lib/components/SearchField/SearchField.stories.js

@@ -1,137 +0,0 @@
-import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
-import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
-import React, { useState } from 'react';
-import Users from 'mdi-react/AccountGroupIcon';
-import SearchIcon from 'mdi-react/SearchIcon';
-import { SearchField, Box, Text } from '../../index';
-import { useDebounce } from '../../hooks';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-export default {
-  title: 'Form/SearchField',
-  component: SearchField,
-  argTypes: {
-    label: {
-      control: {
-        type: 'text'
-      }
-    },
-    placeholder: {
-      defaultValue: 'Search Groups'
-    },
-    defaultValue: {},
-    icon: {
-      control: {
-        type: 'none'
-      }
-    },
-    isDisabled: {},
-    hasAutoFocus: {},
-    hasNoClearButton: {},
-    autocomplete: {},
-    containerProps: {},
-    iconProps: {},
-    controlProps: {},
-    labelProps: {},
-    name: {},
-    id: {},
-    'aria-label': {
-      control: {
-        type: 'text'
-      }
-    },
-    'aria-labelledby': {
-      control: {
-        type: 'text'
-      }
-    },
-    'aria-autocomplete': {},
-    value: {
-      control: {
-        type: 'none'
-      }
-    }
-  }
-};
-export var Default = function Default(args) {
-  return ___EmotionJSX(SearchField, _extends({}, args, {
-    icon: SearchIcon,
-    "aria-label": "Search Groups",
-    onSubmit: function onSubmit(text) {
-      return alert(text);
-    } // eslint-disable-line no-alert
-
-  }));
-};
-export var Controlled = function Controlled() {
-  var _useState = useState(''),
-      _useState2 = _slicedToArray(_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
-
-  return ___EmotionJSX(SearchField, {
-    value: value,
-    onChange: setValue,
-    "aria-label": "Search Groups",
-    placeholder: "Search Groups",
-    onSubmit: function onSubmit(text) {
-      return alert(text);
-    } // eslint-disable-line no-alert
-
-  });
-};
-export var CustomIcon = function CustomIcon() {
-  return ___EmotionJSX(SearchField, {
-    icon: Users,
-    "aria-label": "Search Users",
-    placeholder: "Search Users",
-    onSubmit: function onSubmit(text) {
-      return alert(text);
-    } // eslint-disable-line no-alert
-
-  });
-};
-export var NoClearButton = function NoClearButton() {
-  return ___EmotionJSX(SearchField, {
-    hasNoClearButton: true,
-    "aria-label": "Search Users",
-    placeholder: "Search Users",
-    onSubmit: function onSubmit(text) {
-      return alert(text);
-    } // eslint-disable-line no-alert
-
-  });
-};
-export var MaxLength = function MaxLength(args) {
-  return ___EmotionJSX(SearchField, _extends({}, args, {
-    icon: SearchIcon,
-    "aria-label": "Search Groups",
-    onSubmit: function onSubmit(text) {
-      return alert(text);
-    } // eslint-disable-line no-alert
-    ,
-    maxLength: 9
-  }));
-};
-export var ControlledWithDebouncedInput = function ControlledWithDebouncedInput() {
-  var _useState3 = useState(''),
-      _useState4 = _slicedToArray(_useState3, 2),
-      value = _useState4[0],
-      setValue = _useState4[1];
-
-  var debouncedSearchText = useDebounce({
-    value: value,
-    delay: 500
-  });
-  return ___EmotionJSX(Box, null, ___EmotionJSX(SearchField, {
-    value: value,
-    onChange: setValue,
-    "aria-label": "Search Groups",
-    placeholder: "Search Groups",
-    onSubmit: function onSubmit(text) {
-      return alert(text);
-    } // eslint-disable-line no-alert
-
-  }), ___EmotionJSX(Text, {
-    mt: "xs"
-  }, "Debounced value: ".concat(debouncedSearchText)));
-};