@codecademy/gamut 72.2.4-alpha.503c2e.0 → 72.2.4-alpha.628984.0

package/dist/Form/SelectDropdown/elements/controls.js

@@ -1,50 +1,23 @@
-import _styled from "@emotion/styled/base";
-import { css, theme } from '@codecademy/gamut-styles';
-import { useContext } from 'react';
 import { components as SelectDropdownElements } from 'react-select';
 import { indicatorIcons } from './constants';
-import { SelectDropdownContext } from './containers';
 import { jsx as _jsx } from "react/jsx-runtime";
 const {
   DropdownIndicator
 } = SelectDropdownElements;
 
-/**
- * Generates accessible focus messages for screen readers.
- * Provides detailed information about the currently focused option.
- *
- * @param params - Object containing the focused option details
- * @returns Formatted accessibility message
- */
-export const onFocus = ({
-  focused: {
-    label,
-    subtitle,
-    rightLabel,
-    disabled
-  }
-}) => {
-  const formattedSubtitle = `, ${subtitle}`;
-  const formattedRightLabel = `, ${rightLabel}`;
-  const msg = `You are currently focused on option ${label}${subtitle ? formattedSubtitle : ''} ${rightLabel ? formattedRightLabel : ''}${disabled ? ', disabled' : ''}`;
-  return msg;
-};
-
 /**
  * Custom dropdown indicator that shows either a chevron or search icon.
  * The icon type depends on whether the select is searchable or not.
  */
 export const DropdownButton = props => {
   const {
-    size,
-    isSearchable
+    size
   } = props.selectProps;
   const color = props.isDisabled ? 'text-disabled' : 'text';
   const iconSize = size ?? 'medium';
-  const iconType = isSearchable ? 'Searchable' : 'Chevron';
   const {
     ...iconProps
-  } = indicatorIcons[`${iconSize}${iconType}`];
+  } = indicatorIcons[`${iconSize}Chevron`];
   const {
     icon: IndicatorIcon
   } = iconProps;
@@ -55,66 +28,4 @@ export const DropdownButton = props => {
       color: color
     })
   });
