@skedulo/sked-ui 19.12.2 → 19.16.0

package/README.md

@@ -54,6 +54,30 @@ and
 
     yarn build:declarations:watch
 
+### Merging to master & semantic-release
+
+#### Concurrent merging
+
+Do not in any circumstances merge branches to master while the build pipeline for the last commit is still running.
+
+Doing so will cause the last commit to not be published while other assets relying on it will be.
+
+#### Failed build pipelines on master
+
+Semantic-release will create a new commit at some point in the build pipeline that updates the package version in the source.
+
+If the build fails BEFORE this occurs, then feel free to rerun the build pipeline as it will cleanly re-attempt to release.
+
+If the build fails AFTER a commit is created, then you will not be able to rerun the build pipeline.  This is because the release
+
+process relies on being at the tip of master to release to NPM and a previous pipeline has already added a commit changing the package version.
+
+In this instance you will have to create another commit and merge it through a PR.  If the build pipeline is still broken and needs to be debugged
+
+then the only other option is asking an administrator to rebase master and drop the release commit allowing the release process to cleanly retry.
+
+This is an unfortunate scenario that comes from using semantic-release as it does not do releases idempotently.
+
 ## Contributing
 
 PRs welcome. Please review the [CONTRIBUTING.md](./CONTRIBUTING.md) doc for what is required for any code contributions.

package/dist/components/forms/elements/MultiSearchSelect.d.ts

@@ -1,2 +1,2 @@
 import { ISelectItem, MultiSearchSelectBox } from './interfaces';
-export declare const MultiSearchSelect: <T extends ISelectItem<any>>({ initialSelectedItems, items, id, name, placeholder, autoFocus, className, onSelectedItemsChange, disabled, itemToString, ItemRenderer, MenuItemsRenderer, selectAll, onInputValueChange, onMenuToggle, ...rest }: MultiSearchSelectBox<T>) => JSX.Element;
+export declare const MultiSearchSelect: <T extends ISelectItem<any>>({ initialSelectedItems, items, id, name, placeholder, autoFocus, className, onSelectedItemsChange, disabled, loading, itemToString, ItemRenderer, MenuItemsRenderer, selectAll, onInputValueChange, onMenuToggle, ...rest }: MultiSearchSelectBox<T>) => JSX.Element;

package/dist/components/forms/elements/PlainAsyncMultiSearchSelect.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ISelectItem } from './interfaces';
+export interface IPlainAsyncMultiSearchSelectProps {
+    initialSelectedItems?: ISelectItem[];
+    fetchItems: (searchTerm: string) => Promise<ISelectItem[]>;
+    onSelectedItemsChange: (items: ISelectItem[]) => void;
+}
+export declare const PlainAsyncMultiSearchSelect: React.FC<IPlainAsyncMultiSearchSelectProps>;

package/dist/components/forms/elements/PlainAsyncMultiSearchSelect.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/forms/elements/PlainMultiSearchSelect.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { IMenuProps } from '../../menus/menu/Menu';
+interface ISelectItem {
+    label: string;
+    value: string;
+    disabled?: boolean;
+}
+interface IPlainMultiSelectProps {
+    items: ISelectItem[];
+    initialSelectedItems?: ISelectItem[];
+    onSearchInputChange: (inputValue: string) => void;
+    onSelectedItemsChange: (items: ISelectItem[]) => void;
+    itemToString?: (item: ISelectItem) => string;
+    loading?: boolean;
+}
+export declare const PlainMultiSearchSelect: React.FC<IPlainMultiSelectProps>;
+export interface IPlainMenuRendererProps extends IMenuProps {
+    items: ISelectItem[];
+    isItemSelected: (item: ISelectItem) => boolean;
+    handleItemSelection: (item: ISelectItem, isSelected: boolean) => void;
+    loading: boolean;
+}
+export declare const PlainMenuRenderer: React.ForwardRefExoticComponent<IPlainMenuRendererProps & React.RefAttributes<HTMLUListElement>>;
+export {};

package/dist/components/forms/elements/PlainMultiSearchSelect.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/forms/elements/SearchSelect.d.ts

