@coinbase/cds-mobile 0.0.0 → 8.13.2

package/esm/controls/__stories__/TextInput.stories.js

@@ -0,0 +1,543 @@
+function _objectDestructuringEmpty(t) { if (null == t) throw new TypeError("Cannot destructure " + t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React, { useState } from 'react';
+import { Button } from '../../buttons/Button';
+import { Example, ExampleScreen } from '../../examples/ExampleScreen';
+import { useTheme } from '../../hooks/useTheme';
+import { Icon } from '../../icons';
+import { Box } from '../../layout/Box';
+import { HStack } from '../../layout/HStack';
+import { VStack } from '../../layout/VStack';
+import { Text } from '../../typography/Text';
+import { InputIcon } from '../InputIcon';
+import { InputIconButton } from '../InputIconButton';
+import { TextInput } from '../TextInput';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const MockTextInput = _ref => {
+  let props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
+  const [text, onChangeText] = useState('');
+  return /*#__PURE__*/_jsx(TextInput, _extends({
+    editable: __DEV__,
+    onChangeText: onChangeText,
+    value: text
+  }, props));
+};
+const MockCompactTextInput = _ref2 => {
+  let props = _extends({}, (_objectDestructuringEmpty(_ref2), _ref2));
+  const [text, onChangeText] = useState('');
+  return /*#__PURE__*/_jsx(TextInput, _extends({
+    compact: true,
+    editable: __DEV__,
+    onChangeText: onChangeText,
+    value: text
+  }, props));
+};
+const MockComplexInput = () => {
+  const [text, onChangeText] = useState('');
+  return /*#__PURE__*/_jsxs(HStack, {
+    justifyContent: "center",
+    children: [/*#__PURE__*/_jsx(TextInput, {
+      accessibilityHint: "Text Input field",
+      accessibilityLabel: "Text input field",
+      editable: __DEV__,
+      label: "Test",
+      onChangeText: onChangeText,
+      value: text,
+      width: "50%"
+    }), /*#__PURE__*/_jsx(VStack, {
+      paddingTop: 1,
+      children: /*#__PURE__*/_jsx(Box, {
+        paddingTop: 3,
+        children: /*#__PURE__*/_jsx(Button, {
+          children: "Hello"
+        })
+      })
+    })]
+  });
+};
+const InputScreen = () => {
+  const theme = useTheme();
+  const customStyle = {
+    backgroundColor: "rgb(" + theme.spectrum.gray10 + ")"
+  };
+  return /*#__PURE__*/_jsxs(ExampleScreen, {
+    children: [/*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput ForegroundMuted",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        helperText: "username must start with an @ symbol",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput ForegroundMuted accessibility label",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        accessibilityLabel: "Accessibility label for username",
+        helperText: "username must start with an @ symbol",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput ForegroundMuted accessibility label no helper text",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        accessibilityLabel: "Accessibility label for username",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput ellipsis long text",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        helperText: "Use textAlign='unset' to workaround the issue where long text does not ellipsis correctly.",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com",
+        textAlign: "unset",
+        value: "https://github.com/coinbase/cds/blob/master/docs/commands.md!-|?/",
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput Positive",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        helperText: "username must start with an @ symbol",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com",
+        variant: "positive"
+      })
+    }), /*#__PURE__*/_jsxs(Example, {
+      inline: true,
+      title: "TextInput Negative",
+      children: [/*#__PURE__*/_jsx(MockTextInput, {
+        helperText: "username must start with an @ symbol",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com",
+        variant: "negative"
+      }), /*#__PURE__*/_jsx(MockTextInput, {
+        align: "end",
+        helperText: "username must start with an @ symbol",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com",
+        variant: "negative"
+      })]
+    }), /*#__PURE__*/_jsxs(Example, {
+      inline: true,
+      title: "TextInput ColorSurge",
+      children: [/*#__PURE__*/_jsx(MockTextInput, {
+        enableColorSurge: true,
+        helperText: "username must start with an @ symbol",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com",
+        variant: "foregroundMuted"
+      }), /*#__PURE__*/_jsx(MockTextInput, {
+        enableColorSurge: true,
+        helperText: "username must start with an @ symbol",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com",
+        variant: "positive"
+      }), /*#__PURE__*/_jsx(MockTextInput, {
+        enableColorSurge: true,
+        helperText: "username must start with an @ symbol",
+        label: "Username",
+        placeholder: "john.doe@coinbase.com",
+        variant: "negative"
+      })]
+    }), /*#__PURE__*/_jsx(Example, {
+      title: "TextInput VStack FlexGrow",
+      children: /*#__PURE__*/_jsxs(VStack, {
+        alignItems: "flex-start",
+        flexGrow: 1,
+        children: [/*#__PURE__*/_jsx(MockTextInput, {
+          helperText: "username must start with an @ symbol",
+          label: "Username",
+          placeholder: "john.doe@coinbase.com",
+          variant: "negative"
+        }), /*#__PURE__*/_jsx(MockTextInput, {
+          helperText: "username must start with an @ symbol",
+          label: "Username",
+          placeholder: "john.doe@coinbase.com",
+          variant: "negative"
+        })]
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput startNode",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        helperText: "Search for assets here",
+        label: "Search",
+        placeholder: "ex. Bitcoin",
+        start: /*#__PURE__*/_jsx(InputIconButton, {
+          transparent: true,
+          name: "search"
+        }),
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput endNode",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        end: /*#__PURE__*/_jsx(InputIcon, {
+          active: true,
+          name: "lightningBolt"
+        }),
+        helperText: "Search for assets here",
+        label: "Search",
+        placeholder: "ex. Bitcoin",
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput Height",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        multiline: true,
+        height: 300,
+        label: "Bitcoin",
+        value: "100"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput Min Height",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        multiline: true,
+        label: "Bitcoin",
+        minHeight: 50,
+        value: " A really really really really long piece of text of text of text  of text of text of text of text of text of text of text of text of text "
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextArea",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        multiline: true,
+        helperText: "Write about yourself",
+        label: "Textarea",
+        placeholder: "I am amazing!",
+        value: " A really really really really long piece  of text displayed. A really really really really long piece  of text displayed.  A really really really really long piece  of text displayed ",
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput endNode 50%",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        end: /*#__PURE__*/_jsx(InputIcon, {
+          active: true,
+          name: "lightningBolt"
+        }),
+        helperText: "Search for assets here",
+        label: "Search",
+        placeholder: "ex. Bitcoin",
+        variant: "foregroundMuted",
+        width: "50%"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput Start Align Input Text and HelperText",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        align: "start",
+        helperText: "HelperText",
+        label: "Search",
+        placeholder: "ex. Bitcoin"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput End Align Input Text and HelperText",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        align: "end",
+        helperText: "HelperText",
+        label: "Search",
+        placeholder: "ex. Bitcoin"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput start/end Node",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        end: /*#__PURE__*/_jsx(Text, {
+          accessibilityHint: "Cancel",
+          accessibilityLabel: "Cancel",
+          color: "fgMuted",
+          font: "body",
+          paddingEnd: 2,
+          children: "Cancel"
+        }),
+        helperText: "Search for assets here",
+        label: "Search",
+        placeholder: "ex. Bitcoin",
+        start: /*#__PURE__*/_jsx(InputIconButton, {
+          transparent: true,
+          name: "search"
+        }),
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput suffix",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        helperText: "Search for assets here",
+        label: "Search",
+        placeholder: "ex. Bitcoin",
+        suffix: "DOGE",
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput Disabled",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        disabled: true,
+        editable: false,
+        end: /*#__PURE__*/_jsx(Text, {
+          accessibilityHint: "Cancel",
+          accessibilityLabel: "Cancel",
+          color: "fgMuted",
+          font: "body",
+          paddingEnd: 2,
+          children: "Cancel"
+        }),
+        label: "One Time Password",
+        placeholder: "189-280-1111",
+        start: /*#__PURE__*/_jsx(InputIconButton, {
+          disabled: true,
+          transparent: true,
+          name: "search"
+        }),
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput No Label",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        placeholder: "189-280-1111",
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "CompactTextInput",
+      children: /*#__PURE__*/_jsx(MockCompactTextInput, {
+        label: "One Time Password",
+        placeholder: "189-280-1111",
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "CompactTextInput with start node",
+      children: /*#__PURE__*/_jsx(MockCompactTextInput, {
+        label: "Compact Start Node",
+        placeholder: "189-280-1111",
+        start: /*#__PURE__*/_jsx(HStack, {
+          accessibilityHint: "Start Node",
+          accessibilityLabel: "Start Node",
+          children: /*#__PURE__*/_jsx(Text, {
+            font: "body",
+            children: "Start Node"
+          })
+        }),
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "CompactTextInput with suffix",
+      children: /*#__PURE__*/_jsx(MockCompactTextInput, {
+        label: "Compact Suffix",
+        placeholder: "189-280-1111",
+        suffix: "Suffix",
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "CompactTextInput with End Node",
+      children: /*#__PURE__*/_jsx(MockCompactTextInput, {
+        end: /*#__PURE__*/_jsx(Text, {
+          accessibilityHint: "Cancel",
+          accessibilityLabel: "Cancel",
+          font: "body",
+          children: "End Node"
+        }),
+        label: "Compact Suffix",
+        placeholder: "189-280-1111",
+        variant: "foregroundMuted"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "CompactTextInput Negative",
+      children: /*#__PURE__*/_jsx(MockCompactTextInput, {
+        helperText: "Password is in an incorrect format",
+        label: "One Time Password",
+        placeholder: "189-280-1111",
+        variant: "negative"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "CompactTextInput Positive",
+      children: /*#__PURE__*/_jsx(MockCompactTextInput, {
+        helperText: "Password is looking good!",
+        label: "One Time Password",
+        placeholder: "189-280-1111",
+        variant: "positive"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "CompactTextInput Start Align Input Text and HelperText",
+      children: /*#__PURE__*/_jsx(MockCompactTextInput, {
+        align: "start",
+        helperText: "Password is looking good!",
+        label: "One Time Password",
+        placeholder: "189-280-1111"
+      })
+    }), /*#__PURE__*/_jsxs(Example, {
+      inline: true,
+      title: "CompactTextInput 50%",
+      children: [/*#__PURE__*/_jsx(MockCompactTextInput, {
+        label: "Bitcoin",
+        placeholder: "190",
+        width: "50%"
+      }), /*#__PURE__*/_jsx(MockCompactTextInput, {})]
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "CompactTextInput Disabled",
+      children: /*#__PURE__*/_jsx(MockCompactTextInput, {
+        disabled: true,
+        editable: false,
+        label: "Bitcoin"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "Accessibility Test",
+      children: /*#__PURE__*/_jsx(MockCompactTextInput, {
+        accessibilityHint: "Bitcoin search",
+        accessibilityLabel: "Bitcoin search",
+        label: "Bitcoin"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      children: /*#__PURE__*/_jsx(MockComplexInput, {})
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput Custom Background",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        label: "Username",
+        placeholder: "john.doe@coinbase.com",
+        style: customStyle
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput without border",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        bordered: false,
+        label: "Username",
+        placeholder: "john.doe@coinbase.com"
+      })
+    }), /*#__PURE__*/_jsxs(Example, {
+      inline: true,
+      title: "Read-Only TextInput",
+      children: [/*#__PURE__*/_jsx(MockTextInput, {
+        readOnly: true,
+        label: "Read-Only",
+        placeholder: "Placeholder",
+        value: "Some text"
+      }), /*#__PURE__*/_jsx(MockTextInput, {
+        readOnly: true,
+        helperText: "Helper Text",
+        label: "Read-Only with helperText",
+        placeholder: "Placeholder",
+        value: "Some text"
+      }), /*#__PURE__*/_jsx(TextInput, {
+        readOnly: true,
+        accessibilityLabel: "Text input field",
+        label: "Read-Only with Start Node",
+        start: /*#__PURE__*/_jsx(Box, {
+          paddingX: 2,
+          children: /*#__PURE__*/_jsx(Icon, {
+            color: "fg",
+            name: "qrCode",
+            size: "m"
+          })
+        }),
+        value: "Some text"
+      }), /*#__PURE__*/_jsx(TextInput, {
+        readOnly: true,
+        accessibilityLabel: "Text input field",
+        end: /*#__PURE__*/_jsx(Box, {
+          paddingX: 2,
+          children: /*#__PURE__*/_jsx(Icon, {
+            color: "fg",
+            name: "qrCode",
+            size: "m"
+          })
+        }),
+        label: "Compact Read-Only with End Node",
+        placeholder: "Placeholder"
+      }), /*#__PURE__*/_jsx(MockTextInput, {
+        readOnly: true,
+        bordered: false,
+        label: "Borderless Read-Only",
+        placeholder: "Placeholder"
+      })]
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput with inside label",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        label: "Username",
+        labelVariant: "inside",
+        placeholder: "john.doe@coinbase.com"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput with inside label and start node",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        label: "Username",
+        labelVariant: "inside",
+        placeholder: "john.doe@coinbase.com",
+        start: /*#__PURE__*/_jsx(InputIconButton, {
+          transparent: true,
+          name: "search"
+        })
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput with inside label and end node",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        end: /*#__PURE__*/_jsx(InputIconButton, {
+          transparent: true,
+          name: "lightningBolt"
+        }),
+        label: "Username",
+        labelVariant: "inside",
+        placeholder: "john.doe@coinbase.com"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput with inside label and both nodes",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        end: /*#__PURE__*/_jsx(InputIconButton, {
+          transparent: true,
+          name: "close"
+        }),
+        label: "Username",
+        labelVariant: "inside",
+        placeholder: "john.doe@coinbase.com",
+        start: /*#__PURE__*/_jsx(InputIconButton, {
+          transparent: true,
+          name: "search"
+        })
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput with inside label and compact",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        compact: true,
+        label: "Username",
+        labelVariant: "inside",
+        placeholder: "john.doe@coinbase.com"
+      })
+    }), /*#__PURE__*/_jsx(Example, {
+      inline: true,
+      title: "TextInput with inside label and error state",
+      children: /*#__PURE__*/_jsx(MockTextInput, {
+        helperText: "Error: Your favorite color is not orange",
+        label: "Error state",
+        labelVariant: "inside",
+        placeholder: "Enter your favorite color",
+        variant: "negative"
+      })
+    })]
+  });
+};
+export default InputScreen;

package/esm/controls/context.js

@@ -0,0 +1,2 @@
+import { createContext } from 'react';
+export const TextInputFocusVariantContext = /*#__PURE__*/createContext(undefined);

package/esm/controls/index.js

@@ -0,0 +1,15 @@
+export * from './Checkbox';
+export * from './CheckboxCell';
+export * from './CheckboxGroup';
+export * from './ControlGroup';
+export * from './InputIcon';
+export * from './InputIconButton';
+export * from './Menu';
+export * from './Radio';
+export * from './RadioCell';
+export * from './RadioGroup';
+export * from './SearchInput';
+export * from './Select';
+export * from './SelectOption';
+export * from './Switch';
+export * from './TextInput';

package/esm/controls/useControlMotionProps.js

@@ -0,0 +1,35 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import { useMemo, useRef } from 'react';
+import { Animated } from 'react-native';
+import { checkboxOpacityEnterConfig, checkboxOpacityExitConfig, checkboxScaleEnterConfig, checkboxScaleExitConfig } from '@coinbase/cds-common/motion/checkbox';
+import { switchTransitionConfig } from '@coinbase/cds-common/motion/switch';
+import { convertMotionConfig } from '../animation/convertMotionConfig';
+/**
+ * Checkbox and RadioGroup shares the same motion tokens while Switch uses different timing token.
+ * Check the motion specs below:
+ * @link Checkbox: https://coda.io/d/Motion-Foundations_d5KlLHcBPlL/CDS-Check-Box_suHNC#_lu30T
+ * @link RadioGroup: https://coda.io/d/Motion-Foundations_d5KlLHcBPlL/CDS-Radio-Group_susTj#_lu0fa
+ * @link Switch: https://coda.io/d/Motion-Foundations_d5KlLHcBPlL/CDS-Switch_su7H7#_luhBA
+ */
+export const useControlMotionProps = _ref => {
+  let {
+    checked,
+    disabled,
+    shouldUseSwitchTransition = false
+  } = _ref;
+  const animatedBoxValue = useRef(new Animated.Value(checked && !disabled ? 1 : 0)).current;
+  const animatedScaleValue = useRef(new Animated.Value(checked ? checkboxScaleEnterConfig.toValue : checkboxScaleEnterConfig.fromValue)).current;
+  const animatedOpacityValue = useRef(new Animated.Value(checked ? checkboxOpacityEnterConfig.toValue : checkboxOpacityEnterConfig.fromValue)).current;
+  const enter = useMemo(() => Animated.parallel([Animated.timing(animatedBoxValue, convertMotionConfig(_extends({}, checkboxOpacityEnterConfig, {
+    useNativeDriver: false
+  }))), Animated.timing(animatedScaleValue, convertMotionConfig(_extends({}, checkboxScaleEnterConfig, shouldUseSwitchTransition ? switchTransitionConfig : {}))), Animated.timing(animatedOpacityValue, convertMotionConfig(checkboxOpacityEnterConfig))]), [animatedBoxValue, animatedScaleValue, animatedOpacityValue, shouldUseSwitchTransition]);
+  const exit = useMemo(() => Animated.parallel([Animated.timing(animatedBoxValue, convertMotionConfig(_extends({}, checkboxOpacityExitConfig, {
+    useNativeDriver: false
+  }))), Animated.timing(animatedScaleValue, convertMotionConfig(_extends({}, checkboxScaleExitConfig, shouldUseSwitchTransition ? switchTransitionConfig : {}))), Animated.timing(animatedOpacityValue, convertMotionConfig(checkboxOpacityExitConfig))]), [animatedBoxValue, animatedScaleValue, animatedOpacityValue, shouldUseSwitchTransition]);
+  return {
+    animation: checked ? enter : exit,
+    animatedBoxValue,
+    animatedScaleValue,
+    animatedOpacityValue
+  };
+};

package/esm/controls/useSelect.js

@@ -0,0 +1,13 @@
+import { useMemo } from 'react';
+export const useSelect = _ref => {
+  let {
+    value,
+    onChange,
+    handleClose
+  } = _ref;
+  return useMemo(() => ({
+    value,
+    onChange,
+    handleClose
+  }), [value, onChange, handleClose]);
+};

package/esm/core/theme.js

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