@pingux/astro 2.33.0-alpha.1 → 2.33.0-alpha.11

package/lib/cjs/hooks/useRockerButton/useRockerButton.d.ts

@@ -0,0 +1,241 @@
+import React from 'react';
+import { MultipleSelectionManager } from 'react-stately';
+import { FocusableElement } from '../../types';
+interface RockerButtonProps {
+    item: {
+        key: string;
+    };
+    isDisabled: boolean;
+    isSelected: boolean;
+}
+declare const useRockerButton: (props: RockerButtonProps, state: {
+    selectionManager: MultipleSelectionManager;
+}, ref: React.RefObject<FocusableElement>) => {
+    rockerButtonProps: {
+        id: string;
+        'aria-pressed': boolean;
+        'aria-disabled': true | undefined;
+        role?: React.AriaRole | undefined;
+        tabIndex?: number | undefined;
+        style?: React.CSSProperties | undefined;
+        className?: string | undefined;
+        'aria-activedescendant'?: string | undefined;
+        'aria-atomic'?: (boolean | "false" | "true") | undefined;
+        'aria-autocomplete'?: "list" | "none" | "both" | "inline" | undefined;
+        'aria-braillelabel'?: string | undefined;
+        'aria-brailleroledescription'?: string | undefined;
+        'aria-busy'?: (boolean | "false" | "true") | undefined;
+        'aria-checked'?: boolean | "mixed" | "false" | "true" | undefined;
+        'aria-colcount'?: number | undefined;
+        'aria-colindex'?: number | undefined;
+        'aria-colindextext'?: string | undefined;
+        'aria-colspan'?: number | undefined;
+        'aria-controls'?: string | undefined;
+        'aria-current'?: boolean | "time" | "page" | "false" | "true" | "step" | "location" | "date" | undefined;
+        'aria-describedby'?: string | undefined;
+        'aria-description'?: string | undefined;
+        'aria-details'?: string | undefined;
+        'aria-dropeffect'?: "link" | "copy" | "none" | "move" | "execute" | "popup" | undefined;
+        'aria-errormessage'?: string | undefined;
+        'aria-expanded'?: (boolean | "false" | "true") | undefined;
+        'aria-flowto'?: string | undefined;
+        'aria-grabbed'?: (boolean | "false" | "true") | undefined;
+        'aria-haspopup'?: boolean | "dialog" | "menu" | "grid" | "listbox" | "tree" | "false" | "true" | undefined;
+        'aria-hidden'?: (boolean | "false" | "true") | undefined;
+        'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
+        'aria-keyshortcuts'?: string | undefined;
+        'aria-label'?: string | undefined;
+        'aria-labelledby'?: string | undefined;
+        'aria-level'?: number | undefined;
+        'aria-live'?: "off" | "assertive" | "polite" | undefined;
+        'aria-modal'?: (boolean | "false" | "true") | undefined;
+        'aria-multiline'?: (boolean | "false" | "true") | undefined;
+        'aria-multiselectable'?: (boolean | "false" | "true") | undefined;
+        'aria-orientation'?: "horizontal" | "vertical" | undefined;
+        'aria-owns'?: string | undefined;
+        'aria-placeholder'?: string | undefined;
+        'aria-posinset'?: number | undefined;
+        'aria-readonly'?: (boolean | "false" | "true") | undefined;
+        'aria-relevant'?: "all" | "text" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+        'aria-required'?: (boolean | "false" | "true") | undefined;
+        'aria-roledescription'?: string | undefined;
+        'aria-rowcount'?: number | undefined;
+        'aria-rowindex'?: number | undefined;
+        'aria-rowindextext'?: string | undefined;
+        'aria-rowspan'?: number | undefined;
+        'aria-selected'?: (boolean | "false" | "true") | undefined;
+        'aria-setsize'?: number | undefined;
+        'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined;
+        'aria-valuemax'?: number | undefined;
+        'aria-valuemin'?: number | undefined;
+        'aria-valuenow'?: number | undefined;
+        'aria-valuetext'?: string | undefined;
+        children?: React.ReactNode;
+        dangerouslySetInnerHTML?: {
+            __html: string | TrustedHTML;
+        } | undefined;
+        onCopy?: React.ClipboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCopyCapture?: React.ClipboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCut?: React.ClipboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCutCapture?: React.ClipboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPaste?: React.ClipboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPasteCapture?: React.ClipboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCompositionEnd?: React.CompositionEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCompositionEndCapture?: React.CompositionEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCompositionStart?: React.CompositionEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCompositionStartCapture?: React.CompositionEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCompositionUpdate?: React.CompositionEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCompositionUpdateCapture?: React.CompositionEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onFocus?: React.FocusEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onFocusCapture?: React.FocusEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onBlur?: React.FocusEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onBlurCapture?: React.FocusEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onChange?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onChangeCapture?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onBeforeInput?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onBeforeInputCapture?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onInput?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onInputCapture?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onReset?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onResetCapture?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSubmit?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSubmitCapture?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onInvalid?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onInvalidCapture?: React.FormEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLoad?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLoadCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onError?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onErrorCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onKeyDown?: React.KeyboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onKeyDownCapture?: React.KeyboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onKeyPress?: React.KeyboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onKeyPressCapture?: React.KeyboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onKeyUp?: React.KeyboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onKeyUpCapture?: React.KeyboardEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAbort?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAbortCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCanPlay?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCanPlayCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCanPlayThrough?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onCanPlayThroughCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDurationChange?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDurationChangeCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onEmptied?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onEmptiedCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onEncrypted?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onEncryptedCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onEnded?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onEndedCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLoadedData?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLoadedDataCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLoadedMetadata?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLoadedMetadataCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLoadStart?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLoadStartCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPause?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPauseCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPlay?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPlayCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPlaying?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPlayingCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onProgress?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onProgressCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onRateChange?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onRateChangeCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onResize?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onResizeCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSeeked?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSeekedCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSeeking?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSeekingCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onStalled?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onStalledCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSuspend?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSuspendCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTimeUpdate?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTimeUpdateCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onVolumeChange?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onVolumeChangeCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onWaiting?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onWaitingCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAuxClick?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAuxClickCapture?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onClick?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onClickCapture?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onContextMenu?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onContextMenuCapture?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDoubleClick?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDoubleClickCapture?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDrag?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragCapture?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragEnd?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragEndCapture?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragEnter?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragEnterCapture?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragExit?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragExitCapture?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragLeave?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragLeaveCapture?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragOver?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragOverCapture?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragStart?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDragStartCapture?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDrop?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onDropCapture?: React.DragEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseDown?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseDownCapture?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseEnter?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseLeave?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseMove?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseMoveCapture?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseOut?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseOutCapture?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseOver?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseOverCapture?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseUp?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onMouseUpCapture?: React.MouseEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSelect?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onSelectCapture?: React.ReactEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTouchCancel?: React.TouchEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTouchCancelCapture?: React.TouchEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTouchEnd?: React.TouchEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTouchEndCapture?: React.TouchEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTouchMove?: React.TouchEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTouchMoveCapture?: React.TouchEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTouchStart?: React.TouchEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTouchStartCapture?: React.TouchEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerDown?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerDownCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerMove?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerMoveCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerUp?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerUpCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerCancel?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerCancelCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerEnter?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerEnterCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerLeave?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerLeaveCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerOver?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerOverCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerOut?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onPointerOutCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onGotPointerCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onGotPointerCaptureCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLostPointerCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onLostPointerCaptureCapture?: React.PointerEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onScroll?: React.UIEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onScrollCapture?: React.UIEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onWheel?: React.WheelEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onWheelCapture?: React.WheelEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAnimationStart?: React.AnimationEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAnimationStartCapture?: React.AnimationEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAnimationEnd?: React.AnimationEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAnimationEndCapture?: React.AnimationEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAnimationIteration?: React.AnimationEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onAnimationIterationCapture?: React.AnimationEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTransitionEnd?: React.TransitionEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+        onTransitionEndCapture?: React.TransitionEventHandler<import("@react-types/shared").FocusableElement> | undefined;
+    };
+};
+export default useRockerButton;