@@ -2,4 +2,4 @@ import { ISelectItem, SelectBox } from './interfaces';
 /**
  * A searchable select component. Just like it's native counterpart, only a valid listed option is allowed.
  */
-export declare const SearchSelect: <T extends ISelectItem<any>>({ id, name, items, placeholder, autoFocus, className, icon, onSelectedItemChange, disabled, itemToString, ItemRenderer, filterHandler, itemIsValid, getNewItemData, ...rest }: SelectBox<T>) => JSX.Element;
+export declare const SearchSelect: <T extends ISelectItem<any>>({ id, name, items, placeholder, autoFocus, className, icon, onSelectedItemChange, disabled, onMenuToggle, loading, itemToString, ItemRenderer, filterHandler, itemIsValid, getNewItemData, ...rest }: SelectBox<T>) => JSX.Element;

package/dist/components/forms/elements/__tests__/PlainAsyncMultiSearchSelect.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/forms/elements/__tests__/PlainMultiSearchSelect.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/forms/elements/interfaces.d.ts

@@ -80,7 +80,10 @@ interface ISelectBox<T extends ISelectItem> extends ISearchSelect<T> {
      */
     getNewItemData?: (inputValue: string) => T[];
 }
-export declare type SelectBox<T extends ISelectItem> = ISelectBox<T> & CommonComboBoxTypes<T> & Pick<UseComboboxProps<T>, 'initialSelectedItem' | 'selectedItem'>;
+export declare type SelectBox<T extends ISelectItem> = ISelectBox<T> & CommonComboBoxTypes<T> & Pick<UseComboboxProps<T>, 'initialSelectedItem' | 'selectedItem'> & {
+    onMenuToggle?: (isOpen: boolean) => void;
+    loading?: boolean;
+};
 export declare type AsyncSelectBox<T extends ISelectItem> = Omit<SelectBox<T>, 'items' | 'itemIsValid' | 'getNewItemData'> & IAsyncSearchSelect<T>;
 export interface IMultiSearchSelect<T extends ISelectItem> extends ISearchSelect<T> {
     selectAll?: 'enabled' | 'disabled';
@@ -93,6 +96,8 @@ export interface IMultiSearchSelect<T extends ISelectItem> extends ISearchSelect
     onInputValueChange?: UseComboboxProps<T>['onInputValueChange'];
     onSelectedItemsChange: (items: T[]) => void;
 }
-export declare type MultiSearchSelectBox<T extends ISelectItem> = IMultiSearchSelect<T> & CommonComboBoxTypes<T> & Pick<UseMultipleSelectionProps<T>, 'initialSelectedItems' | 'selectedItems'>;
+export declare type MultiSearchSelectBox<T extends ISelectItem> = IMultiSearchSelect<T> & CommonComboBoxTypes<T> & Pick<UseMultipleSelectionProps<T>, 'initialSelectedItems' | 'selectedItems'> & {
+    loading?: boolean;
+};
 export declare type AsyncMultiSearchSelectBox<T extends ISelectItem> = Omit<MultiSearchSelectBox<T>, 'items'> & IAsyncSearchSelect<T>;
 export {};

