@codecademy/gamut 72.2.3-alpha.f0a032.0 → 72.2.3-alpha.f43044.0

package/dist/Form/SelectDropdown/core/constants.js

@@ -1,14 +0,0 @@
-import { AbbreviatedSingleValue, CustomContainer, CustomInput, CustomValueContainer, DropdownButton, IconOption, MultiValueRemoveButton, MultiValueWithColorMode, RemoveAllButton } from '../elements';
-export const defaultComponents = {
-  DropdownIndicator: DropdownButton,
-  IndicatorSeparator: () => null,
-  ClearIndicator: RemoveAllButton,
-  SelectContainer: CustomContainer,
-  ValueContainer: CustomValueContainer,
-  MultiValue: MultiValueWithColorMode,
-  MultiValueRemove: MultiValueRemoveButton,
-  Option: IconOption,
-  SingleValue: AbbreviatedSingleValue,
-  Input: CustomInput
-};
-export const ON_CHANGE_ACTION = 'select-option';

package/dist/Form/SelectDropdown/hooks/useSelectHandlers.d.ts

@@ -1,22 +0,0 @@
-import { KeyboardEvent } from 'react';
-import * as React from 'react';
-import { ActionMeta, Options as OptionsType } from 'react-select';
-import { SelectOptionBase } from '../../utils';
-import { MultiSelectDropdownProps, OptionStrict, SelectDropdownGroup, SelectDropdownProps, SingleSelectDropdownProps } from '../types';
-interface UseSelectHandlersArgs {
-    onChange?: SingleSelectDropdownProps['onChange'] | MultiSelectDropdownProps['onChange'];
-    multiple?: boolean;
-    onCreateOption?: (inputValue: string) => void;
-    selectOptions: SelectOptionBase[] | SelectDropdownGroup[];
-    value?: SelectDropdownProps['value'];
-    currentFocusedValue: unknown;
-    removeAllButtonRef: React.MutableRefObject<HTMLDivElement | null>;
-}
-interface UseSelectHandlersReturn {
-    activated: boolean;
-    multiValues: OptionStrict[] | false;
-    changeHandler: (optionEvent: OptionStrict | OptionsType<OptionStrict>, actionMeta: ActionMeta<OptionStrict>) => void;
-    keyPressHandler: (e: KeyboardEvent<HTMLDivElement>) => void;
-}
-export declare const useSelectHandlers: ({ onChange, multiple, onCreateOption, selectOptions, value, currentFocusedValue, removeAllButtonRef, }: UseSelectHandlersArgs) => UseSelectHandlersReturn;
-export {};

package/dist/Form/SelectDropdown/hooks/useSelectHandlers.js

@@ -1,62 +0,0 @@
-import { useCallback, useEffect, useState } from 'react';
-import { ON_CHANGE_ACTION } from '../core/constants';
-import { filterValueFromOptions, getCreatedOptionValue, isMultipleSelectProps, isOptionsGrouped, isSingleSelectProps, removeValueFromSelectedOptions } from '../core/utils';
-export const useSelectHandlers = ({
-  onChange,
-  multiple,
-  onCreateOption,
-  selectOptions,
-  value,
-  currentFocusedValue,
-  removeAllButtonRef
-}) => {
-  const [activated, setActivated] = useState(false);
-  const [multiValues, setMultiValues] = useState(multiple ? filterValueFromOptions(selectOptions, value, isOptionsGrouped(selectOptions)) : false);
-
-  // Sync multi-select value from props when controlled (`value` is a string[]).
-  // Uncontrolled multi (`value` undefined or '') keeps selection in local state.
-  useEffect(() => {
-    if (!multiple || !Array.isArray(value)) return;
-    const newMultiValues = filterValueFromOptions(selectOptions, value, isOptionsGrouped(selectOptions));
-    if (newMultiValues !== multiValues) setMultiValues(newMultiValues);
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [selectOptions, value, multiple]);
-  const changeHandler = useCallback((optionEvent, actionMeta) => {
-    setActivated(true);
-    if (actionMeta.action === 'create-option') {
-      const createdValue = getCreatedOptionValue(optionEvent, actionMeta, multiple);
-      if (createdValue) onCreateOption?.(createdValue);
-    }
-    const onChangeProps = {
-      onChange,
-      multiple
-    };
-    const forwardedMeta = actionMeta.action === 'create-option' ? actionMeta : {
-      action: ON_CHANGE_ACTION,
-      option: isMultipleSelectProps(onChangeProps) ? undefined : optionEvent
-    };
-    if (isSingleSelectProps(onChangeProps)) {
-      onChangeProps.onChange?.(optionEvent, forwardedMeta);
-    }
-    if (isMultipleSelectProps(onChangeProps)) {
-      setMultiValues(optionEvent);
-      onChangeProps.onChange?.(optionEvent, forwardedMeta);
-    }
-  }, [onChange, multiple, onCreateOption]);
-  const keyPressHandler = e => {
-    if (multiple && e.key === 'Enter' && currentFocusedValue && multiValues) {
-      const newMultiValues = removeValueFromSelectedOptions(multiValues, currentFocusedValue);
-      if (newMultiValues !== multiValues) setMultiValues(newMultiValues);
-    }
-    if (removeAllButtonRef.current !== null && e.key === 'ArrowRight' && multiValues && currentFocusedValue === multiValues[multiValues.length - 1].value) {
-      removeAllButtonRef.current.focus();
-    }
-  };
-  return {
-    activated,
-    multiValues,
-    changeHandler,
-    keyPressHandler
-  };
-};

package/dist/Form/SelectDropdown/hooks/useSelectOptions.d.ts

@@ -1,14 +0,0 @@
-import { SelectOptionBase } from '../../utils';
-import { SelectDropdownGroup, SelectDropdownOptions, SelectDropdownSizes } from '../types';
-interface UseSelectOptionsArgs {
-    options?: SelectDropdownOptions | SelectDropdownGroup[];
-    id?: string;
-    size?: SelectDropdownSizes['size'];
-    value?: string | string[];
-}
-interface UseSelectOptionsReturn {
-    selectOptions: SelectOptionBase[] | SelectDropdownGroup[];
-    parsedValue: SelectOptionBase | undefined;
-}
-export declare const useSelectOptions: ({ options, id, size, value, }: UseSelectOptionsArgs) => UseSelectOptionsReturn;
-export {};

package/dist/Form/SelectDropdown/hooks/useSelectOptions.js

@@ -1,39 +0,0 @@
-import { useMemo } from 'react';
-import { parseOptions } from '../../utils';
-import { isOptionsGrouped } from '../core/utils';
-export const useSelectOptions = ({
-  options,
-  id,
-  size,
-  value
-}) => {
-  const selectOptions = useMemo(() => {
-    if (!options || Array.isArray(options) && !options.length || typeof options === 'object' && !Array.isArray(options) && Object.keys(options).length === 0) {
-      return [];
-    }
-    if (isOptionsGrouped(options)) {
-      return options;
-    }
-    return parseOptions({
-      options,
-      id,
-      size
-    });
-  }, [options, id, size]);
-  const parsedValue = useMemo(() => {
-    if (isOptionsGrouped(selectOptions)) {
-      for (const group of selectOptions) {
-        if (group.options) {
-          const foundOption = group.options.find(option => option.value === value);
-          if (foundOption) return foundOption;
-        }
-      }
-      return undefined;
-    }
-    return selectOptions.find(option => option.value === value);
-  }, [selectOptions, value]);
-  return {
-    selectOptions,
-    parsedValue
-  };
-};