package/lib/cjs/hooks/useSelectField/index.d.ts

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

package/lib/cjs/hooks/useSelectField/useSelectField.d.ts

@@ -0,0 +1,55 @@
+import React, { DOMAttributes, Key } from 'react';
+import { AriaButtonProps } from 'react-aria';
+import { SelectState } from 'react-stately';
+import { CollectionChildren } from '@react-types/shared';
+import { LabelProps as ThemeUILabelProps } from 'theme-ui';
+import { Axis, BoxProps, FocusableElement, PlacementAxis, ReactRef, StyleProps } from '../../types';
+import { FieldControlInputProps } from '../useField/useField';
+interface UseSelectFieldProps<T> {
+    children: CollectionChildren<T>;
+    align?: PlacementAxis;
+    defaultSelectedKey?: string;
+    defaultText?: string;
+    direction?: Axis;
+    disabledKeys?: Iterable<Key>;
+    hasNoEmptySelection?: boolean;
+    isDefaultOpen?: boolean;
+    isDisabled?: boolean;
+    isLoading?: boolean;
+    isNotFlippable?: boolean;
+    isOpen?: boolean;
+    isReadOnly?: boolean;
+    isRequired?: boolean;
+    items?: Iterable<T>;
+    label?: string;
+    listboxStyle?: React.CSSProperties;
+    name?: string;
+    placeholder?: string;
+    selectedKey?: string;
+    onLoadMore?: () => unknown;
+    onOpenChange?: (isOpen: boolean) => unknown;
+    onSelectionChange?: (key: Key) => unknown;
+    controlProps?: React.HTMLAttributes<Element>;
+    scrollBoxProps?: BoxProps;
+    listBoxProps?: BoxProps;
+    labelProps?: ThemeUILabelProps;
+    containerProps?: BoxProps;
+    labelMode: 'default' | 'float' | 'left';
+}
+interface UseSelectFieldReturnProps {
+    columnStyleProps: StyleProps;
+    fieldContainerProps: BoxProps;
+    fieldControlInputProps: FieldControlInputProps;
+    fieldControlWrapperProps: BoxProps;
+    fieldLabelProps: ThemeUILabelProps;
+    isLoadingInitial?: boolean;
+    listBoxRef: ReactRef;
+    overlay: React.ReactNode;
+    popoverRef: ReactRef;
+    state: SelectState<object>;
+    triggerProps: AriaButtonProps<'button'>;
+    triggerRef: ReactRef;
+    valueProps: DOMAttributes<FocusableElement>;
+}
+declare const useSelectField: <T extends object>(props: UseSelectFieldProps<T>, ref: ReactRef) => UseSelectFieldReturnProps;
+export default useSelectField;