package/dist/components/forms/elements/select-components.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { UseComboboxGetItemPropsOptions } from 'downshift';
-import { IconNames } from '../../..';
+import { IconNames, IPillProps, IMenuProps } from '../../..';
 import { ISelectItem, ISearchSelect } from './interfaces';
 export interface ISelectMenuItem<T extends ISelectItem> {
     item: T;
@@ -17,22 +17,22 @@ interface ISearchSelectTrigger {
     icon?: IconNames;
 }
 export declare const SearchSelectTrigger: React.FC<ISearchSelectTrigger & React.InputHTMLAttributes<HTMLInputElement>>;
-export declare const SelectMenu: React.ForwardRefExoticComponent<React.RefAttributes<HTMLUListElement>>;
+export declare const SelectMenu: React.ForwardRefExoticComponent<IMenuProps & React.RefAttributes<HTMLUListElement>>;
 export declare const SelectMenuItem: <T extends ISelectItem<any>>({ item, ItemRenderer, index, highlightedIndex, getItemProps }: ISelectMenuItem<T>) => JSX.Element;
+export interface IPlainMultiSelectMenuItemProps extends React.HTMLAttributes<HTMLLIElement> {
+    item: ISelectItem;
+    isSelected: boolean;
+}
+export declare const PlainMultiSelectMenuItem: React.FC<IPlainMultiSelectMenuItemProps>;
 export declare const MultiSelectMenuItem: <T extends ISelectItem<any>>({ item, ItemRenderer, isSelected, index, highlightedIndex, getItemProps }: ISelectMenuItem<T> & {
     isSelected: boolean;
 }) => JSX.Element;
 export declare const SelectEmptyState: React.FC;
-interface IMultiSearchSelectTrigger {
-    wrapperRef: React.RefObject<HTMLDivElement>;
+interface IMultiSearchSelectTriggerProps extends React.HTMLAttributes<HTMLDivElement> {
     hasItems: boolean;
     disabled: boolean;
     className: string;
 }
-export declare const MultiSearchSelectTrigger: React.FC<IMultiSearchSelectTrigger>;
-interface IMultiSelectPill {
-    text: string;
-    onClose: () => void;
-}
-export declare const MultiSelectPill: React.ForwardRefExoticComponent<IMultiSelectPill & React.RefAttributes<HTMLDivElement>>;
+export declare const MultiSearchSelectTrigger: React.ForwardRefExoticComponent<IMultiSearchSelectTriggerProps & React.RefAttributes<HTMLDivElement>>;
+export declare const MultiSelectPill: React.ForwardRefExoticComponent<IPillProps & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/components/forms/elements/select-hooks.d.ts

@@ -25,4 +25,14 @@ export declare const useAutoExpandingInput: ({ defaultInputWidth, inputProps, cl
     setInputValueWidth: React.Dispatch<React.SetStateAction<number>>;
     AutoExpandingInput: JSX.Element;
 };
+export declare function useOnClickOutside(refs: React.RefObject<HTMLElement>[], handler: (event: MouseEvent) => void): void;
+export interface UseRunPromiseState<D> {
+    data: D | undefined;
+    error: Error | undefined;
+    pending: boolean;
+}
+export interface UseRunPromiseRes<D, A extends any[]> extends UseRunPromiseState<D> {
+    run: (...args: A) => void;
+}
+export declare function useRunPromise<D, A extends any[]>(func: (...args: A) => Promise<D>): UseRunPromiseRes<D, A>;
 export {};

package/dist/components/menus/menu/Menu.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export interface IMenuProps extends React.HTMLAttributes<HTMLElement> {
+export interface IMenuProps extends React.HTMLAttributes<HTMLUListElement> {
     className?: string;
 }
 export interface IMenuItemProps extends React.HTMLAttributes<HTMLLIElement> {

package/dist/components/pill/Pill.d.ts

@@ -14,7 +14,7 @@ export interface IPillProps {
     iconName?: IconNames;
     disabled?: boolean;
     className?: string;
-    onClose?: () => void;
+    onClose?: (e: React.MouseEvent) => void;
 }
 /**
  * Creates a Pill. Text will be truncated at 190px and a Tooltip will be enabled

package/dist/index.d.ts

@@ -24,11 +24,14 @@ export * from './components/filter-bar/filter-list/RemoteSearch';
 export * from './components/forms/elements/FormElements';
 export * from './components/forms/elements/NumberInput';
 export { formatReadonlySelect } from './components/forms/elements/select-utils';
+export { useRunPromise, useOnClickOutside } from './components/forms/elements/select-hooks';
 export * from './components/forms/elements/interfaces';
 export * from './components/forms/elements/SearchSelect';
 export * from './components/forms/elements/AsyncSearchSelect';
 export * from './components/forms/elements/MultiSearchSelect';
 export * from './components/forms/elements/AsyncMultiSearchSelect';
+export * from './components/forms/elements/PlainMultiSearchSelect';
+export * from './components/forms/elements/PlainAsyncMultiSearchSelect';
 export * from './components/forms/ReadOnly';
 export * from './components/forms/SkedFormValidation';
 export * from './components/forms/elements/TextArea';