@flodesk/grain 6.12.0 → 6.12.2

package/es/components/dropdown.js

@@ -1,33 +1,20 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-import "core-js/modules/es.object.assign.js";
 import "core-js/modules/es.array.map.js";
 import PropTypes from 'prop-types';
 import React, { Fragment } from 'react';
-import { Box } from '.';
 import { Menu } from '@headlessui/react';
 import { types } from '../types';
 import { MenuCard, MenuItem } from '../foundational';
 import { useMenuPosition } from '../foundational/menu';
 import { FloatingPortal } from '@floating-ui/react-dom-interactions';
 import { jsx as ___EmotionJSX } from "@emotion/react";
-
-var Root = function Root(_ref) {
-  var props = Object.assign({}, _ref);
-  return ___EmotionJSX(Box, _extends({
-    position: "relative",
-    width: "fit-content"
-  }, props));
-};
-
-export var Dropdown = function Dropdown(_ref2) {
-  var options = _ref2.options,
-      _ref2$menuPlacement = _ref2.menuPlacement,
-      menuPlacement = _ref2$menuPlacement === void 0 ? 'bottomStart' : _ref2$menuPlacement,
-      _ref2$menuWidth = _ref2.menuWidth,
-      menuWidth = _ref2$menuWidth === void 0 ? '192px' : _ref2$menuWidth,
-      menuZIndex = _ref2.menuZIndex,
-      trigger = _ref2.trigger;
+export var Dropdown = function Dropdown(_ref) {
+  var options = _ref.options,
+      _ref$menuPlacement = _ref.menuPlacement,
+      menuPlacement = _ref$menuPlacement === void 0 ? 'bottomStart' : _ref$menuPlacement,
+      _ref$menuWidth = _ref.menuWidth,
+      menuWidth = _ref$menuWidth === void 0 ? '192px' : _ref$menuWidth,
+      menuZIndex = _ref.menuZIndex,
+      trigger = _ref.trigger;
 
   var _useMenuPosition = useMenuPosition({
     menuWidth: menuWidth,
@@ -37,10 +24,8 @@ export var Dropdown = function Dropdown(_ref2) {
       floating = _useMenuPosition.floating,
       floatingStyles = _useMenuPosition.floatingStyles;
 
-  return ___EmotionJSX(Menu, {
-    as: Root
-  }, function (_ref3) {
-    var open = _ref3.open;
+  return ___EmotionJSX(Menu, null, function (_ref2) {
+    var open = _ref2.open;
     return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(Menu.Button, {
       as: Fragment,
       ref: reference
@@ -56,8 +41,8 @@ export var Dropdown = function Dropdown(_ref2) {
     }, options.map(function (option, index) {
       return ___EmotionJSX(Menu.Item, {
         key: index
-      }, function (_ref4) {
-        var active = _ref4.active;
+      }, function (_ref3) {
+        var active = _ref3.active;
         return ___EmotionJSX(MenuItem, {
           icon: option.icon,
           isActive: active,

package/es/hooks/index.js

@@ -1,5 +1,5 @@
-export { useMedia } from './useMedia';
-export { useKeyPress } from './useKeyPress';
-export { useOnClickOutside } from './useOnClickOutside';
-export { useWindowSize } from './useWindowSize';
-export { useWidth } from './useWidth';
+export * from './useMedia';
+export * from './useKeyPress';
+export * from './useOnClickOutside';
+export * from './useWindowSize';
+export * from './useWidth';

package/es/hooks/useMedia.js

@@ -23,6 +23,7 @@ import "core-js/modules/web.dom-collections.iterator.js";
 import "core-js/modules/es.array.slice.js";
 import "core-js/modules/es.array.from.js";
 import "core-js/modules/es.regexp.exec.js";
+import { useEffect, useState } from 'react';
 export function useMedia(queries, values, defaultValue) {
   var mediaQueryLists = queries.map(function (q) {
     return window.matchMedia(q);

package/es/index.js

@@ -1,4 +1,5 @@
 export * from './components';
 export * from './icons';
 export * from './variables';
-export * from './utilities';
+export * from './utilities';
+export * from './hooks';

package/es/types.js

@@ -1,7 +1,10 @@
+import "core-js/modules/es.array.concat.js";
 import "core-js/modules/es.object.keys.js";
 import PropTypes from 'prop-types';
 import { vars } from './variables';
-export var placements = ['top', 'topStart', 'topEnd', 'bottom', 'bottomStart', 'bottomEnd', 'right', 'rightStart', 'rightEnd', 'left', 'leftStart', 'leftEnd'];
+export var yPlacements = ['top', 'topStart', 'topEnd', 'bottom', 'bottomStart', 'bottomEnd'];
+export var xPlacements = ['right', 'rightStart', 'rightEnd', 'left', 'leftStart', 'leftEnd'];
+export var placements = [].concat(yPlacements, xPlacements);
 export var gridContentPositions = ['start', 'end', 'center', 'stretch', 'space-around', 'space-between', 'space-evenly'];
 export var gridItemsAlignments = ['start', 'end', 'center', 'stretch'];
 export var autoFlows = ['column', 'row'];
@@ -31,7 +34,7 @@ export var types = {
   clearButtonVariant: PropTypes.oneOf(['neutral', 'danger']),
   buttonVariant: PropTypes.oneOf(['neutral', 'accent', 'danger']),
   iconPosition: PropTypes.oneOf(['left', 'right']),
-  menuPlacement: PropTypes.oneOf(['bottomStart', 'bottomEnd', 'topStart', 'topEnd']),
+  menuPlacement: PropTypes.oneOf(yPlacements),
   placement: PropTypes.oneOf(placements),
   textInput: PropTypes.oneOf(['text', 'password', 'email', 'date', 'datetime-local', 'email', 'month', 'number', 'password', 'search', 'tel', 'time', 'url', 'week']),
   buttonType: PropTypes.oneOf(['button', 'submit', 'reset']),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flodesk/grain",
-  "version": "6.12.0",
+  "version": "6.12.2",
   "description": "Flodesk design system",
   "module": "es/index.js",
   "author": "Flodesk",