@nulogy/components 16.0.0 → 16.0.1

package/dist/src/Radio/Radio.story.js

@@ -1,4 +1,5 @@
-import React, { useRef } from "react";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef } from "react";
 import { action } from "@storybook/addon-actions";
 import { Radio, Button } from "../index";
 export default {
@@ -22,37 +23,28 @@ export const SetToDefaultChecked = {
     name: "Set to default checked",
 };
 export const SetToDisabled = {
-    render: (args) => (React.createElement(React.Fragment, null,
-        React.createElement(Radio, { ...args, id: "radio-1", disabled: true, labelText: "I am disabled" }),
-        React.createElement(Radio, { ...args, id: "radio-2", checked: true, disabled: true, labelText: "I am disabled" }))),
+    render: (args) => (_jsxs(_Fragment, { children: [_jsx(Radio, { ...args, id: "radio-1", disabled: true, labelText: "I am disabled" }), _jsx(Radio, { ...args, id: "radio-2", checked: true, disabled: true, labelText: "I am disabled" })] })),
     name: "Set to disabled",
 };
 export const SetToError = {
-    render: (args) => (React.createElement(React.Fragment, null,
-        React.createElement(Radio, { ...args, id: "radio", error: true, labelText: "I am error" }),
-        React.createElement(Radio, { ...args, id: "radio", defaultChecked: true, error: true, labelText: "I am error" }))),
+    render: (args) => (_jsxs(_Fragment, { children: [_jsx(Radio, { ...args, id: "radio", error: true, labelText: "I am error" }), _jsx(Radio, { ...args, id: "radio", defaultChecked: true, error: true, labelText: "I am error" })] })),
     name: "Set to error",
 };
 export const SetToRequired = {
-    render: (args) => (React.createElement(React.Fragment, null,
-        React.createElement(Radio, { ...args, id: "radio", labelText: "I am a radio button", required: true }))),
+    render: (args) => (_jsx(_Fragment, { children: _jsx(Radio, { ...args, id: "radio", labelText: "I am a radio button", required: true }) })),
     name: "Set to required",
 };
 export const Controlled = {
-    render: (args) => (React.createElement(React.Fragment, null,
-        React.createElement(Radio, { ...args, id: "radio-1", checked: true, onChange: action("onChange"), labelText: "I am controlled and checked" }),
-        React.createElement(Radio, { ...args, id: "radio-2", checked: false, onChange: action("onChange"), labelText: "I am controlled and unchecked" }))),
+    render: (args) => (_jsxs(_Fragment, { children: [_jsx(Radio, { ...args, id: "radio-1", checked: true, onChange: action("onChange"), labelText: "I am controlled and checked" }), _jsx(Radio, { ...args, id: "radio-2", checked: false, onChange: action("onChange"), labelText: "I am controlled and unchecked" })] })),
 };
 const UsingRefToControlFocusComponent = () => {
     const ref = useRef(null);
     const handleClick = () => {
         ref.current.focus();
     };
-    return (React.createElement(React.Fragment, null,
-        React.createElement(Radio, { ref: ref, checked: true, onChange: action("onChange"), labelText: "I am controlled and checked" }),
-        React.createElement(Button, { onClick: handleClick, "data-testid": "the-button" }, "Focus the Input")));
+    return (_jsxs(_Fragment, { children: [_jsx(Radio, { ref: ref, checked: true, onChange: action("onChange"), labelText: "I am controlled and checked" }), _jsx(Button, { onClick: handleClick, "data-testid": "the-button", children: "Focus the Input" })] }));
 };
 export const UsingRefToControlFocus = {
-    render: (args) => React.createElement(UsingRefToControlFocusComponent, { ...args }),
+    render: (args) => _jsx(UsingRefToControlFocusComponent, { ...args }),
     name: "using ref to control focus",
 };

package/dist/src/Radio/RadioGroup.d.ts

@@ -16,5 +16,5 @@ interface RadioGroupProps {
     default?: boolean;
     onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
 }
-export default function RadioGroup({ className, id, errorMessage, errorList, labelText, helpText, requirementText, ...props }: RadioGroupProps): React.JSX.Element;
+export default function RadioGroup({ className, id, errorMessage, errorList, labelText, helpText, requirementText, ...props }: RadioGroupProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/src/Radio/RadioGroup.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from "react";
 import { useTheme } from "styled-components";
 import { HelpText, RequirementText } from "../FieldLabel";
@@ -7,13 +8,7 @@ import Radio from "./Radio";
 export default function RadioGroup({ className, id, errorMessage, errorList, labelText, helpText, requirementText, ...props }) {
     const otherProps = { ...props, errorMessage, errorList };
     const theme = useTheme();
-    return (React.createElement(Fieldset, { className: className, id: id },
-        React.createElement("legend", { style: { marginBottom: theme.space.x1 } },
-            React.createElement("span", { style: labelTextStyles(theme) }, labelText),
-            requirementText && React.createElement(RequirementText, null, requirementText)),
-        helpText && React.createElement(HelpText, null, helpText),
-        getRadioButtons(otherProps),
-        React.createElement(InlineValidation, { mt: "x1", errorMessage: errorMessage, errorList: errorList })));
+    return (_jsxs(Fieldset, { className: className, id: id, children: [_jsxs("legend", { style: { marginBottom: theme.space.x1 }, children: [_jsx("span", { style: labelTextStyles(theme), children: labelText }), requirementText && _jsx(RequirementText, { children: requirementText })] }), helpText && _jsx(HelpText, { children: helpText }), getRadioButtons(otherProps), _jsx(InlineValidation, { mt: "x1", errorMessage: errorMessage, errorList: errorList })] }));
 }
 const labelTextStyles = (theme) => ({
     fontSize: theme.fontSizes.small,
@@ -23,7 +18,7 @@ const labelTextStyles = (theme) => ({
 const getRadioButtons = (props) => {
     const radioButtons = React.Children.map(props.children, (radio) => {
         const { value, disabled, required, onChange, ...radioProps } = radio.props;
-        return (React.createElement(Radio, { ...radioProps, value: value, disabled: props.disabled || disabled, error: !!(props.errorMessage || props.errorList), required: props.required || required, name: props.name, defaultChecked: value === props.defaultValue ? true : undefined, checked: props.checkedValue && value === props.checkedValue, onChange: props.onChange || onChange }));
+        return (_jsx(Radio, { ...radioProps, value: value, disabled: props.disabled || disabled, error: !!(props.errorMessage || props.errorList), required: props.required || required, name: props.name, defaultChecked: value === props.defaultValue ? true : undefined, checked: props.checkedValue && value === props.checkedValue, onChange: props.onChange || onChange }));
     });
     return radioButtons;
 };

package/dist/src/Radio/RadioGroup.story.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 declare const _default: {
     title: string;
     parameters: {
@@ -9,13 +8,13 @@ declare const _default: {
 };
 export default _default;
 export declare const _RadioGroup: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const RadioGroupWithAllProps: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
@@ -26,21 +25,21 @@ export declare const RadioGroupWithAllProps: {
     };
 };
 export declare const WithErrorMessage: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithErrorList: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const SetToDisabled: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
-export declare const Controlled: () => React.JSX.Element;
+export declare const Controlled: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/Radio/RadioGroup.story.js

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Radio, RadioGroup, Icon, Tooltip, Flex } from "../index";
 const errorList = ["Error message 1", "Error message 2"];
 export default {
@@ -7,48 +7,27 @@ export default {
         chromatic: { diffThreshold: 0.3 },
     },
 };
-export const _RadioGroup = () => (React.createElement(RadioGroup, { labelText: "Setting Selection", name: "settingSelection" },
-    React.createElement(Radio, { value: "a", labelText: "Option A" }),
-    React.createElement(Radio, { value: "b", labelText: "Option B" }),
-    React.createElement(Radio, { value: "c", labelText: "Option C" })));
+export const _RadioGroup = () => (_jsxs(RadioGroup, { labelText: "Setting Selection", name: "settingSelection", children: [_jsx(Radio, { value: "a", labelText: "Option A" }), _jsx(Radio, { value: "b", labelText: "Option B" }), _jsx(Radio, { value: "c", labelText: "Option C" })] }));
 _RadioGroup.story = {
     name: "RadioGroup",
 };
-export const RadioGroupWithAllProps = () => (React.createElement(RadioGroup, { labelText: "Setting Selection", name: "settingSelection", helpText: "Select a setting from the menu below:", required: true, requirementText: "(Required)", defaultValue: "a" },
-    React.createElement(Radio, { value: "a", labelText: React.createElement(Flex, { alignItems: "center" },
-            "Option A",
-            React.createElement(Tooltip, { placement: "bottom", tooltip: "Option A is a special option with extra information", defaultOpen: true },
-                React.createElement(Icon, { icon: "help", color: "darkBlue", size: "x2", ml: "x1" }))) }),
-    React.createElement(Radio, { value: "b", labelText: "Option B" }),
-    React.createElement(Radio, { value: "c", labelText: "Option C" })));
+export const RadioGroupWithAllProps = () => (_jsxs(RadioGroup, { labelText: "Setting Selection", name: "settingSelection", helpText: "Select a setting from the menu below:", required: true, requirementText: "(Required)", defaultValue: "a", children: [_jsx(Radio, { value: "a", labelText: _jsxs(Flex, { alignItems: "center", children: ["Option A", _jsx(Tooltip, { placement: "bottom", tooltip: "Option A is a special option with extra information", defaultOpen: true, children: _jsx(Icon, { icon: "help", color: "darkBlue", size: "x2", ml: "x1" }) })] }) }), _jsx(Radio, { value: "b", labelText: "Option B" }), _jsx(Radio, { value: "c", labelText: "Option C" })] }));
 RadioGroupWithAllProps.story = {
     name: "RadioGroup with all props",
 };
 RadioGroupWithAllProps.parameters = {
     chromatic: { diffThreshold: 0.3 },
 };
-export const WithErrorMessage = () => (React.createElement(RadioGroup, { errorMessage: "Please select an option", labelText: "Setting Selection", name: "settingSelection", defaultValue: "a" },
-    React.createElement(Radio, { value: "a", labelText: "Option A" }),
-    React.createElement(Radio, { value: "b", labelText: "Option B" }),
-    React.createElement(Radio, { value: "c", labelText: "Option C" })));
+export const WithErrorMessage = () => (_jsxs(RadioGroup, { errorMessage: "Please select an option", labelText: "Setting Selection", name: "settingSelection", defaultValue: "a", children: [_jsx(Radio, { value: "a", labelText: "Option A" }), _jsx(Radio, { value: "b", labelText: "Option B" }), _jsx(Radio, { value: "c", labelText: "Option C" })] }));
 WithErrorMessage.story = {
     name: "with error message",
 };
-export const WithErrorList = () => (React.createElement(RadioGroup, { errorMessage: "Please select an option", errorList: errorList, labelText: "Setting Selection", name: "settingSelection", defaultValue: "a" },
-    React.createElement(Radio, { value: "a", labelText: "Option A" }),
-    React.createElement(Radio, { value: "b", labelText: "Option B" }),
-    React.createElement(Radio, { value: "c", labelText: "Option C" })));
+export const WithErrorList = () => (_jsxs(RadioGroup, { errorMessage: "Please select an option", errorList: errorList, labelText: "Setting Selection", name: "settingSelection", defaultValue: "a", children: [_jsx(Radio, { value: "a", labelText: "Option A" }), _jsx(Radio, { value: "b", labelText: "Option B" }), _jsx(Radio, { value: "c", labelText: "Option C" })] }));
 WithErrorList.story = {
     name: "with error list",
 };
-export const SetToDisabled = () => (React.createElement(RadioGroup, { disabled: true, labelText: "Setting Selection", name: "settingSelection", defaultValue: "a" },
-    React.createElement(Radio, { value: "a", labelText: "Option A" }),
-    React.createElement(Radio, { value: "b", labelText: "Option B" }),
-    React.createElement(Radio, { value: "c", labelText: "Option C" })));
+export const SetToDisabled = () => (_jsxs(RadioGroup, { disabled: true, labelText: "Setting Selection", name: "settingSelection", defaultValue: "a", children: [_jsx(Radio, { value: "a", labelText: "Option A" }), _jsx(Radio, { value: "b", labelText: "Option B" }), _jsx(Radio, { value: "c", labelText: "Option C" })] }));
 SetToDisabled.story = {
     name: "Set to disabled",
 };
-export const Controlled = () => (React.createElement(RadioGroup, { labelText: "Setting Selection", name: "settingSelection", checkedValue: "a", onChange: () => { } },
-    React.createElement(Radio, { value: "a", labelText: "Option A" }),
-    React.createElement(Radio, { value: "b", labelText: "Option B" }),
-    React.createElement(Radio, { value: "c", labelText: "Option C" })));
+export const Controlled = () => (_jsxs(RadioGroup, { labelText: "Setting Selection", name: "settingSelection", checkedValue: "a", onChange: () => { }, children: [_jsx(Radio, { value: "a", labelText: "Option A" }), _jsx(Radio, { value: "b", labelText: "Option B" }), _jsx(Radio, { value: "c", labelText: "Option C" })] }));

package/dist/src/RangeContainer/RangeContainer.d.ts

@@ -8,5 +8,5 @@ type RangeContainerProps = {
     errorMessages?: (string | undefined)[];
     children?: React.ReactNode;
 };
-declare const RangeContainer: ({ startComponent, endComponent, errorMessages, labelProps, variant, ...props }: RangeContainerProps) => React.JSX.Element;
+declare const RangeContainer: ({ startComponent, endComponent, errorMessages, labelProps, variant, ...props }: RangeContainerProps) => import("react/jsx-runtime").JSX.Element;
 export default RangeContainer;

package/dist/src/RangeContainer/RangeContainer.js

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import propTypes from "@styled-system/prop-types";
 import { Text } from "../Type";
 import { Flex } from "../Flex";
@@ -12,13 +12,6 @@ const RangeContainer = ({ startComponent, endComponent, errorMessages = [], labe
 }, variant, ...props }) => {
     const spaceProps = getSubset(props, propTypes.space);
     const restProps = omitSubset(props, propTypes.space);
-    return (React.createElement(Flex, { ...spaceProps, flexDirection: "column" },
-        React.createElement(FieldLabel, { ...labelProps, ...restProps }),
-        React.createElement(Flex, { flexWrap: "wrap", mt: "x1", mb: errorMessages.length ? "x1" : "x3" },
-            React.createElement(Flex, null, startComponent),
-            React.createElement(Flex, { px: "half", alignItems: "flex-end", alignSelf: "flex-end" },
-                React.createElement(Text, { lineHeight: variant === "touch" ? "56px" : "38px" }, "-")),
-            React.createElement(Flex, null, endComponent)),
-        errorMessages.map((errorMessage, i) => (React.createElement(InlineValidation, { key: i, errorMessage: errorMessage })))));
+    return (_jsxs(Flex, { ...spaceProps, flexDirection: "column", children: [_jsx(FieldLabel, { ...labelProps, ...restProps }), _jsxs(Flex, { flexWrap: "wrap", mt: "x1", mb: errorMessages.length ? "x1" : "x3", children: [_jsx(Flex, { children: startComponent }), _jsx(Flex, { px: "half", alignItems: "flex-end", alignSelf: "flex-end", children: _jsx(Text, { lineHeight: variant === "touch" ? "56px" : "38px", children: "-" }) }), _jsx(Flex, { children: endComponent })] }), errorMessages.map((errorMessage, i) => (_jsx(InlineValidation, { errorMessage: errorMessage }, i)))] }));
 };
 export default RangeContainer;

package/dist/src/RangeContainer/RangeContainer.story.d.ts

@@ -1,10 +1,9 @@
-import React from "react";
 declare const _default: {
     title: string;
 };
 export default _default;
 export declare const _RangeContainer: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };

package/dist/src/RangeContainer/RangeContainer.story.js

@@ -1,9 +1,9 @@
-import React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { RangeContainer } from ".";
 export default {
     title: "Components/RangeContainer",
 };
-export const _RangeContainer = () => React.createElement(RangeContainer, null, "Example");
+export const _RangeContainer = () => _jsx(RangeContainer, { children: "Example" });
 _RangeContainer.story = {
     name: "RangeContainer",
 };

package/dist/src/Select/MenuList.d.ts

@@ -1,3 +1,2 @@
-import * as React from "react";
-declare function MenuList(props: any): React.JSX.Element;
+declare function MenuList(props: any): import("react/jsx-runtime").JSX.Element;
 export default MenuList;

package/dist/src/Select/MenuList.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 /*
   Copied as is from: https://github.com/jacobworrel/react-windowed-select/blob/main/src/MenuList.tsx
   MIT License
@@ -94,18 +95,17 @@ function MenuList(props) {
             list.current.scrollToItem(currentIndex);
         }
     }, [currentIndex, children, list]);
-    return (React.createElement(List, { className: classNamePrefix
+    return (_jsx(List, { className: classNamePrefix
             ? `${classNamePrefix}__menu-list${isMulti ? ` ${classNamePrefix}__menu-list--is-multi` : ""}`
-            : "", style: menuListStyle, ref: list, outerRef: innerRef, estimatedItemSize: estimatedItemSize, innerElementType: React.forwardRef(({ style, ...rest }, ref) => (React.createElement("div", { ref: ref, style: {
+            : "", style: menuListStyle, ref: list, outerRef: innerRef, estimatedItemSize: estimatedItemSize, innerElementType: React.forwardRef(({ style, ...rest }, ref) => (_jsx("div", { ref: ref, style: {
                 ...style,
                 height: `${parseFloat(style.height) + paddingBottom + paddingTop}px`,
-            }, ...rest }))), height: menuHeight, width: "100%", itemCount: itemCount, itemData: children, itemSize: (index) => measuredHeights[index] || heights[index] }, ({ data, index, style }) => {
-        return (React.createElement("div", { style: {
-                ...style,
-                top: `${parseFloat(style.top.toString()) + paddingTop}px`,
-            } },
-            React.createElement(MenuItem, { data: data[index], index: index, setMeasuredHeight: setMeasuredHeight })));
-    }));
+            }, ...rest }))), height: menuHeight, width: "100%", itemCount: itemCount, itemData: children, itemSize: (index) => measuredHeights[index] || heights[index], children: ({ data, index, style }) => {
+            return (_jsx("div", { style: {
+                    ...style,
+                    top: `${parseFloat(style.top.toString()) + paddingTop}px`,
+                }, children: _jsx(MenuItem, { data: data[index], index: index, setMeasuredHeight: setMeasuredHeight }) }));
+        } }));
 }
 function MenuItem({ data, index, setMeasuredHeight }) {
     const ref = React.useRef(null);
@@ -116,6 +116,6 @@ function MenuItem({ data, index, setMeasuredHeight }) {
             setMeasuredHeight({ index, measuredHeight });
         }
     }, [ref.current]);
-    return (React.createElement("div", { key: `option-${index}`, ref: ref }, data));
+    return (_jsx("div", { ref: ref, children: data }, `option-${index}`));
 }
 export default MenuList;

package/dist/src/Select/Select.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { forwardRef } from "react";
 import ReactSelect from "react-select";
 import { useTranslation } from "react-i18next";
@@ -37,25 +38,22 @@ const NDSSelect = forwardRef(({ value, onChange, defaultValue, disabled, errorMe
         maxHeight,
         windowed: options.length > windowThreshold,
     });
-    return (React.createElement(Field, { ...styledProps },
-        React.createElement(MaybeFieldLabel, { ...fieldLabelProps },
-            React.createElement(ReactSelect, { ref: ref, isSearchable: autocomplete, isDisabled: disabled, defaultMenuIsOpen: initialIsOpen, isMulti: multiselect, defaultValue: getReactSelectValue(options, defaultValue), value: getReactSelectValue(options, value), options: options, onChange: (newValue) => {
-                    if (!onChange)
-                        return;
-                    const value = extractValue(newValue, multiselect);
-                    onChange(value);
-                }, placeholder: placeholder || t("select"), "aria-required": required, required: required, "aria-invalid": error, inputId: id, styles: styles ? styles(stylesConfig) : stylesConfig, components: {
-                    Option: (props) => React.createElement(SelectOption, { ...props }, props.children),
-                    Control: SelectControl,
-                    MultiValue: SelectMultiValue,
-                    ClearIndicator: SelectClearIndicator,
-                    DropdownIndicator: SelectDropdownIndicator,
-                    SelectContainer: SelectContainer,
-                    Menu: SelectMenu,
-                    Input: SelectInput,
-                    ...(isWindowed ? { MenuList } : {}),
-                    ...components,
-                }, closeMenuOnSelect: closeMenuOnSelect, classNamePrefix: classNamePrefix, menuPosition: menuPosition, menuPlacement: menuPlacement, maxMenuHeight: numberFromDimension(maxHeight), noOptionsMessage: noOptionsMessage, ...props }),
-            React.createElement(InlineValidation, { mt: "x1", errorMessage: errorMessage, errorList: errorList }))));
+    return (_jsx(Field, { ...styledProps, children: _jsxs(MaybeFieldLabel, { ...fieldLabelProps, children: [_jsx(ReactSelect, { ref: ref, isSearchable: autocomplete, isDisabled: disabled, defaultMenuIsOpen: initialIsOpen, isMulti: multiselect, defaultValue: getReactSelectValue(options, defaultValue), value: getReactSelectValue(options, value), options: options, onChange: (newValue) => {
+                        if (!onChange)
+                            return;
+                        const value = extractValue(newValue, multiselect);
+                        onChange(value);
+                    }, placeholder: placeholder || t("select"), "aria-required": required, required: required, "aria-invalid": error, inputId: id, styles: styles ? styles(stylesConfig) : stylesConfig, components: {
+                        Option: (props) => _jsx(SelectOption, { ...props, children: props.children }),
+                        Control: SelectControl,
+                        MultiValue: SelectMultiValue,
+                        ClearIndicator: SelectClearIndicator,
+                        DropdownIndicator: SelectDropdownIndicator,
+                        SelectContainer: SelectContainer,
+                        Menu: SelectMenu,
+                        Input: SelectInput,
+                        ...(isWindowed ? { MenuList } : {}),
+                        ...components,
+                    }, closeMenuOnSelect: closeMenuOnSelect, classNamePrefix: classNamePrefix, menuPosition: menuPosition, menuPlacement: menuPlacement, maxMenuHeight: numberFromDimension(maxHeight), noOptionsMessage: noOptionsMessage, ...props }), _jsx(InlineValidation, { mt: "x1", errorMessage: errorMessage, errorList: errorList })] }) }));
 });
 export default NDSSelect;

package/dist/src/Select/Select.story.d.ts

@@ -8,107 +8,107 @@ declare const _default: {
 export default _default;
 type Story = StoryObj<typeof Select>;
 export declare const _Select: Story;
-export declare const WithStyledProps: () => React.JSX.Element;
+export declare const WithStyledProps: () => import("react/jsx-runtime").JSX.Element;
 export declare const WithABlankValue: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithAnOptionSelected: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithState: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const SetToDisabled: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithErrorMessage: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithErrorList: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const Required: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
-export declare const WithAClearButton: () => React.JSX.Element;
+export declare const WithAClearButton: () => import("react/jsx-runtime").JSX.Element;
 export declare const WithAllFieldLabelProps: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithCustomId: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithSmallerMaxHeight: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithWrappingText: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithMultiselect: {
-    (props: any): React.JSX.Element;
+    (props: any): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithCloseMenuOnSelectTurnedOff: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const TestMultiselectOverflow: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
 export declare const WithFixedPositioning: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
-export declare const WithFetchedOptions: () => React.JSX.Element;
+export declare const WithFetchedOptions: () => import("react/jsx-runtime").JSX.Element;
 export declare const WithCustomOptionComponent: {
-    (): React.JSX.Element;
+    (): import("react/jsx-runtime").JSX.Element;
     story: {
         name: string;
     };
 };
-export declare const UsingRefToControlFocus: () => React.JSX.Element;
-export declare const WithTopMenuPlacement: () => React.JSX.Element;
-export declare const WithCustomStyles: () => React.JSX.Element;
-export declare const WithCustomOptionFields: () => React.JSX.Element;
-export declare const WithACustomNoOptionsMessage: () => React.JSX.Element;
+export declare const UsingRefToControlFocus: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithTopMenuPlacement: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithCustomStyles: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithCustomOptionFields: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithACustomNoOptionsMessage: () => import("react/jsx-runtime").JSX.Element;

package/dist/src/Select/Select.story.fixture.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 import { GroupBase } from "react-select";
 import { SelectOptionProps } from "./SelectOption";
 import { NDSOption } from "./Select";
@@ -17,8 +16,8 @@ export declare const PCNList: {
     label: string;
 }[];
 export declare const getPhotos: () => Promise<any>;
-export declare const CustomOption: ({ children, ...props }: SelectOptionProps<NDSOption, true, GroupBase<NDSOption>>) => React.JSX.Element;
+export declare const CustomOption: ({ children, ...props }: SelectOptionProps<NDSOption, true, GroupBase<NDSOption>>) => import("react/jsx-runtime").JSX.Element;
 export interface DescriptiveOption extends NDSOption {
     description: string;
 }
-export declare const CustomFieldsOption: ({ ...props }: SelectOptionProps<DescriptiveOption, true, GroupBase<DescriptiveOption>>) => React.JSX.Element;
+export declare const CustomFieldsOption: ({ ...props }: SelectOptionProps<DescriptiveOption, true, GroupBase<DescriptiveOption>>) => import("react/jsx-runtime").JSX.Element;

package/dist/src/Select/Select.story.fixture.js

@@ -1,4 +1,4 @@
-import React from "react";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { styled } from "styled-components";
 import { SelectOption } from "./SelectOption";
 export const errorList = ["Error message 1", "Error message 2"];
@@ -55,13 +55,9 @@ const Indicator = styled.span(() => ({
     marginRight: "5px",
 }));
 export const CustomOption = ({ children, ...props }) => {
-    const newChildren = (React.createElement(React.Fragment, null,
-        React.createElement(Indicator, null),
-        children));
-    return React.createElement(SelectOption, { ...props }, newChildren);
+    const newChildren = (_jsxs(_Fragment, { children: [_jsx(Indicator, {}), children] }));
+    return _jsx(SelectOption, { ...props, children: newChildren });
 };
 export const CustomFieldsOption = ({ ...props }) => {
-    return (React.createElement(SelectOption, { ...props },
-        React.createElement("span", null, props.data.label),
-        React.createElement("span", null, props.data.description)));
+    return (_jsxs(SelectOption, { ...props, children: [_jsx("span", { children: props.data.label }), _jsx("span", { children: props.data.description })] }));
 };