-};
-const CustomStyledRemoveAllDiv = /*#__PURE__*/_styled('div', {
-  target: "e1xkmr70",
-  label: "CustomStyledRemoveAllDiv"
-})(css({
-  '&:focus': {
-    outline: `2px solid ${theme.colors.primary}`
-  },
-  '&:focus-visible': {
-    outline: `2px solid ${theme.colors.primary}`
-  }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL2NvbnRyb2xzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxRGlDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL2NvbnRyb2xzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcywgdGhlbWUgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgS2V5Ym9hcmRFdmVudCwgdXNlQ29udGV4dCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7XG4gIEFyaWFPbkZvY3VzLFxuICBjb21wb25lbnRzIGFzIFNlbGVjdERyb3Bkb3duRWxlbWVudHMsXG59IGZyb20gJ3JlYWN0LXNlbGVjdCc7XG5cbmltcG9ydCB7IEV4dGVuZGVkT3B0aW9uLCBTaXplZEluZGljYXRvclByb3BzIH0gZnJvbSAnLi4vdHlwZXMnO1xuaW1wb3J0IHsgaW5kaWNhdG9ySWNvbnMgfSBmcm9tICcuL2NvbnN0YW50cyc7XG5pbXBvcnQgeyBTZWxlY3REcm9wZG93bkNvbnRleHQgfSBmcm9tICcuL2NvbnRhaW5lcnMnO1xuXG5jb25zdCB7IERyb3Bkb3duSW5kaWNhdG9yIH0gPSBTZWxlY3REcm9wZG93bkVsZW1lbnRzO1xuXG4vKipcbiAqIEdlbmVyYXRlcyBhY2Nlc3NpYmxlIGZvY3VzIG1lc3NhZ2VzIGZvciBzY3JlZW4gcmVhZGVycy5cbiAqIFByb3ZpZGVzIGRldGFpbGVkIGluZm9ybWF0aW9uIGFib3V0IHRoZSBjdXJyZW50bHkgZm9jdXNlZCBvcHRpb24uXG4gKlxuICogQHBhcmFtIHBhcmFtcyAtIE9iamVjdCBjb250YWluaW5nIHRoZSBmb2N1c2VkIG9wdGlvbiBkZXRhaWxzXG4gKiBAcmV0dXJucyBGb3JtYXR0ZWQgYWNjZXNzaWJpbGl0eSBtZXNzYWdlXG4gKi9cbmV4cG9ydCBjb25zdCBvbkZvY3VzOiBBcmlhT25Gb2N1czxFeHRlbmRlZE9wdGlvbj4gPSAoe1xuICBmb2N1c2VkOiB7IGxhYmVsLCBzdWJ0aXRsZSwgcmlnaHRMYWJlbCwgZGlzYWJsZWQgfSxcbn0pID0+IHtcbiAgY29uc3QgZm9ybWF0dGVkU3VidGl0bGUgPSBgLCAke3N1YnRpdGxlfWA7XG4gIGNvbnN0IGZvcm1hdHRlZFJpZ2h0TGFiZWwgPSBgLCAke3JpZ2h0TGFiZWx9YDtcblxuICBjb25zdCBtc2cgPSBgWW91IGFyZSBjdXJyZW50bHkgZm9jdXNlZCBvbiBvcHRpb24gJHtsYWJlbH0ke1xuICAgIHN1YnRpdGxlID8gZm9ybWF0dGVkU3VidGl0bGUgOiAnJ1xuICB9ICR7cmlnaHRMYWJlbCA/IGZvcm1hdHRlZFJpZ2h0TGFiZWwgOiAnJ30ke2Rpc2FibGVkID8gJywgZGlzYWJsZWQnIDogJyd9YDtcblxuICByZXR1cm4gbXNnO1xufTtcblxuLyoqXG4gKiBDdXN0b20gZHJvcGRvd24gaW5kaWNhdG9yIHRoYXQgc2hvd3MgZWl0aGVyIGEgY2hldnJvbiBvciBzZWFyY2ggaWNvbi5cbiAqIFRoZSBpY29uIHR5cGUgZGVwZW5kcyBvbiB3aGV0aGVyIHRoZSBzZWxlY3QgaXMgc2VhcmNoYWJsZSBvciBub3QuXG4gKi9cbmV4cG9ydCBjb25zdCBEcm9wZG93bkJ1dHRvbiA9IChwcm9wczogU2l6ZWRJbmRpY2F0b3JQcm9wcykgPT4ge1xuICBjb25zdCB7IHNpemUsIGlzU2VhcmNoYWJsZSB9ID0gcHJvcHMuc2VsZWN0UHJvcHM7XG4gIGNvbnN0IGNvbG9yID0gcHJvcHMuaXNEaXNhYmxlZCA/ICd0ZXh0LWRpc2FibGVkJyA6ICd0ZXh0JztcbiAgY29uc3QgaWNvblNpemUgPSBzaXplID8/ICdtZWRpdW0nO1xuICBjb25zdCBpY29uVHlwZSA9IGlzU2VhcmNoYWJsZSA/ICdTZWFyY2hhYmxlJyA6ICdDaGV2cm9uJztcbiAgY29uc3QgeyAuLi5pY29uUHJvcHMgfSA9IGluZGljYXRvckljb25zW2Ake2ljb25TaXplfSR7aWNvblR5cGV9YF07XG4gIGNvbnN0IHsgaWNvbjogSW5kaWNhdG9ySWNvbiB9ID0gaWNvblByb3BzO1xuXG4gIHJldHVybiAoXG4gICAgPERyb3Bkb3duSW5kaWNhdG9yIHsuLi5wcm9wc30+XG4gICAgICA8SW5kaWNhdG9ySWNvbiB7Li4uaWNvblByb3BzfSBjb2xvcj17Y29sb3J9IC8+XG4gICAgPC9Ecm9wZG93bkluZGljYXRvcj5cbiAgKTtcbn07XG5cbmNvbnN0IEN1c3RvbVN0eWxlZFJlbW92ZUFsbERpdiA9IHN0eWxlZCgnZGl2JykoXG4gIGNzcyh7XG4gICAgJyY6Zm9jdXMnOiB7XG4gICAgICBvdXRsaW5lOiBgMnB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnByaW1hcnl9YCxcbiAgICB9LFxuICAgICcmOmZvY3VzLXZpc2libGUnOiB7XG4gICAgICBvdXRsaW5lOiBgMnB4IHNvbGlkICR7dGhlbWUuY29sb3JzLnByaW1hcnl9YCxcbiAgICB9LFxuICB9KVxuKTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGFsbCBidXR0b24gZm9yIG11bHRpLXNlbGVjdCBtb2RlLlxuICogUHJvdmlkZXMga2V5Ym9hcmQgbmF2aWdhdGlvbiBhbmQgYWNjZXNzaWJsZSByZW1vdmFsIG9mIGFsbCBzZWxlY3RlZCB2YWx1ZXMuXG4gKi9cbmV4cG9ydCBjb25zdCBSZW1vdmVBbGxCdXR0b24gPSAocHJvcHM6IFNpemVkSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3Qge1xuICAgIGdldFN0eWxlcyxcbiAgICBpbm5lclByb3BzOiB7IC4uLnJlc3RJbm5lclByb3BzIH0sXG4gICAgc2VsZWN0UHJvcHM6IHsgc2l6ZSB9LFxuICB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyByZW1vdmVBbGxCdXR0b25SZWYsIHNlbGVjdElucHV0UmVmIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IGljb25TaXplID0gc2l6ZSA/PyAnbWVkaXVtJztcbiAgY29uc3QgeyAuLi5pY29uUHJvcHMgfSA9IGluZGljYXRvckljb25zW2Ake2ljb25TaXplfVJlbW92ZWBdO1xuICBjb25zdCB7IGljb246IEluZGljYXRvckljb24gfSA9IGljb25Qcm9wcztcblxuICBjb25zdCBvbktleVByZXNzID0gKGU6IEtleWJvYXJkRXZlbnQ8SFRNTERpdkVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIHJlc3RJbm5lclByb3BzLm9uTW91c2VEb3duKSB7XG4gICAgICByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bihlIGFzIGFueSk7XG4gICAgfVxuXG4gICAgaWYgKFxuICAgICAgc2VsZWN0SW5wdXRSZWY/LmN1cnJlbnQgJiZcbiAgICAgIChlLmtleSA9PT0gJ0Fycm93UmlnaHQnIHx8IGUua2V5ID09PSAnQXJyb3dMZWZ0JyB8fCBlLmtleSA9PT0gJ0Fycm93RG93bicpXG4gICAgKSB7XG4gICAgICBzZWxlY3RJbnB1dFJlZi5jdXJyZW50LmZvY3VzKCk7XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IHN0eWxlID0gZ2V0U3R5bGVzKCdjbGVhckluZGljYXRvcicsIHByb3BzKSBhcyBSZWFjdC5DU1NQcm9wZXJ0aWVzO1xuXG4gIHJldHVybiAoXG4gICAgPEN1c3RvbVN0eWxlZFJlbW92ZUFsbERpdlxuICAgICAgYXJpYS1sYWJlbD1cIlJlbW92ZSBhbGwgc2VsZWN0ZWRcIlxuICAgICAgcm9sZT1cImJ1dHRvblwiXG4gICAgICB0YWJJbmRleD17MH1cbiAgICAgIHsuLi5yZXN0SW5uZXJQcm9wc31cbiAgICAgIHJlZj17cmVtb3ZlQWxsQnV0dG9uUmVmIGFzIFJlYWN0LlJlZjxIVE1MRGl2RWxlbWVudD59XG4gICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgZ2FtdXQvbm8taW5saW5lLXN0eWxlXG4gICAgICBzdHlsZT17c3R5bGV9XG4gICAgICBvbktleURvd249e29uS2V5UHJlc3N9XG4gICAgPlxuICAgICAgPEluZGljYXRvckljb24gey4uLmljb25Qcm9wc30gY29sb3I9XCJ0ZXh0XCIgLz5cbiAgICA8L0N1c3RvbVN0eWxlZFJlbW92ZUFsbERpdj5cbiAgKTtcbn07XG4iXX0= */");
-
-/**
- * Custom remove all button for multi-select mode.
- * Provides keyboard navigation and accessible removal of all selected values.
- */
-export const RemoveAllButton = props => {
-  const {
-    getStyles,
-    innerProps: {
-      ...restInnerProps
-    },
-    selectProps: {
-      size
-    }
-  } = props;
-  const {
-    removeAllButtonRef,
-    selectInputRef
-  } = useContext(SelectDropdownContext);
-  const iconSize = size ?? 'medium';
-  const {
-    ...iconProps
-  } = indicatorIcons[`${iconSize}Remove`];
-  const {
-    icon: IndicatorIcon
-  } = iconProps;
-  const onKeyPress = e => {
-    if (e.key === 'Enter' && restInnerProps.onMouseDown) {
-      restInnerProps.onMouseDown(e);
-    }
-    if (selectInputRef?.current && (e.key === 'ArrowRight' || e.key === 'ArrowLeft' || e.key === 'ArrowDown')) {
-      selectInputRef.current.focus();
-    }
-  };
-  const style = getStyles('clearIndicator', props);
-  return /*#__PURE__*/_jsx(CustomStyledRemoveAllDiv, {
-    "aria-label": "Remove all selected",
-    role: "button",
-    tabIndex: 0,
-    ...restInnerProps,
-    ref: removeAllButtonRef
-    // eslint-disable-next-line gamut/no-inline-style
-    ,
-    style: style,
-    onKeyDown: onKeyPress,
-    children: /*#__PURE__*/_jsx(IndicatorIcon, {
-      ...iconProps,
-      color: "text"
-    })
-  });
 };

package/dist/Form/SelectDropdown/elements/index.d.ts

@@ -1,5 +1,6 @@
 export { iconSize, selectedIconSize, indicatorIcons } from './constants';
 export { MultiValueWithColorMode, MultiValueRemoveButton, RemoveAllButton, } from './multi-value';
-export { DropdownButton, onFocus } from './controls';
+export { DropdownButton } from './controls';
+export { onFocus } from '../core/accessibility';
 export { SelectDropdownContext, CustomContainer, CustomInput, CustomValueContainer, TypedReactSelect, } from './containers';
 export { IconOption, AbbreviatedSingleValue, formatOptionLabel, formatGroupLabel, } from './options';

package/dist/Form/SelectDropdown/elements/index.js

@@ -1,5 +1,6 @@
 export { iconSize, selectedIconSize, indicatorIcons } from './constants';
 export { MultiValueWithColorMode, MultiValueRemoveButton, RemoveAllButton } from './multi-value';
-export { DropdownButton, onFocus } from './controls';
+export { DropdownButton } from './controls';
+export { onFocus } from '../core/accessibility';
 export { SelectDropdownContext, CustomContainer, CustomInput, CustomValueContainer, TypedReactSelect } from './containers';
 export { IconOption, AbbreviatedSingleValue, formatOptionLabel, formatGroupLabel } from './options';

package/dist/Form/SelectDropdown/elements/multi-value.js

@@ -75,7 +75,7 @@ const CustomStyledRemoveAllDiv = /*#__PURE__*/_styled('div', {
   '&:focus-visible': {
     outline: `2px solid ${theme.colors.primary}`
   }
-}, ";label:CustomStyledRemoveAllDiv;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2RUUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0Zvcm0vU2VsZWN0RHJvcGRvd24vZWxlbWVudHMvbXVsdGktdmFsdWUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTWluaURlbGV0ZUljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBLZXlib2FyZEV2ZW50LCB1c2VDb250ZXh0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHtcbiAgY29tcG9uZW50cyBhcyBTZWxlY3REcm9wZG93bkVsZW1lbnRzLFxuICBHcm91cEJhc2UsXG4gIE11bHRpVmFsdWVQcm9wcyxcbiAgTXVsdGlWYWx1ZVJlbW92ZVByb3BzLFxufSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5pbXBvcnQgeyBFeHRlbmRlZE9wdGlvbiwgU2l6ZWRJbmRpY2F0b3JQcm9wcyB9IGZyb20gJy4uL3R5cGVzJztcbmltcG9ydCB7IGluZGljYXRvckljb25zIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuaW1wb3J0IHsgU2VsZWN0RHJvcGRvd25Db250ZXh0IH0gZnJvbSAnLi9jb250YWluZXJzJztcblxuY29uc3QgeyBNdWx0aVZhbHVlLCBNdWx0aVZhbHVlUmVtb3ZlIH0gPSBTZWxlY3REcm9wZG93bkVsZW1lbnRzO1xuXG4vKipcbiAqIEN1c3RvbSBtdWx0aS12YWx1ZSBjb21wb25lbnQgdGhhdCBtYW5hZ2VzIGZvY3VzIHN0YXRlIGZvciBrZXlib2FyZCBuYXZpZ2F0aW9uLlxuICogVHJhY2tzIHdoaWNoIG11bHRpLXZhbHVlIGlzIGN1cnJlbnRseSBmb2N1c2VkIGFuZCB1cGRhdGVzIHRoZSBjb250ZXh0IGFjY29yZGluZ2x5LlxuICovXG5leHBvcnQgY29uc3QgTXVsdGlWYWx1ZVdpdGhDb2xvck1vZGUgPSAoXG4gIHByb3BzOiBNdWx0aVZhbHVlUHJvcHM8RXh0ZW5kZWRPcHRpb24sIHRydWUsIEdyb3VwQmFzZTxFeHRlbmRlZE9wdGlvbj4+XG4pID0+IHtcbiAgY29uc3QgeyBjdXJyZW50Rm9jdXNlZFZhbHVlLCBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IHsgZGF0YSB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyB2YWx1ZSwgbGFiZWwgfSA9IGRhdGE7XG5cbiAgaWYgKFxuICAgIHByb3BzLmlzRm9jdXNlZCAmJlxuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUgJiZcbiAgICBjdXJyZW50Rm9jdXNlZFZhbHVlICE9PSB2YWx1ZVxuICApIHtcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlKHZhbHVlKTtcbiAgfVxuXG4gIGlmIChcbiAgICAhcHJvcHMuaXNGb2N1c2VkICYmXG4gICAgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSAmJlxuICAgIGN1cnJlbnRGb2N1c2VkVmFsdWUgPT09IHZhbHVlXG4gICkge1xuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUodW5kZWZpbmVkKTtcbiAgfVxuICBjb25zdCBkaXNwbGF5VGV4dCA9IGRhdGE/LmFiYnJldmlhdGlvbiA/IGRhdGEuYWJicmV2aWF0aW9uIDogbGFiZWwgfHwgJyc7XG5cbiAgcmV0dXJuIDxNdWx0aVZhbHVlIHsuLi5wcm9wc30+e2Rpc3BsYXlUZXh0fTwvTXVsdGlWYWx1ZT47XG59O1xuXG4vKipcbiAqIEN1c3RvbSByZW1vdmUgYnV0dG9uIGZvciBtdWx0aS12YWx1ZSBpdGVtcy5cbiAqIFByb3ZpZGVzIGFjY2Vzc2libGUgcmVtb3ZhbCBmdW5jdGlvbmFsaXR5IHdpdGggcHJvcGVyIEFSSUEgbGFiZWxzLlxuICovXG5leHBvcnQgY29uc3QgTXVsdGlWYWx1ZVJlbW92ZUJ1dHRvbiA9IChcbiAgcHJvcHM6IE11bHRpVmFsdWVSZW1vdmVQcm9wczxFeHRlbmRlZE9wdGlvbiwgdHJ1ZSwgR3JvdXBCYXNlPEV4dGVuZGVkT3B0aW9uPj5cbikgPT4ge1xuICBjb25zdCB7IGxhYmVsIH0gPSBwcm9wcz8uZGF0YSA/PyB7IGxhYmVsOiAnJyB9O1xuXG4gIHByb3BzLmlubmVyUHJvcHNbJ2FyaWEtbGFiZWwnXSA9IGBSZW1vdmUgJHtsYWJlbH1gO1xuXG4gIHJldHVybiAoXG4gICAgPE11bHRpVmFsdWVSZW1vdmUgey4uLnByb3BzfT5cbiAgICAgIDxNaW5pRGVsZXRlSWNvbiBzaXplPXsxMn0gLz5cbiAgICA8L011bHRpVmFsdWVSZW1vdmU+XG4gICk7XG59O1xuXG4vKipcbiAqIEN1c3RvbSByZW1vdmUgYWxsIGJ1dHRvbiBmb3IgbXVsdGktc2VsZWN0IG1vZGUuXG4gKiBQcm92aWRlcyBrZXlib2FyZCBuYXZpZ2F0aW9uIGFuZCBhY2Nlc3NpYmxlIHJlbW92YWwgb2YgYWxsIHNlbGVjdGVkIHZhbHVlcy5cbiAqL1xuXG5jb25zdCBDdXN0b21TdHlsZWRSZW1vdmVBbGxEaXYgPSBzdHlsZWQoJ2RpdicpKFxuICBjc3Moe1xuICAgICcmOmZvY3VzJzoge1xuICAgICAgb3V0bGluZTogYDJweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5wcmltYXJ5fWAsXG4gICAgfSxcbiAgICAnJjpmb2N1cy12aXNpYmxlJzoge1xuICAgICAgb3V0bGluZTogYDJweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5wcmltYXJ5fWAsXG4gICAgfSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBSZW1vdmVBbGxCdXR0b24gPSAocHJvcHM6IFNpemVkSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3Qge1xuICAgIGdldFN0eWxlcyxcbiAgICBpbm5lclByb3BzOiB7IC4uLnJlc3RJbm5lclByb3BzIH0sXG4gICAgc2VsZWN0UHJvcHM6IHsgc2l6ZSB9LFxuICB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyByZW1vdmVBbGxCdXR0b25SZWYsIHNlbGVjdElucHV0UmVmIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IGljb25TaXplID0gc2l6ZSA/PyAnbWVkaXVtJztcbiAgY29uc3QgeyAuLi5pY29uUHJvcHMgfSA9IGluZGljYXRvckljb25zW2Ake2ljb25TaXplfVJlbW92ZWBdO1xuICBjb25zdCB7IGljb246IEluZGljYXRvckljb24gfSA9IGljb25Qcm9wcztcblxuICBjb25zdCBvbktleVByZXNzID0gKGU6IEtleWJvYXJkRXZlbnQ8SFRNTERpdkVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIHJlc3RJbm5lclByb3BzLm9uTW91c2VEb3duKSB7XG4gICAgICByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bihlIGFzIGFueSk7XG4gICAgfVxuXG4gICAgaWYgKFxuICAgICAgc2VsZWN0SW5wdXRSZWY/LmN1cnJlbnQgJiZcbiAgICAgIChlLmtleSA9PT0gJ0Fycm93UmlnaHQnIHx8IGUua2V5ID09PSAnQXJyb3dMZWZ0JyB8fCBlLmtleSA9PT0gJ0Fycm93RG93bicpXG4gICAgKSB7XG4gICAgICBzZWxlY3RJbnB1dFJlZi5jdXJyZW50LmZvY3VzKCk7XG4gICAgfVxuICB9O1xuXG4gIGNvbnN0IHN0eWxlID0gZ2V0U3R5bGVzKCdjbGVhckluZGljYXRvcicsIHByb3BzKSBhcyBSZWFjdC5DU1NQcm9wZXJ0aWVzO1xuXG4gIHJldHVybiAoXG4gICAgPEN1c3RvbVN0eWxlZFJlbW92ZUFsbERpdlxuICAgICAgYXJpYS1sYWJlbD1cIlJlbW92ZSBhbGwgc2VsZWN0ZWRcIlxuICAgICAgcm9sZT1cImJ1dHRvblwiXG4gICAgICB0YWJJbmRleD17MH1cbiAgICAgIHsuLi5yZXN0SW5uZXJQcm9wc31cbiAgICAgIHJlZj17cmVtb3ZlQWxsQnV0dG9uUmVmIGFzIFJlYWN0LlJlZjxIVE1MRGl2RWxlbWVudD59XG4gICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgZ2FtdXQvbm8taW5saW5lLXN0eWxlXG4gICAgICBzdHlsZT17c3R5bGV9XG4gICAgICBvbktleURvd249e29uS2V5UHJlc3N9XG4gICAgPlxuICAgICAgPEluZGljYXRvckljb24gey4uLmljb25Qcm9wc30gY29sb3I9XCJ0ZXh0XCIgLz5cbiAgICA8L0N1c3RvbVN0eWxlZFJlbW92ZUFsbERpdj5cbiAgKTtcbn07XG4iXX0= */")), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0RWlDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE1pbmlEZWxldGVJY29uIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtaWNvbnMnO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgS2V5Ym9hcmRFdmVudCwgdXNlQ29udGV4dCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgU2VsZWN0RHJvcGRvd25FbGVtZW50cyxcbiAgR3JvdXBCYXNlLFxuICBNdWx0aVZhbHVlUHJvcHMsXG4gIE11bHRpVmFsdWVSZW1vdmVQcm9wcyxcbn0gZnJvbSAncmVhY3Qtc2VsZWN0JztcblxuaW1wb3J0IHsgRXh0ZW5kZWRPcHRpb24sIFNpemVkSW5kaWNhdG9yUHJvcHMgfSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgeyBpbmRpY2F0b3JJY29ucyB9IGZyb20gJy4vY29uc3RhbnRzJztcbmltcG9ydCB7IFNlbGVjdERyb3Bkb3duQ29udGV4dCB9IGZyb20gJy4vY29udGFpbmVycyc7XG5cbmNvbnN0IHsgTXVsdGlWYWx1ZSwgTXVsdGlWYWx1ZVJlbW92ZSB9ID0gU2VsZWN0RHJvcGRvd25FbGVtZW50cztcblxuLyoqXG4gKiBDdXN0b20gbXVsdGktdmFsdWUgY29tcG9uZW50IHRoYXQgbWFuYWdlcyBmb2N1cyBzdGF0ZSBmb3Iga2V5Ym9hcmQgbmF2aWdhdGlvbi5cbiAqIFRyYWNrcyB3aGljaCBtdWx0aS12YWx1ZSBpcyBjdXJyZW50bHkgZm9jdXNlZCBhbmQgdXBkYXRlcyB0aGUgY29udGV4dCBhY2NvcmRpbmdseS5cbiAqL1xuZXhwb3J0IGNvbnN0IE11bHRpVmFsdWVXaXRoQ29sb3JNb2RlID0gKFxuICBwcm9wczogTXVsdGlWYWx1ZVByb3BzPEV4dGVuZGVkT3B0aW9uLCB0cnVlLCBHcm91cEJhc2U8RXh0ZW5kZWRPcHRpb24+PlxuKSA9PiB7XG4gIGNvbnN0IHsgY3VycmVudEZvY3VzZWRWYWx1ZSwgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSB9ID0gdXNlQ29udGV4dChcbiAgICBTZWxlY3REcm9wZG93bkNvbnRleHRcbiAgKTtcblxuICBjb25zdCB7IGRhdGEgfSA9IHByb3BzO1xuXG4gIGNvbnN0IHsgdmFsdWUsIGxhYmVsIH0gPSBkYXRhO1xuXG4gIGlmIChcbiAgICBwcm9wcy5pc0ZvY3VzZWQgJiZcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlICYmXG4gICAgY3VycmVudEZvY3VzZWRWYWx1ZSAhPT0gdmFsdWVcbiAgKSB7XG4gICAgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSh2YWx1ZSk7XG4gIH1cblxuICBpZiAoXG4gICAgIXByb3BzLmlzRm9jdXNlZCAmJlxuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUgJiZcbiAgICBjdXJyZW50Rm9jdXNlZFZhbHVlID09PSB2YWx1ZVxuICApIHtcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlKHVuZGVmaW5lZCk7XG4gIH1cbiAgY29uc3QgZGlzcGxheVRleHQgPSBkYXRhPy5hYmJyZXZpYXRpb24gPyBkYXRhLmFiYnJldmlhdGlvbiA6IGxhYmVsIHx8ICcnO1xuXG4gIHJldHVybiA8TXVsdGlWYWx1ZSB7Li4ucHJvcHN9PntkaXNwbGF5VGV4dH08L011bHRpVmFsdWU+O1xufTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGJ1dHRvbiBmb3IgbXVsdGktdmFsdWUgaXRlbXMuXG4gKiBQcm92aWRlcyBhY2Nlc3NpYmxlIHJlbW92YWwgZnVuY3Rpb25hbGl0eSB3aXRoIHByb3BlciBBUklBIGxhYmVscy5cbiAqL1xuZXhwb3J0IGNvbnN0IE11bHRpVmFsdWVSZW1vdmVCdXR0b24gPSAoXG4gIHByb3BzOiBNdWx0aVZhbHVlUmVtb3ZlUHJvcHM8RXh0ZW5kZWRPcHRpb24sIHRydWUsIEdyb3VwQmFzZTxFeHRlbmRlZE9wdGlvbj4+XG4pID0+IHtcbiAgY29uc3QgeyBsYWJlbCB9ID0gcHJvcHM/LmRhdGEgPz8geyBsYWJlbDogJycgfTtcblxuICBwcm9wcy5pbm5lclByb3BzWydhcmlhLWxhYmVsJ10gPSBgUmVtb3ZlICR7bGFiZWx9YDtcblxuICByZXR1cm4gKFxuICAgIDxNdWx0aVZhbHVlUmVtb3ZlIHsuLi5wcm9wc30+XG4gICAgICA8TWluaURlbGV0ZUljb24gc2l6ZT17MTJ9IC8+XG4gICAgPC9NdWx0aVZhbHVlUmVtb3ZlPlxuICApO1xufTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGFsbCBidXR0b24gZm9yIG11bHRpLXNlbGVjdCBtb2RlLlxuICogUHJvdmlkZXMga2V5Ym9hcmQgbmF2aWdhdGlvbiBhbmQgYWNjZXNzaWJsZSByZW1vdmFsIG9mIGFsbCBzZWxlY3RlZCB2YWx1ZXMuXG4gKi9cblxuY29uc3QgQ3VzdG9tU3R5bGVkUmVtb3ZlQWxsRGl2ID0gc3R5bGVkKCdkaXYnKShcbiAgY3NzKHtcbiAgICAnJjpmb2N1cyc6IHtcbiAgICAgIG91dGxpbmU6IGAycHggc29saWQgJHt0aGVtZS5jb2xvcnMucHJpbWFyeX1gLFxuICAgIH0sXG4gICAgJyY6Zm9jdXMtdmlzaWJsZSc6IHtcbiAgICAgIG91dGxpbmU6IGAycHggc29saWQgJHt0aGVtZS5jb2xvcnMucHJpbWFyeX1gLFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgY29uc3QgUmVtb3ZlQWxsQnV0dG9uID0gKHByb3BzOiBTaXplZEluZGljYXRvclByb3BzKSA9PiB7XG4gIGNvbnN0IHtcbiAgICBnZXRTdHlsZXMsXG4gICAgaW5uZXJQcm9wczogeyAuLi5yZXN0SW5uZXJQcm9wcyB9LFxuICAgIHNlbGVjdFByb3BzOiB7IHNpemUgfSxcbiAgfSA9IHByb3BzO1xuXG4gIGNvbnN0IHsgcmVtb3ZlQWxsQnV0dG9uUmVmLCBzZWxlY3RJbnB1dFJlZiB9ID0gdXNlQ29udGV4dChcbiAgICBTZWxlY3REcm9wZG93bkNvbnRleHRcbiAgKTtcblxuICBjb25zdCBpY29uU2l6ZSA9IHNpemUgPz8gJ21lZGl1bSc7XG4gIGNvbnN0IHsgLi4uaWNvblByb3BzIH0gPSBpbmRpY2F0b3JJY29uc1tgJHtpY29uU2l6ZX1SZW1vdmVgXTtcbiAgY29uc3QgeyBpY29uOiBJbmRpY2F0b3JJY29uIH0gPSBpY29uUHJvcHM7XG5cbiAgY29uc3Qgb25LZXlQcmVzcyA9IChlOiBLZXlib2FyZEV2ZW50PEhUTUxEaXZFbGVtZW50PikgPT4ge1xuICAgIGlmIChlLmtleSA9PT0gJ0VudGVyJyAmJiByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bikge1xuICAgICAgcmVzdElubmVyUHJvcHMub25Nb3VzZURvd24oZSBhcyBhbnkpO1xuICAgIH1cblxuICAgIGlmIChcbiAgICAgIHNlbGVjdElucHV0UmVmPy5jdXJyZW50ICYmXG4gICAgICAoZS5rZXkgPT09ICdBcnJvd1JpZ2h0JyB8fCBlLmtleSA9PT0gJ0Fycm93TGVmdCcgfHwgZS5rZXkgPT09ICdBcnJvd0Rvd24nKVxuICAgICkge1xuICAgICAgc2VsZWN0SW5wdXRSZWYuY3VycmVudC5mb2N1cygpO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBzdHlsZSA9IGdldFN0eWxlcygnY2xlYXJJbmRpY2F0b3InLCBwcm9wcykgYXMgUmVhY3QuQ1NTUHJvcGVydGllcztcblxuICByZXR1cm4gKFxuICAgIDxDdXN0b21TdHlsZWRSZW1vdmVBbGxEaXZcbiAgICAgIGFyaWEtbGFiZWw9XCJSZW1vdmUgYWxsIHNlbGVjdGVkXCJcbiAgICAgIHJvbGU9XCJidXR0b25cIlxuICAgICAgdGFiSW5kZXg9ezB9XG4gICAgICB7Li4ucmVzdElubmVyUHJvcHN9XG4gICAgICByZWY9e3JlbW92ZUFsbEJ1dHRvblJlZiBhcyBSZWFjdC5SZWY8SFRNTERpdkVsZW1lbnQ+fVxuICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIGdhbXV0L25vLWlubGluZS1zdHlsZVxuICAgICAgc3R5bGU9e3N0eWxlfVxuICAgICAgb25LZXlEb3duPXtvbktleVByZXNzfVxuICAgID5cbiAgICAgIDxJbmRpY2F0b3JJY29uIHsuLi5pY29uUHJvcHN9IGNvbG9yPVwidGV4dFwiIC8+XG4gICAgPC9DdXN0b21TdHlsZWRSZW1vdmVBbGxEaXY+XG4gICk7XG59O1xuIl19 */");
+}, ";label:CustomStyledRemoveAllDiv;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2RUUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjL0Zvcm0vU2VsZWN0RHJvcGRvd24vZWxlbWVudHMvbXVsdGktdmFsdWUudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTWluaURlbGV0ZUljb24gfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1pY29ucyc7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gJ0Bjb2RlY2FkZW15L2dhbXV0LXN0eWxlcyc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBLZXlib2FyZEV2ZW50LCB1c2VDb250ZXh0IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHtcbiAgY29tcG9uZW50cyBhcyBTZWxlY3REcm9wZG93bkVsZW1lbnRzLFxuICBHcm91cEJhc2UsXG4gIE11bHRpVmFsdWVQcm9wcyxcbiAgTXVsdGlWYWx1ZVJlbW92ZVByb3BzLFxufSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5pbXBvcnQgeyBFeHRlbmRlZE9wdGlvbiwgU2l6ZWRJbmRpY2F0b3JQcm9wcyB9IGZyb20gJy4uL3R5cGVzJztcbmltcG9ydCB7IGluZGljYXRvckljb25zIH0gZnJvbSAnLi9jb25zdGFudHMnO1xuaW1wb3J0IHsgU2VsZWN0RHJvcGRvd25Db250ZXh0IH0gZnJvbSAnLi9jb250YWluZXJzJztcblxuY29uc3QgeyBNdWx0aVZhbHVlLCBNdWx0aVZhbHVlUmVtb3ZlIH0gPSBTZWxlY3REcm9wZG93bkVsZW1lbnRzO1xuXG4vKipcbiAqIEN1c3RvbSBtdWx0aS12YWx1ZSBjb21wb25lbnQgdGhhdCBtYW5hZ2VzIGZvY3VzIHN0YXRlIGZvciBrZXlib2FyZCBuYXZpZ2F0aW9uLlxuICogVHJhY2tzIHdoaWNoIG11bHRpLXZhbHVlIGlzIGN1cnJlbnRseSBmb2N1c2VkIGFuZCB1cGRhdGVzIHRoZSBjb250ZXh0IGFjY29yZGluZ2x5LlxuICovXG5leHBvcnQgY29uc3QgTXVsdGlWYWx1ZVdpdGhDb2xvck1vZGUgPSAoXG4gIHByb3BzOiBNdWx0aVZhbHVlUHJvcHM8RXh0ZW5kZWRPcHRpb24sIHRydWUsIEdyb3VwQmFzZTxFeHRlbmRlZE9wdGlvbj4+XG4pID0+IHtcbiAgY29uc3QgeyBjdXJyZW50Rm9jdXNlZFZhbHVlLCBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IHsgZGF0YSB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyB2YWx1ZSwgbGFiZWwgfSA9IGRhdGE7XG5cbiAgaWYgKFxuICAgIHByb3BzLmlzRm9jdXNlZCAmJlxuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUgJiZcbiAgICBjdXJyZW50Rm9jdXNlZFZhbHVlICE9PSB2YWx1ZVxuICApIHtcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlKHZhbHVlKTtcbiAgfVxuXG4gIGlmIChcbiAgICAhcHJvcHMuaXNGb2N1c2VkICYmXG4gICAgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSAmJlxuICAgIGN1cnJlbnRGb2N1c2VkVmFsdWUgPT09IHZhbHVlXG4gICkge1xuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUodW5kZWZpbmVkKTtcbiAgfVxuICBjb25zdCBkaXNwbGF5VGV4dCA9IGRhdGE/LmFiYnJldmlhdGlvbiA/IGRhdGEuYWJicmV2aWF0aW9uIDogbGFiZWwgfHwgJyc7XG5cbiAgcmV0dXJuIDxNdWx0aVZhbHVlIHsuLi5wcm9wc30+e2Rpc3BsYXlUZXh0fTwvTXVsdGlWYWx1ZT47XG59O1xuXG4vKipcbiAqIEN1c3RvbSByZW1vdmUgYnV0dG9uIGZvciBtdWx0aS12YWx1ZSBpdGVtcy5cbiAqIFByb3ZpZGVzIGFjY2Vzc2libGUgcmVtb3ZhbCBmdW5jdGlvbmFsaXR5IHdpdGggcHJvcGVyIEFSSUEgbGFiZWxzLlxuICovXG5leHBvcnQgY29uc3QgTXVsdGlWYWx1ZVJlbW92ZUJ1dHRvbiA9IChcbiAgcHJvcHM6IE11bHRpVmFsdWVSZW1vdmVQcm9wczxFeHRlbmRlZE9wdGlvbiwgdHJ1ZSwgR3JvdXBCYXNlPEV4dGVuZGVkT3B0aW9uPj5cbikgPT4ge1xuICBjb25zdCB7IGxhYmVsIH0gPSBwcm9wcz8uZGF0YSA/PyB7IGxhYmVsOiAnJyB9O1xuXG4gIHByb3BzLmlubmVyUHJvcHNbJ2FyaWEtbGFiZWwnXSA9IGBSZW1vdmUgJHtsYWJlbH1gO1xuXG4gIHJldHVybiAoXG4gICAgPE11bHRpVmFsdWVSZW1vdmUgey4uLnByb3BzfT5cbiAgICAgIDxNaW5pRGVsZXRlSWNvbiBzaXplPXsxMn0gLz5cbiAgICA8L011bHRpVmFsdWVSZW1vdmU+XG4gICk7XG59O1xuXG4vKipcbiAqIEN1c3RvbSByZW1vdmUgYWxsIGJ1dHRvbiBmb3IgbXVsdGktc2VsZWN0IG1vZGUuXG4gKiBQcm92aWRlcyBrZXlib2FyZCBuYXZpZ2F0aW9uIGFuZCBhY2Nlc3NpYmxlIHJlbW92YWwgb2YgYWxsIHNlbGVjdGVkIHZhbHVlcy5cbiAqL1xuXG5jb25zdCBDdXN0b21TdHlsZWRSZW1vdmVBbGxEaXYgPSBzdHlsZWQoJ2RpdicpKFxuICBjc3Moe1xuICAgICcmOmZvY3VzJzoge1xuICAgICAgb3V0bGluZTogYDJweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5wcmltYXJ5fWAsXG4gICAgfSxcbiAgICAnJjpmb2N1cy12aXNpYmxlJzoge1xuICAgICAgb3V0bGluZTogYDJweCBzb2xpZCAke3RoZW1lLmNvbG9ycy5wcmltYXJ5fWAsXG4gICAgfSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBSZW1vdmVBbGxCdXR0b24gPSAocHJvcHM6IFNpemVkSW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3Qge1xuICAgIGdldFN0eWxlcyxcbiAgICBpbm5lclByb3BzOiB7IC4uLnJlc3RJbm5lclByb3BzIH0sXG4gICAgc2VsZWN0UHJvcHM6IHsgc2l6ZSB9LFxuICB9ID0gcHJvcHM7XG5cbiAgY29uc3QgeyByZW1vdmVBbGxCdXR0b25SZWYsIHNlbGVjdElucHV0UmVmIH0gPSB1c2VDb250ZXh0KFxuICAgIFNlbGVjdERyb3Bkb3duQ29udGV4dFxuICApO1xuXG4gIGNvbnN0IGljb25TaXplID0gc2l6ZSA/PyAnbWVkaXVtJztcbiAgY29uc3QgeyAuLi5pY29uUHJvcHMgfSA9IGluZGljYXRvckljb25zW2Ake2ljb25TaXplfVJlbW92ZWBdO1xuICBjb25zdCB7IGljb246IEluZGljYXRvckljb24gfSA9IGljb25Qcm9wcztcblxuICBjb25zdCBvbktleVByZXNzID0gKGU6IEtleWJvYXJkRXZlbnQ8SFRNTERpdkVsZW1lbnQ+KSA9PiB7XG4gICAgaWYgKGUua2V5ID09PSAnRW50ZXInICYmIHJlc3RJbm5lclByb3BzLm9uTW91c2VEb3duKSB7XG4gICAgICByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bihlIGFzIGFueSk7XG4gICAgfVxuXG4gICAgaWYgKFxuICAgICAgc2VsZWN0SW5wdXRSZWY/LmN1cnJlbnQgJiZcbiAgICAgIChlLmtleSA9PT0gJ0Fycm93UmlnaHQnIHx8IGUua2V5ID09PSAnQXJyb3dMZWZ0JyB8fCBlLmtleSA9PT0gJ0Fycm93RG93bicpXG4gICAgKSB7XG4gICAgICBzZWxlY3RJbnB1dFJlZj8uY3VycmVudC5mb2N1cygpO1xuICAgIH1cbiAgfTtcblxuICBjb25zdCBzdHlsZSA9IGdldFN0eWxlcygnY2xlYXJJbmRpY2F0b3InLCBwcm9wcykgYXMgUmVhY3QuQ1NTUHJvcGVydGllcztcblxuICByZXR1cm4gKFxuICAgIDxDdXN0b21TdHlsZWRSZW1vdmVBbGxEaXZcbiAgICAgIGFyaWEtbGFiZWw9XCJSZW1vdmUgYWxsIHNlbGVjdGVkXCJcbiAgICAgIHJvbGU9XCJidXR0b25cIlxuICAgICAgdGFiSW5kZXg9ezB9XG4gICAgICB7Li4ucmVzdElubmVyUHJvcHN9XG4gICAgICByZWY9e3JlbW92ZUFsbEJ1dHRvblJlZn1cbiAgICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBnYW11dC9uby1pbmxpbmUtc3R5bGVcbiAgICAgIHN0eWxlPXtzdHlsZX1cbiAgICAgIG9uS2V5RG93bj17b25LZXlQcmVzc31cbiAgICA+XG4gICAgICA8SW5kaWNhdG9ySWNvbiB7Li4uaWNvblByb3BzfSBjb2xvcj1cInRleHRcIiAvPlxuICAgIDwvQ3VzdG9tU3R5bGVkUmVtb3ZlQWxsRGl2PlxuICApO1xufTtcbiJdfQ== */")), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0RWlDIiwiZmlsZSI6Ii4uLy4uLy4uLy4uL3NyYy9Gb3JtL1NlbGVjdERyb3Bkb3duL2VsZW1lbnRzL211bHRpLXZhbHVlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE1pbmlEZWxldGVJY29uIH0gZnJvbSAnQGNvZGVjYWRlbXkvZ2FtdXQtaWNvbnMnO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tICdAY29kZWNhZGVteS9nYW11dC1zdHlsZXMnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgS2V5Ym9hcmRFdmVudCwgdXNlQ29udGV4dCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgU2VsZWN0RHJvcGRvd25FbGVtZW50cyxcbiAgR3JvdXBCYXNlLFxuICBNdWx0aVZhbHVlUHJvcHMsXG4gIE11bHRpVmFsdWVSZW1vdmVQcm9wcyxcbn0gZnJvbSAncmVhY3Qtc2VsZWN0JztcblxuaW1wb3J0IHsgRXh0ZW5kZWRPcHRpb24sIFNpemVkSW5kaWNhdG9yUHJvcHMgfSBmcm9tICcuLi90eXBlcyc7XG5pbXBvcnQgeyBpbmRpY2F0b3JJY29ucyB9IGZyb20gJy4vY29uc3RhbnRzJztcbmltcG9ydCB7IFNlbGVjdERyb3Bkb3duQ29udGV4dCB9IGZyb20gJy4vY29udGFpbmVycyc7XG5cbmNvbnN0IHsgTXVsdGlWYWx1ZSwgTXVsdGlWYWx1ZVJlbW92ZSB9ID0gU2VsZWN0RHJvcGRvd25FbGVtZW50cztcblxuLyoqXG4gKiBDdXN0b20gbXVsdGktdmFsdWUgY29tcG9uZW50IHRoYXQgbWFuYWdlcyBmb2N1cyBzdGF0ZSBmb3Iga2V5Ym9hcmQgbmF2aWdhdGlvbi5cbiAqIFRyYWNrcyB3aGljaCBtdWx0aS12YWx1ZSBpcyBjdXJyZW50bHkgZm9jdXNlZCBhbmQgdXBkYXRlcyB0aGUgY29udGV4dCBhY2NvcmRpbmdseS5cbiAqL1xuZXhwb3J0IGNvbnN0IE11bHRpVmFsdWVXaXRoQ29sb3JNb2RlID0gKFxuICBwcm9wczogTXVsdGlWYWx1ZVByb3BzPEV4dGVuZGVkT3B0aW9uLCB0cnVlLCBHcm91cEJhc2U8RXh0ZW5kZWRPcHRpb24+PlxuKSA9PiB7XG4gIGNvbnN0IHsgY3VycmVudEZvY3VzZWRWYWx1ZSwgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSB9ID0gdXNlQ29udGV4dChcbiAgICBTZWxlY3REcm9wZG93bkNvbnRleHRcbiAgKTtcblxuICBjb25zdCB7IGRhdGEgfSA9IHByb3BzO1xuXG4gIGNvbnN0IHsgdmFsdWUsIGxhYmVsIH0gPSBkYXRhO1xuXG4gIGlmIChcbiAgICBwcm9wcy5pc0ZvY3VzZWQgJiZcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlICYmXG4gICAgY3VycmVudEZvY3VzZWRWYWx1ZSAhPT0gdmFsdWVcbiAgKSB7XG4gICAgc2V0Q3VycmVudEZvY3VzZWRWYWx1ZSh2YWx1ZSk7XG4gIH1cblxuICBpZiAoXG4gICAgIXByb3BzLmlzRm9jdXNlZCAmJlxuICAgIHNldEN1cnJlbnRGb2N1c2VkVmFsdWUgJiZcbiAgICBjdXJyZW50Rm9jdXNlZFZhbHVlID09PSB2YWx1ZVxuICApIHtcbiAgICBzZXRDdXJyZW50Rm9jdXNlZFZhbHVlKHVuZGVmaW5lZCk7XG4gIH1cbiAgY29uc3QgZGlzcGxheVRleHQgPSBkYXRhPy5hYmJyZXZpYXRpb24gPyBkYXRhLmFiYnJldmlhdGlvbiA6IGxhYmVsIHx8ICcnO1xuXG4gIHJldHVybiA8TXVsdGlWYWx1ZSB7Li4ucHJvcHN9PntkaXNwbGF5VGV4dH08L011bHRpVmFsdWU+O1xufTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGJ1dHRvbiBmb3IgbXVsdGktdmFsdWUgaXRlbXMuXG4gKiBQcm92aWRlcyBhY2Nlc3NpYmxlIHJlbW92YWwgZnVuY3Rpb25hbGl0eSB3aXRoIHByb3BlciBBUklBIGxhYmVscy5cbiAqL1xuZXhwb3J0IGNvbnN0IE11bHRpVmFsdWVSZW1vdmVCdXR0b24gPSAoXG4gIHByb3BzOiBNdWx0aVZhbHVlUmVtb3ZlUHJvcHM8RXh0ZW5kZWRPcHRpb24sIHRydWUsIEdyb3VwQmFzZTxFeHRlbmRlZE9wdGlvbj4+XG4pID0+IHtcbiAgY29uc3QgeyBsYWJlbCB9ID0gcHJvcHM/LmRhdGEgPz8geyBsYWJlbDogJycgfTtcblxuICBwcm9wcy5pbm5lclByb3BzWydhcmlhLWxhYmVsJ10gPSBgUmVtb3ZlICR7bGFiZWx9YDtcblxuICByZXR1cm4gKFxuICAgIDxNdWx0aVZhbHVlUmVtb3ZlIHsuLi5wcm9wc30+XG4gICAgICA8TWluaURlbGV0ZUljb24gc2l6ZT17MTJ9IC8+XG4gICAgPC9NdWx0aVZhbHVlUmVtb3ZlPlxuICApO1xufTtcblxuLyoqXG4gKiBDdXN0b20gcmVtb3ZlIGFsbCBidXR0b24gZm9yIG11bHRpLXNlbGVjdCBtb2RlLlxuICogUHJvdmlkZXMga2V5Ym9hcmQgbmF2aWdhdGlvbiBhbmQgYWNjZXNzaWJsZSByZW1vdmFsIG9mIGFsbCBzZWxlY3RlZCB2YWx1ZXMuXG4gKi9cblxuY29uc3QgQ3VzdG9tU3R5bGVkUmVtb3ZlQWxsRGl2ID0gc3R5bGVkKCdkaXYnKShcbiAgY3NzKHtcbiAgICAnJjpmb2N1cyc6IHtcbiAgICAgIG91dGxpbmU6IGAycHggc29saWQgJHt0aGVtZS5jb2xvcnMucHJpbWFyeX1gLFxuICAgIH0sXG4gICAgJyY6Zm9jdXMtdmlzaWJsZSc6IHtcbiAgICAgIG91dGxpbmU6IGAycHggc29saWQgJHt0aGVtZS5jb2xvcnMucHJpbWFyeX1gLFxuICAgIH0sXG4gIH0pXG4pO1xuXG5leHBvcnQgY29uc3QgUmVtb3ZlQWxsQnV0dG9uID0gKHByb3BzOiBTaXplZEluZGljYXRvclByb3BzKSA9PiB7XG4gIGNvbnN0IHtcbiAgICBnZXRTdHlsZXMsXG4gICAgaW5uZXJQcm9wczogeyAuLi5yZXN0SW5uZXJQcm9wcyB9LFxuICAgIHNlbGVjdFByb3BzOiB7IHNpemUgfSxcbiAgfSA9IHByb3BzO1xuXG4gIGNvbnN0IHsgcmVtb3ZlQWxsQnV0dG9uUmVmLCBzZWxlY3RJbnB1dFJlZiB9ID0gdXNlQ29udGV4dChcbiAgICBTZWxlY3REcm9wZG93bkNvbnRleHRcbiAgKTtcblxuICBjb25zdCBpY29uU2l6ZSA9IHNpemUgPz8gJ21lZGl1bSc7XG4gIGNvbnN0IHsgLi4uaWNvblByb3BzIH0gPSBpbmRpY2F0b3JJY29uc1tgJHtpY29uU2l6ZX1SZW1vdmVgXTtcbiAgY29uc3QgeyBpY29uOiBJbmRpY2F0b3JJY29uIH0gPSBpY29uUHJvcHM7XG5cbiAgY29uc3Qgb25LZXlQcmVzcyA9IChlOiBLZXlib2FyZEV2ZW50PEhUTUxEaXZFbGVtZW50PikgPT4ge1xuICAgIGlmIChlLmtleSA9PT0gJ0VudGVyJyAmJiByZXN0SW5uZXJQcm9wcy5vbk1vdXNlRG93bikge1xuICAgICAgcmVzdElubmVyUHJvcHMub25Nb3VzZURvd24oZSBhcyBhbnkpO1xuICAgIH1cblxuICAgIGlmIChcbiAgICAgIHNlbGVjdElucHV0UmVmPy5jdXJyZW50ICYmXG4gICAgICAoZS5rZXkgPT09ICdBcnJvd1JpZ2h0JyB8fCBlLmtleSA9PT0gJ0Fycm93TGVmdCcgfHwgZS5rZXkgPT09ICdBcnJvd0Rvd24nKVxuICAgICkge1xuICAgICAgc2VsZWN0SW5wdXRSZWY/LmN1cnJlbnQuZm9jdXMoKTtcbiAgICB9XG4gIH07XG5cbiAgY29uc3Qgc3R5bGUgPSBnZXRTdHlsZXMoJ2NsZWFySW5kaWNhdG9yJywgcHJvcHMpIGFzIFJlYWN0LkNTU1Byb3BlcnRpZXM7XG5cbiAgcmV0dXJuIChcbiAgICA8Q3VzdG9tU3R5bGVkUmVtb3ZlQWxsRGl2XG4gICAgICBhcmlhLWxhYmVsPVwiUmVtb3ZlIGFsbCBzZWxlY3RlZFwiXG4gICAgICByb2xlPVwiYnV0dG9uXCJcbiAgICAgIHRhYkluZGV4PXswfVxuICAgICAgey4uLnJlc3RJbm5lclByb3BzfVxuICAgICAgcmVmPXtyZW1vdmVBbGxCdXR0b25SZWZ9XG4gICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgZ2FtdXQvbm8taW5saW5lLXN0eWxlXG4gICAgICBzdHlsZT17c3R5bGV9XG4gICAgICBvbktleURvd249e29uS2V5UHJlc3N9XG4gICAgPlxuICAgICAgPEluZGljYXRvckljb24gey4uLmljb25Qcm9wc30gY29sb3I9XCJ0ZXh0XCIgLz5cbiAgICA8L0N1c3RvbVN0eWxlZFJlbW92ZUFsbERpdj5cbiAgKTtcbn07XG4iXX0= */");
 export const RemoveAllButton = props => {
   const {
     getStyles,
@@ -102,7 +102,7 @@ export const RemoveAllButton = props => {
       restInnerProps.onMouseDown(e);
     }
     if (selectInputRef?.current && (e.key === 'ArrowRight' || e.key === 'ArrowLeft' || e.key === 'ArrowDown')) {
-      selectInputRef.current.focus();
+      selectInputRef?.current.focus();
     }
   };
   const style = getStyles('clearIndicator', props);

package/dist/Form/SelectDropdown/elements/options.d.ts

@@ -3,6 +3,7 @@ import { CustomSelectComponentProps, ExtendedOption, SelectDropdownGroup } from
 /**
  * Custom option component that displays a check icon for selected items.
  * Also manages ARIA attributes for accessibility.
+ * Skips the check icon for react-select/creatable's "Add" row (__isNew__).
  */
 export declare const IconOption: ({ children, ...rest }: CustomSelectComponentProps<typeof SelectDropdownElements.Option>) => import("react/jsx-runtime").JSX.Element;
 /**

package/dist/Form/SelectDropdown/elements/options.js

@@ -44,6 +44,7 @@ const IconOptionLabel = ({
 /**
  * Custom option component that displays a check icon for selected items.
  * Also manages ARIA attributes for accessibility.
+ * Skips the check icon for react-select/creatable's "Add" row (__isNew__).
  */
 export const IconOption = ({
   children,
@@ -54,15 +55,17 @@ export const IconOption = ({
   } = rest.selectProps;
   const {
     isFocused,
-    innerProps
+    innerProps,
+    data
   } = rest;
+  const isNew = data?.__isNew__;
   return /*#__PURE__*/_jsxs(SelectDropdownElements.Option, {
     ...rest,
     innerProps: {
       ...innerProps,
       'aria-selected': isFocused
     },
-    children: [children, rest?.isSelected && /*#__PURE__*/_jsx(CheckIcon, {
+    children: [children, !isNew && rest?.isSelected && /*#__PURE__*/_jsx(CheckIcon, {
       size: selectedIconSize[size ?? 'medium']
     })]
   });

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

@@ -0,0 +1,22 @@
+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

@@ -0,0 +1,62 @@
+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

@@ -0,0 +1,14 @@
+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

@@ -0,0 +1,39 @@
+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
+  };
+};

package/dist/Form/SelectDropdown/types/component-props.d.ts

@@ -1,5 +1,5 @@
 import { Ref, SelectHTMLAttributes } from 'react';
-import { Props as NamedProps } from 'react-select';
+import { Options as OptionsType, Props as NamedProps } from 'react-select';
 import { SelectComponentProps } from '../../inputs/Select';
 import { OptionStrict, SelectDropdownGroup, SelectDropdownOptions } from './options';
 import { ReactSelectAdditionalProps, SelectDropdownSizes, SharedProps } from './styles';
@@ -28,7 +28,7 @@ export type SelectDropdownBaseProps = Omit<SelectComponentProps, 'onChange' | 'd
  * Core props interface that defines the essential properties for SelectDropdown.
  * This interface combines base props with react-select props and HTML select attributes.
  */
-export interface SelectDropdownCoreProps extends SelectDropdownBaseProps, Omit<NamedProps<OptionStrict, boolean>, 'formatOptionLabel' | 'isDisabled' | 'value' | 'options' | 'components' | 'styles' | 'theme' | 'onChange' | 'multiple'>, Pick<SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'disabled' | 'onClick'>, SharedProps {
+export interface SelectDropdownCoreProps extends SelectDropdownBaseProps, Omit<NamedProps<OptionStrict, boolean>, 'formatOptionLabel' | 'isDisabled' | 'value' | 'options' | 'components' | 'styles' | 'theme' | 'onChange' | 'multiple' | 'isSearchable'>, Pick<SelectHTMLAttributes<HTMLSelectElement>, 'value' | 'disabled' | 'onClick'>, SharedProps {
     /** Required name attribute for the select input */
     name: string;
     /** Placeholder text shown when no option is selected.
@@ -38,6 +38,39 @@ export interface SelectDropdownCoreProps extends SelectDropdownBaseProps, Omit<N
     placeholder?: string;
     /** Array of options or option groups to display in the dropdown */
     options?: SelectDropdownOptions | SelectDropdownGroup[];
+    /**
+     * Allows users to create new options by typing a value not in the options list.
+     * When true, isSearchable is automatically set to true.
+     * Pair with onCreateOption to persist new options.
+     */
+    isCreatable?: boolean;
+    /**
+     * Called when the user confirms a new option via the "Add" row.
+     * Convenience callback for persisting the new value to your `options` list.
+     * Selection updates are delivered through `onChange` with `action: 'create-option'`.
+     */
+    onCreateOption?: (inputValue: string) => void;
+    /**
+     * Customises the label shown in the "Add" row.
+     * Defaults to: (inputValue) => `Add "${inputValue}"`.
+     */
+    formatCreateLabel?: (inputValue: string) => React.ReactNode;
+    /**
+     * Controls when the "Add" row is visible.
+     * Receives the current input, selected values, and all options.
+     * Defaults to react-select's built-in logic (hidden when input matches an existing option label).
+     * Use cases: minimum-length gating, pattern validation, case-insensitive dedup, max-items cap.
+     */
+    isValidNewOption?: (inputValue: string, value: OptionsType<OptionStrict>, options: OptionsType<OptionStrict>) => boolean;
+    /**
+     * Customizes the message shown inside the dropdown menu when no option matches
+     * the current input (react-select's "No options" state). Useful for surfacing
+     * validation/error text directly in the dropdown. Accepts a node, or a function
+     * receiving the current input value.
+     */
+    validationMessage?: React.ReactNode | ((obj: {
+        inputValue: string;
+    }) => React.ReactNode);
 }
 /**
  * Props for single-select mode.
@@ -59,11 +92,23 @@ export interface MultiSelectDropdownProps extends SelectDropdownCoreProps {
     /** Callback fired when the selected values change */
     onChange?: NamedProps<OptionStrict, true>['onChange'];
 }
+/**
+ * Enforces that isSearchable cannot be false when isCreatable is true.
+ * Creatable mode requires the search input so users can type new option values.
+ */
+type CreatableConstraint = {
+    isCreatable?: false | undefined;
+    isSearchable?: boolean;
+} | {
+    isCreatable: true;
+    isSearchable?: true;
+};
 /**
  * Union type for all SelectDropdown prop variants.
- * Supports both single and multi-select modes through discriminated union.
+ * Supports both single and multi-select modes through discriminated union,
+ * intersected with CreatableConstraint to enforce isSearchable compatibility.
  */
-export type SelectDropdownProps = SingleSelectDropdownProps | MultiSelectDropdownProps;
+export type SelectDropdownProps = (SingleSelectDropdownProps | MultiSelectDropdownProps) & CreatableConstraint;
 /**
  * Base interface for onChange-related props.
  * Used internally for type checking and prop validation.
@@ -76,9 +121,12 @@ export interface BaseOnChangeProps {
 }
 /**
  * Props for the typed React Select component wrapper.
- * Extends ReactSelectAdditionalProps with an optional ref.
+ * Extends ReactSelectAdditionalProps with an optional ref and creatable flag.
  */
-export interface TypedReactSelectProps extends ReactSelectAdditionalProps {
+export interface TypedReactSelectProps extends ReactSelectAdditionalProps, Pick<SelectDropdownCoreProps, 'formatCreateLabel' | 'isValidNewOption'> {
     /** Optional ref to the underlying react-select component */
     selectRef?: Ref<any>;
+    /** When true, renders CreatableSelect instead of ReactSelect */
+    isCreatable?: boolean;
 }
+export {};

package/dist/Form/SelectDropdown/types/internal.d.ts

@@ -11,10 +11,10 @@ export type InternalSelectProps = {
     selectProps: Pick<SharedProps, 'inputProps'> & SelectDropdownSizes;
 };
 /**
- * Ref type for programmatic focus management (internal refs from useRef).
+ * Ref type for programmatic focus management.
  * Used for managing focus on select input and remove all button.
  */
-export type ProgramaticFocusRef = React.RefObject<HTMLDivElement | null>;
+export type ProgrammaticFocusRef = React.MutableRefObject<HTMLDivElement> | React.MutableRefObject<null>;
 /**
  * Context value for SelectDropdown internal state management.
  * Provides access to focus state and refs for keyboard navigation.
@@ -25,9 +25,9 @@ export interface SelectDropdownContextValueTypes {
     /** Function to update the currently focused value */
     setCurrentFocusedValue?: React.Dispatch<React.SetStateAction<unknown>>;
     /** Ref to the select input for programmatic focus */
-    selectInputRef?: ProgramaticFocusRef;
+    selectInputRef?: ProgrammaticFocusRef;
     /** Ref to the remove all button for programmatic focus */
-    removeAllButtonRef?: ProgramaticFocusRef;
+    removeAllButtonRef?: ProgrammaticFocusRef;
 }
 /**
  * Props for sized indicator components (dropdown arrow, search icon, etc.).

package/dist/Form/SelectDropdown/types/styles.d.ts

@@ -1,5 +1,5 @@
 import { StyleProps } from '@codecademy/variance';
-import { conditionalBorderStates } from '../styles';
+import { conditionalBorderStates } from '../core/styles';
 import { InternalInputsProps } from './component-props';
 /**
  * Size variants for the SelectDropdown component.
@@ -69,5 +69,9 @@ export type ControlState = BaseSelectComponentProps & InteractionStates & {
 export type OptionState = BaseSelectComponentProps & InteractionStates & {
     /** Whether the option is selected */
     isSelected: boolean;
+    /** Option data — includes __isNew__ for react-select/creatable's "Add" row */
+    data?: {
+        __isNew__?: boolean;
+    };
 };
 export {};