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

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/components/ButtonBar/ButtonBar.stories.js

@@ -50,12 +50,38 @@ export var RightAligned = function RightAligned() {
   return ___EmotionJSX(ButtonBar, {
     align: "right"
   }, ___EmotionJSX(Button, {
+    variant: "link",
+    "data-id": "cancel-button",
+    onPress: function onPress() {
+      return alert('Cancel button pressed');
+    }
+  }, "Cancel"), ___EmotionJSX(Button, {
     variant: "primary",
     "data-id": "next-button",
     onPress: function onPress() {
       return alert('Next button pressed');
     }
-  }, "Next"), ___EmotionJSX(Button, {
+  }, "Next"));
+};
+RightAligned.parameters = {
+  design: {
+    type: 'figma',
+    url: FIGMA_LINKS.buttonBar.rightAligned
+  }
+};
+export var Secondary = function Secondary() {
+  return ___EmotionJSX(ButtonBar, null, ___EmotionJSX(Button, {
+    variant: "primary",
+    "data-id": "save-button",
+    onPress: function onPress() {
+      return alert('Save button pressed');
+    }
+  }, "Save"), ___EmotionJSX(Button, {
+    "data-id": "close-button",
+    onPress: function onPress() {
+      return alert('Close button pressed');
+    }
+  }, "Close"), ___EmotionJSX(Button, {
     variant: "link",
     "data-id": "cancel-button",
     onPress: function onPress() {
@@ -63,9 +89,37 @@ export var RightAligned = function RightAligned() {
     }
   }, "Cancel"));
 };
-RightAligned.parameters = {
+Secondary.parameters = {
   design: {
     type: 'figma',
-    url: FIGMA_LINKS.buttonBar.rightAligned
+    url: FIGMA_LINKS.buttonBar.secondary
+  }
+};
+export var SecondaryRightAligned = function SecondaryRightAligned() {
+  return ___EmotionJSX(ButtonBar, {
+    align: "right"
+  }, ___EmotionJSX(Button, {
+    variant: "link",
+    "data-id": "cancel-button",
+    onPress: function onPress() {
+      return alert('Cancel button pressed');
+    }
+  }, "Cancel"), ___EmotionJSX(Button, {
+    "data-id": "close-button",
+    onPress: function onPress() {
+      return alert('Close button pressed');
+    }
+  }, "Close"), ___EmotionJSX(Button, {
+    variant: "primary",
+    "data-id": "next-button",
+    onPress: function onPress() {
+      return alert('Next button pressed');
+    }
+  }, "Next"));
+};
+SecondaryRightAligned.parameters = {
+  design: {
+    type: 'figma',
+    url: FIGMA_LINKS.buttonBar.secondaryRightAligned
   }
 };

package/lib/components/Tabs/Tabs.stories.js

@@ -4,7 +4,7 @@ import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/insta
 import React, { useState } from 'react';
 import LockIcon from '@pingux/mdi-react/LockIcon';
 import DocsLayout from '../../../.storybook/storybookDocsLayout';
-import { Badge, Icon, Tab, Tabs, Text } from '../../index';
+import { Badge, Box, Icon, Tab, Tabs, Text } from '../../index';
 import TabsReadme from './Tabs.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
@@ -174,11 +174,11 @@ export var ContentSlots = function ContentSlots() {
     marginLeft: 6,
     marginTop: 10
   };
-  var afterTabNode = ___EmotionJSX(Badge, {
+  var afterTabNode = ___EmotionJSX(Box, null, ___EmotionJSX(Badge, {
     variant: "countNeutral",
     sx: nodeSx,
     label: "14"
-  });
+  }));
   return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(Tabs, {
     items: tabs,
     mb: 50

package/lib/components/Tabs/Tabs.style.js

@@ -17,7 +17,6 @@ export var tab = {
   display: 'inline-flex',
   outline: 'none',
   transform: 'translateY(1px)',
-  width: '100%',
   '&.is-focused': {
     '& > span': _objectSpread({}, focusWithCroppedOutline)
   },

package/lib/hooks/useComponentToggle/useComponentToggle.js

@@ -6,9 +6,7 @@ var useComponentToggle = function useComponentToggle(props) {
     ComponentToRenderIfFalse = props.ComponentToRenderIfFalse,
     condition = props.condition,
     onConditionChange = props.onConditionChange;
-  var _useProgressiveState = useProgressiveState(condition, function () {
-      return null;
-    }),
+  var _useProgressiveState = useProgressiveState(condition, false),
     _useProgressiveState2 = _slicedToArray(_useProgressiveState, 2),
     isToggled = _useProgressiveState2[0],
     setIsToggled = _useProgressiveState2[1];

package/lib/hooks/useField/useField.js

@@ -15,6 +15,8 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import { useEffect, useState } from 'react';
 import { mergeProps, useFocusRing, useLabel } from 'react-aria';
 import { useFocusWithin } from '@react-aria/interactions';
+// eslint-disable-next-line import/no-unresolved
+
 import noop from 'lodash/noop';
 import omit from 'lodash/omit';
 import { modes as labelModes } from '../../components/Label/constants';

package/lib/hooks/useProgressiveState/useProgressiveState.js

@@ -1,15 +1,11 @@
 import { useState } from 'react';
-
-/**
- * A custom hook that provides stateful capabilities when the associated prop is not supplied
- * @param {*} prop The intended prop to be controlled by state
- * @param {*} initial The initial state value, used only if the given prop is undefined
- */
 var useProgressiveState = function useProgressiveState(prop, initial) {
   var controlledState = useState(initial);
   if (prop === undefined) {
     return controlledState;
   }
-  return [prop, function () {}];
+  return [prop, function () {
+    return undefined;
+  }];
 };
 export default useProgressiveState;