package/lib/cjs/hooks/useSelectField/useSelectField.js

@@ -24,7 +24,7 @@ var _reactAria = require("react-aria");
 var _reactStately = require("react-stately");
 var _utils = require("@react-aria/utils");
 var _constants = require("../../components/Label/constants");
-var _ListBox = _interopRequireDefault(require("../../components/ListBox"));
+var _ListBox = _interopRequireDefault(require("../../components/ListBox/ListBox"));
 var _PopoverContainer = _interopRequireDefault(require("../../components/PopoverContainer"));
 var _ScrollBox = _interopRequireDefault(require("../../components/ScrollBox"));
 var _ = require("..");
@@ -32,7 +32,7 @@ var _react2 = require("@emotion/react");
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 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 _context2, _context3; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context2 = ownKeys(Object(source), !0)).call(_context2, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context2, _context3; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context2 = ownKeys(Object(source), !0)).call(_context2, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context3 = ownKeys(Object(source))).call(_context3, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; } // eslint-disable-next-line import/no-unresolved
 var useSelectField = function useSelectField(props, ref) {
   var _context;
   var align = props.align,
@@ -64,8 +64,7 @@ var useSelectField = function useSelectField(props, ref) {
   // We use falsy booleans as defaults, but React Aria has this as true by default so we need to
   // negate this.
   var shouldFlip = !isNotFlippable;
-  var selectProps = _objectSpread({
-    children: children,
+  var selectProps = _objectSpread(_objectSpread({
     defaultSelectedKey: defaultSelectedKey,
     defaultText: defaultText,
     disabledKeys: disabledKeys,
@@ -87,13 +86,14 @@ var useSelectField = function useSelectField(props, ref) {
     disallowEmptySelection: disallowEmptySelection,
     // must match React Aria API
     shouldFlip: shouldFlip
-  }, controlProps);
+  }, controlProps), {}, {
+    children: children
+  });
   // Create state based on the incoming props
   var state = (0, _reactStately.useSelectState)(selectProps);
   var popoverRef = (0, _react.useRef)();
-  var triggerRef = (0, _react.useRef)();
   var listBoxRef = (0, _react.useRef)();
-
+  var triggerRef = (0, _react.useRef)();
   /* istanbul ignore next */
   (0, _react.useImperativeHandle)(ref, function () {
     return triggerRef.current;
@@ -120,7 +120,7 @@ var useSelectField = function useSelectField(props, ref) {
       placeholder: props.labelMode === _constants.modes.FLOAT ? '' : placeholder,
       labelProps: _objectSpread(_objectSpread({}, props.labelProps), labelProps),
       containerProps: _objectSpread({
-        isFloatLabelActive: state.selectedItem
+        isFloatLabelActive: !!state.selectedItem
       }, props.containerProps)
     })),
     fieldContainerProps = _useField.fieldContainerProps,
@@ -152,7 +152,7 @@ var useSelectField = function useSelectField(props, ref) {
   }, [state.isOpen, updatePosition]);
 
   // Measure the width of the input to inform the width of the listbox (below).
-  var _useState = (0, _react.useState)(null),
+  var _useState = (0, _react.useState)(0),
     _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
     buttonWidth = _useState2[0],
     setButtonWidth = _useState2[1];
@@ -161,7 +161,7 @@ var useSelectField = function useSelectField(props, ref) {
     if (triggerRef.current) {
       setButtonWidth(triggerRef.current.offsetWidth);
     }
-  }, [triggerRef, setButtonWidth, state.isOpen]);
+  }, [triggerRef, setButtonWidth]);
   (0, _utils.useResizeObserver)({
     ref: triggerRef,
     onResize: onResize

package/lib/cjs/types/item.d.ts

@@ -1,17 +1,14 @@
-import { CSSProperties, ElementType } from 'react';
+import { ElementType } from 'react';
 import type { ItemProps } from '@react-types/shared';
 import { DOMAttributes, StyleProps } from './shared';
-export interface StylingProps extends DOMAttributes, StyleProps {
-    style?: CSSProperties | string;
-}
 declare module '@react-types/shared' {
     interface ItemProps<T> extends StyleProps, DOMAttributes {
         /** The rendered label for the item. */
         label?: string;
         /** Props for the accordion item content element. */
-        regionProps?: StylingProps;
+        regionProps?: StyleProps;
         /** Props for the accordion item content element. */
-        containerProps?: StylingProps;
+        containerProps?: StyleProps;
         /** Whether the item has a separator */
         isSeparator?: boolean;
         /** Whether the item is pressed */
@@ -23,7 +20,7 @@ declare module '@react-types/shared' {
         /** A URL to link to if elementType="a". */
         href?: string;
         /** Inline styling prop for item */
-        sx?: StylingProps;
+        sx?: StyleProps;
     }
 }
 export default ItemProps;

package/lib/cjs/types/popoverContainer.d.ts

@@ -16,6 +16,7 @@ export interface PopoverContainerProps extends StylePropsExtended, DOMAttributes
     isKeyboardDismissDisabled?: boolean;
     isNonModal?: boolean;
     isDismissable?: boolean;
+    isOpen?: boolean;
 }
 export interface PopoverWrapperProps extends PopoverContainerProps {
     isOpen?: boolean;

package/lib/cjs/types/shared/style.d.ts

@@ -8,4 +8,10 @@ export interface StyleProps extends ThemeUICSSProperties, SxProp {
     variant?: string;
     /** The base HTML tag name or React component type to render */
     as?: string | React.ReactNode | React.ElementType;
+    /** Inline style object that allows you to directly apply CSS styles to the element. */
+    style?: React.CSSProperties | string;
 }
+export type Placement = 'bottom' | 'bottom left' | 'bottom right' | 'bottom start' | 'bottom end' | 'top' | 'top left' | 'top right' | 'top start' | 'top end' | 'left' | 'left top' | 'left bottom' | 'start' | 'start top' | 'start bottom' | 'right' | 'right top' | 'right bottom' | 'end' | 'end top' | 'end bottom';
+export type Axis = 'top' | 'bottom' | 'left' | 'right';
+export type SizeAxis = 'width' | 'height';
+export type PlacementAxis = Axis | 'center';

package/lib/cjs/utils/designUtils/figmaLinks.js

@@ -36,8 +36,10 @@ var FIGMA_LINKS = {
     "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=0-1&t=8Wwd3tIBh3GEjCJB-0'
   },
   buttonBar: {
-    "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=3660%3A20551&mode=dev',
-    rightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=3660%3A20657&mode=dev'
+    "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A753&mode=dev',
+    rightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A770&mode=dev',
+    secondary: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A778&mode=dev',
+    secondaryRightAligned: 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?node-id=46080%3A788&mode=dev'
   },
   calendar: {
     "default": 'https://www.figma.com/file/bpbEw54gTTcdIiZs4PKK1p/Astro-Specs?type=design&node-id=6373%3A25490&t=BoHXzVpQq9Lf7MaU-1'

package/lib/cjs/utils/testUtils/universalComponentTest.d.ts

@@ -1,5 +1,4 @@
-export declare const universalComponentTests: ({ renderComponent, props, rules }: {
+export declare const universalComponentTests: ({ renderComponent, rules }: {
     renderComponent: any;
-    props: any;
     rules?: {} | undefined;
 }) => Promise<void>;

package/lib/cjs/utils/testUtils/universalComponentTest.js

@@ -44,20 +44,22 @@ var ComponentWithRef = function ComponentWithRef(_ref) {
 };
 var universalComponentTests = /*#__PURE__*/function () {
   var _ref3 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(_ref2) {
-    var renderComponent, props, _ref2$rules, rules;
+    var renderComponent, _ref2$rules, rules;
     return _regeneratorRuntime().wrap(function _callee2$(_context2) {
       while (1) switch (_context2.prev = _context2.next) {
         case 0:
-          renderComponent = _ref2.renderComponent, props = _ref2.props, _ref2$rules = _ref2.rules, rules = _ref2$rules === void 0 ? {} : _ref2$rules;
+          renderComponent = _ref2.renderComponent, _ref2$rules = _ref2.rules, rules = _ref2$rules === void 0 ? {} : _ref2$rules;
           test('should have no accessibility violations', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
             var _render, container, results;
             return _regeneratorRuntime().wrap(function _callee$(_context) {
               while (1) switch (_context.prev = _context.next) {
                 case 0:
                   jest.useRealTimers();
-                  _render = (0, _react2.render)(renderComponent(props)), container = _render.container;
+                  _render = (0, _react2.render)(renderComponent()), container = _render.container;
                   _context.next = 4;
-                  return (0, _jestAxe.axe)(container, rules);
+                  return (0, _jestAxe.axe)(container, {
+                    rules: rules
+                  });
                 case 4:
                   results = _context.sent;
                   expect(results).toHaveNoViolations();

package/lib/components/AccordionGridGroup/AccordionGridGroup.test.js

@@ -15,14 +15,21 @@ import React from 'react';
 import { Item } from 'react-stately';
 import userEvent from '@testing-library/user-event';
 import { Box, Link, OverlayPanel, Text, TextField } from '../../index';
-import axeTest from '../../utils/testUtils/testAxe';
 import { act, fireEvent, render, screen, waitFor } from '../../utils/testUtils/testWrapper';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import AccordionGridGroup from '.';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var testId = 'test-accordion';
 var defaultProps = {
   'data-testid': testId
 };
+
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(AccordionGridGroup, props);
+  }
+});
 var getComponent = function getComponent() {
   var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return render(___EmotionJSX(AccordionGridGroup, _extends({}, defaultProps, props), ___EmotionJSX(Item, {
@@ -64,14 +71,6 @@ var getComponentWithTextFields = function getComponentWithTextFields() {
     label: "label 2"
   })))));
 };
-axeTest(getComponent, {
-  // landmark-unique rule conflicts with react-aria role definition
-  rules: {
-    'landmark-unique': {
-      enabled: false
-    }
-  }
-});
 test('button press uses callback', function () {
   var onPress = jest.fn();
   getComponent({

package/lib/components/AccordionGroup/AccordionGroup.test.js

@@ -5,8 +5,8 @@ import React from 'react';
 import { Item } from 'react-stately';
 import userEvent from '@testing-library/user-event';
 import { Box, Button, Menu, OverlayPanel, PopoverMenu, TextField } from '../../index';
-import axeTest from '../../utils/testUtils/testAxe';
 import { act, fireEvent, render, screen } from '../../utils/testUtils/testWrapper';
+import { universalComponentTests } from '../../utils/testUtils/universalComponentTest';
 import { validHeadingTags } from '../AccordionItem/AccordionItem';
 import Text from '../Text';
 import AccordionGroup from '.';
@@ -15,6 +15,13 @@ var testId = 'test-accordion';
 var defaultProps = {
   'data-testid': testId
 };
+
+// Needs to be added to each components test file
+universalComponentTests({
+  renderComponent: function renderComponent(props) {
+    return ___EmotionJSX(AccordionGroup, props);
+  }
+});
 var items = [{
   key: 'identityProvider',
   label: 'some label1',
@@ -147,16 +154,6 @@ var getComponentWithMultipleAccordion = function getComponentWithMultipleAccordi
     "data-id": "connection-configuration-custom-form"
   }, ___EmotionJSX(Box, null, ___EmotionJSX(Text, null, "other text1"), ___EmotionJSX(Text, null, "another text1")))))));
 };
-
-// Need to be added to each test file to test accessibility using axe.
-axeTest(getComponent, {
-  // landmark-unique rule conflicts with react-aria role definition
-  rules: {
-    'landmark-unique': {
-      enabled: false
-    }
-  }
-});
 test('button press uses callback', function () {
   var onPress = jest.fn();
   getComponent({

package/lib/components/ArrayField/ArrayField.js

@@ -16,7 +16,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
-import React, { useCallback, useState } from 'react';
+import React, { forwardRef, useCallback, useState } from 'react';
 import { mergeProps, useLabel } from 'react-aria';
 import PropTypes from 'prop-types';
 import { v4 as uuid } from 'uuid';
@@ -26,7 +26,7 @@ import isValidPositiveInt from '../../utils/devUtils/props/isValidPositiveInt';
 import { ariaAttributesBasePropTypes, getAriaAttributeProps } from '../../utils/docUtils/ariaAttributes';
 import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import { jsx as ___EmotionJSX } from "@emotion/react";
-var ArrayField = function ArrayField(props) {
+var ArrayField = /*#__PURE__*/forwardRef(function (props, ref) {
   var _context2;
   var addButtonLabel = props.addButtonLabel,
     defaultValue = props.defaultValue,
@@ -119,7 +119,9 @@ var ArrayField = function ArrayField(props) {
   var _getAriaAttributeProp = getAriaAttributeProps(others),
     ariaProps = _getAriaAttributeProp.ariaProps,
     nonAriaProps = _getAriaAttributeProp.nonAriaProps;
-  return ___EmotionJSX(Box, nonAriaProps, ___EmotionJSX(Label, _extends({}, raLabelProps, mergeProps(labelProps, raLabelProps, {
+  return ___EmotionJSX(Box, _extends({}, nonAriaProps, {
+    ref: ref
+  }), ___EmotionJSX(Label, _extends({}, raLabelProps, mergeProps(labelProps, raLabelProps, {
     children: label
   }))), ___EmotionJSX(Box, _extends({
     as: "ul",
@@ -150,7 +152,7 @@ var ArrayField = function ArrayField(props) {
     variant: "label",
     color: "active"
   }, addButtonLabel)));
-};
+});
 ArrayField.propTypes = _objectSpread(_objectSpread({
   /** Label for add button */
   addButtonLabel: PropTypes.string,