@elliemae/ds-toolbar 3.0.0-next.2 → 3.0.0-next.6

package/esm/deprecated/DSToolbar.js

@@ -1,83 +0,0 @@
-import 'core-js/modules/esnext.async-iterator.filter.js';
-import 'core-js/modules/esnext.iterator.constructor.js';
-import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import { useRef } from 'react';
-import { PropTypes, describe } from 'react-desc';
-import { aggregatedClasses } from '@elliemae/ds-classnames';
-import FocusGroupProvider from '@elliemae/ds-shared/FocusGroup/FocusGroupManager';
-import { mergeRefs } from '@elliemae/ds-utilities';
-import decorateToolbarChildren from './decorateToolbarChildren.js';
-export { default as ToolbarItem } from './ToolbarItem.js';
-export { default as ToolbarGroup } from './ToolbarGroup.js';
-export { default as ToolbarDivider } from './ToolbarDivider.js';
-import { jsx } from 'react/jsx-runtime';
-
-const _excluded = ["containerProps", "innerRef", "withDepth", "alignment", "autoFocusOnMount", "children", "size"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const blockName = 'toolbar';
-const ToolbarContainer = aggregatedClasses('div')(blockName, null, _ref => {
-  let {
-    withDepth,
-    alignment,
-    size
-  } = _ref;
-  return {
-    'without-depth': !withDepth,
-    [alignment]: !!alignment,
-    [size]: size
-  };
-});
-
-const DSToolbar = _ref2 => {
-  let {
-    containerProps = {},
-    innerRef,
-    withDepth = true,
-    alignment = 'right',
-    // left || right
-    autoFocusOnMount = true,
-    children = [],
-    size = 'normal'
-  } = _ref2,
-      otherProps = _objectWithoutProperties(_ref2, _excluded);
-
-  const containerRef = useRef(null);
-  return /*#__PURE__*/_jsx(FocusGroupProvider, {
-    autoFocusOnMount: autoFocusOnMount,
-    getContainer: () => containerRef.current,
-    keyBindings: {
-      Tab: 'next'
-    },
-    orientation: "horizontal"
-  }, void 0, /*#__PURE__*/jsx(ToolbarContainer, _objectSpread(_objectSpread(_objectSpread({}, containerProps), otherProps), {}, {
-    classProps: {
-      withDepth,
-      alignment,
-      size
-    },
-    innerRef: mergeRefs(innerRef, containerRef),
-    children: decorateToolbarChildren(children)
-  })));
-};
-
-const toolbarProps = {
-  containerProps: PropTypes.object.description('Set of Properties attached to the main container'),
-  withDepth: PropTypes.bool.description('Shows a shadow rear the toolbar').defaultValue(true),
-  alignment: PropTypes.oneOf(['right', 'left']).description('Aligns the toolbar to the left or right').defaultValue('right'),
-  size: PropTypes.oneOf(['normal', 'compact']).description('Toolbar size').defaultValue('normal'),
-  autoFocusOnMount: PropTypes.bool.description('Wheter to focus the component when it mounts or not').defaultValue(true),
-  children: PropTypes.oneOfType([PropTypes.array, PropTypes.func, PropTypes.node]).description('Toolbar items').isRequired,
-  innerRef: PropTypes.object.description('Ref to the Toolbar container element')
-};
-const ToolbarWithSchema = describe(DSToolbar);
-ToolbarWithSchema.propTypes = toolbarProps;
-
-export { DSToolbar, ToolbarWithSchema, DSToolbar as default };

package/esm/deprecated/ToolbarDivider.js

@@ -1,7 +0,0 @@
-import { aggregatedClasses } from '@elliemae/ds-classnames';
-
-const blockName = 'toolbar';
-const ToolbarDivider = aggregatedClasses('div')(blockName, 'divider');
-ToolbarDivider.displayName = 'ToolbarDivider';
-
-export { ToolbarDivider as default };

package/esm/deprecated/ToolbarGroup.js

@@ -1,31 +0,0 @@
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import 'react';
-import { aggregatedClasses } from '@elliemae/ds-classnames';
-import decorateToolbarChildren from './decorateToolbarChildren.js';
-
-const blockName = 'toolbar-group';
-const ToolbarGroupContainer = aggregatedClasses('div')(blockName, null, _ref => {
-  let {
-    space
-  } = _ref;
-  return {
-    ["space-".concat(space)]: !!space
-  };
-});
-
-const ToolbarGroup = _ref2 => {
-  let {
-    children,
-    size,
-    space = 0
-  } = _ref2;
-  return /*#__PURE__*/_jsx(ToolbarGroupContainer, {
-    classProps: {
-      space
-    }
-  }, void 0, decorateToolbarChildren(children, {
-    size
-  }));
-};
-
-export { ToolbarGroup as default };

package/esm/deprecated/ToolbarItem.js

@@ -1,51 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import 'core-js/modules/web.dom-collections.iterator.js';
-import 'core-js/modules/esnext.async-iterator.filter.js';
-import 'core-js/modules/esnext.iterator.constructor.js';
-import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
-import React, { useState } from 'react';
-import { useFocusGroupWithState } from '@elliemae/ds-shared/FocusGroup';
-import DSButton from '@elliemae/ds-button';
-import { PopperPositions } from '@elliemae/ds-popper';
-import { jsx } from 'react/jsx-runtime';
-
-const _excluded = ["icon", "labelText", "menu"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-const ToolbarItem = _ref => {
-  let {
-    icon,
-    labelText,
-    menu = undefined
-  } = _ref,
-      otherProps = _objectWithoutProperties(_ref, _excluded);
-
-  const [ref, setRef] = useState(null);
-  useFocusGroupWithState(ref);
-
-  const btn = /*#__PURE__*/jsx(DSButton, _objectSpread(_objectSpread({}, otherProps), {}, {
-    buttonType: "text",
-    icon: icon,
-    innerRef: r => setRef(r),
-    labelText: labelText
-  }));
-
-  if (menu) {
-    return /*#__PURE__*/React.cloneElement(menu, _objectSpread(_objectSpread({}, menu.props), {}, {
-      placement: PopperPositions.BOTTOM_END,
-      triggerComponent: btn
-    }));
-  }
-
-  return btn;
-};
-
-ToolbarItem.displayName = 'ToolbarItem';
-
-export { ToolbarItem as default };

package/esm/deprecated/decorateToolbarChildren.js

@@ -1,21 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import 'core-js/modules/esnext.async-iterator.map.js';
-import 'core-js/modules/esnext.iterator.map.js';
-import 'core-js/modules/esnext.async-iterator.filter.js';
-import 'core-js/modules/esnext.iterator.constructor.js';
-import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
-import React, { cloneElement } from 'react';
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-var decorateToolbarChildren = (function (children) {
-  let extraProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  return React.Children.map(children, component => component ? /*#__PURE__*/cloneElement(component, _objectSpread(_objectSpread(_objectSpread({}, extraProps), component.props), {}, {
-    className: "".concat(component.props.className, " toolbar-item")
-  })) : component, null);
-});
-
-export { decorateToolbarChildren as default };

package/esm/deprecated/index.js

@@ -1,4 +0,0 @@
-export { DSToolbar, ToolbarWithSchema, DSToolbar as default } from './DSToolbar.js';
-export { default as ToolbarItem } from './ToolbarItem.js';
-export { default as ToolbarGroup } from './ToolbarGroup.js';
-export { default as ToolbarDivider } from './ToolbarDivider.js';

package/esm/index.js

@@ -1,7 +0,0 @@
-export { DSToolbar, ToolbarWithSchema, DSToolbar as default } from './deprecated/DSToolbar.js';
-export { DSToolbarV2, DSToolbarV2WithSchema } from './DSToolbarV2.js';
-export { DSToolbarItemV2 } from './DSToolbarItemV2.js';
-export { DSToolbarSeparatorV2 } from './DSToolbarSeparatorV2.js';
-export { default as ToolbarItem } from './deprecated/ToolbarItem.js';
-export { default as ToolbarGroup } from './deprecated/ToolbarGroup.js';
-export { default as ToolbarDivider } from './deprecated/ToolbarDivider.js';

package/esm/props.js

@@ -1,10 +0,0 @@
-import { PropTypes } from 'react-desc';
-
-const DSToolbarV2Schema = {
-  alignment: PropTypes.oneOf(['right', 'left']).description('Whether to align the content left or right').defaultValue('right'),
-  withDepth: PropTypes.bool.description('Whether to add a box-shadow to the container').defaultValue(true),
-  compact: PropTypes.bool.description('Whether you want the compact version of the toolbar').defaultValue(false),
-  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description('Reference to attach to the wrapper')
-};
-
-export { DSToolbarV2Schema };

package/esm/styled.js

@@ -1,14 +0,0 @@
-import styled from 'styled-components';
-import Grid from '@elliemae/ds-grid';
-
-const StyledToolbarWrapper = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-8ez8n4-0"
-})(["background-color:", ";min-height:", ";max-height:", ";padding:0 ", ";box-shadow:", ";"], props => props.theme.colors.neutral['000'], props => props.compact ? '28px' : '40px', props => props.theme.space.xxl, props => props.theme.space.xxs, props => !props.withDepth ? 'none' : '0 1px 5px 0 rgb(0 0 0 / 13%), 0 2px 4px 0 rgb(0 0 0 / 20%)');
-const StyledToolbarItem = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-8ez8n4-1"
-})([""]);
-const StyledSeparator = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-8ez8n4-2"
-})(["height:30px;width:1px;background-color:", ";"], props => props.theme.colors.neutral[200]);
-
-export { StyledSeparator, StyledToolbarItem, StyledToolbarWrapper };

package/esm/useToolbarItemHandlers.js

@@ -1,35 +0,0 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
-import { useContext, useCallback } from 'react';
-import { DSToolbarV2Context } from './DSToolbarV2Context.js';
-
-const useToolbarItemHandlers = toolbarItemId => {
-  const {
-    toolbarUid,
-    itemReferences
-  } = useContext(DSToolbarV2Context);
-  const onKeyDown = useCallback(e => {
-    const toolbarItems = [...document.querySelectorAll("#".concat(toolbarUid, " .ds-toolbar-item"))];
-    let nextToolbarItemIndex = -1;
-
-    if (['ArrowLeft', 'ArrowRight'].includes(e.code)) {
-      const toolbarItemIndex = toolbarItems.findIndex(domElem => domElem.id === toolbarItemId);
-      nextToolbarItemIndex = toolbarItemIndex + (e.code === 'ArrowLeft' ? -1 : 1);
-    } else if (e.code === 'Home') {
-      nextToolbarItemIndex = 0;
-    } else if (e.code === 'End') {
-      nextToolbarItemIndex = toolbarItems.length - 1;
-    }
-
-    if (nextToolbarItemIndex >= 0 && nextToolbarItemIndex < toolbarItems.length) {
-      e.preventDefault();
-      e.stopPropagation();
-      const ref = itemReferences[toolbarItems[nextToolbarItemIndex].id];
-      if (ref.current) ref.current.focus();
-    }
-  }, [toolbarUid, toolbarItemId, itemReferences]);
-  return {
-    onKeyDown
-  };
-};
-
-export { useToolbarItemHandlers };

package/types/DSToolbarItemV2.d.ts

@@ -1,8 +0,0 @@
-import React, { MutableRefObject } from 'react';
-interface ToolbarItemProps {
-    render: (props: {
-        innerRef: MutableRefObject<HTMLElement>;
-    }) => JSX.Element;
-}
-export declare const DSToolbarItemV2: React.ComponentType<ToolbarItemProps>;
-export {};

package/types/DSToolbarSeparatorV2.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const DSToolbarSeparatorV2: React.ComponentType;

package/types/DSToolbarV2.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-interface ToolbarProps {
-    alignment?: 'left' | 'right';
-    withDepth?: boolean;
-    compact?: boolean;
-    innerRef?: React.MutableRefObject<HTMLDivElement>;
-}
-declare const DSToolbarV2: React.ComponentType<ToolbarProps>;
-declare const DSToolbarV2WithSchema: any;
-export { DSToolbarV2, DSToolbarV2WithSchema };

package/types/DSToolbarV2Context.d.ts

@@ -1,8 +0,0 @@
-import { MutableRefObject } from 'react';
-interface IDSToolbarV2Context {
-    registerReference: (uid: string, ref: MutableRefObject<HTMLElement>) => void;
-    itemReferences: Record<string, MutableRefObject<HTMLElement>>;
-    toolbarUid: string;
-}
-export declare const DSToolbarV2Context: import("react").Context<IDSToolbarV2Context>;
-export {};

package/types/deprecated/DSToolbar.d.ts

@@ -1,60 +0,0 @@
-/// <reference path="../../../../../shared/typings/react-desc.d.ts" />
-/// <reference types="react" />
-import Item from './ToolbarItem';
-import ToolbarGroup from './ToolbarGroup';
-import Divider from './ToolbarDivider';
-declare const DSToolbar: {
-    ({ containerProps, innerRef, withDepth, alignment, autoFocusOnMount, children, size, ...otherProps }: {
-        [x: string]: any;
-        containerProps?: {} | undefined;
-        innerRef: any;
-        withDepth?: boolean | undefined;
-        alignment?: string | undefined;
-        autoFocusOnMount?: boolean | undefined;
-        children?: never[] | undefined;
-        size?: string | undefined;
-    }): JSX.Element;
-    propTypes: {
-        containerProps: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-        withDepth: {
-            deprecated: import("react-desc").PropTypesDescValidator;
-        };
-        alignment: {
-            deprecated: import("react-desc").PropTypesDescValidator;
-        };
-        size: {
-            deprecated: import("react-desc").PropTypesDescValidator;
-        };
-        autoFocusOnMount: {
-            deprecated: import("react-desc").PropTypesDescValidator;
-        };
-        children: import("react-desc").PropTypesDescValue;
-        innerRef: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-    };
-};
-declare const ToolbarWithSchema: {
-    (props?: {
-        [x: string]: any;
-        containerProps?: {} | undefined;
-        innerRef: any;
-        withDepth?: boolean | undefined;
-        alignment?: string | undefined;
-        autoFocusOnMount?: boolean | undefined;
-        children?: never[] | undefined;
-        size?: string | undefined;
-    } | undefined): JSX.Element;
-    propTypes: unknown;
-    toTypescript: () => import("react-desc").TypescriptSchema;
-};
-export { DSToolbar, Item as ToolbarItem, ToolbarGroup, Divider as ToolbarDivider, ToolbarWithSchema, };
-export default DSToolbar;

package/types/deprecated/ToolbarDivider.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-declare const ToolbarDivider: import("react").ForwardRefExoticComponent<import("react").RefAttributes<unknown>>;
-export default ToolbarDivider;

package/types/deprecated/ToolbarGroup.d.ts

@@ -1,15 +0,0 @@
-/// <reference types="react" />
-import PropTypes from 'prop-types';
-declare const ToolbarGroup: {
-    ({ children, size, space }: {
-        children: any;
-        size: any;
-        space?: number | undefined;
-    }): JSX.Element;
-    propTypes: {
-        children: PropTypes.Requireable<any>;
-        size: PropTypes.Requireable<number>;
-        space: PropTypes.Requireable<number>;
-    };
-};
-export default ToolbarGroup;

package/types/deprecated/ToolbarItem.d.ts

@@ -1,16 +0,0 @@
-/// <reference types="react" />
-import PropTypes from 'prop-types';
-declare const ToolbarItem: {
-    ({ icon, labelText, menu, ...otherProps }: {
-        [x: string]: any;
-        icon: any;
-        labelText: any;
-        menu?: undefined;
-    }): JSX.Element;
-    displayName: string;
-    propTypes: {
-        icon: PropTypes.Requireable<PropTypes.ReactElementLike>;
-        labelText: PropTypes.Requireable<string>;
-    };
-};
-export default ToolbarItem;

package/types/deprecated/decorateToolbarChildren.d.ts

@@ -1,2 +0,0 @@
-declare const _default: (children: any, extraProps?: {}) => any;
-export default _default;

package/types/deprecated/index.d.ts

@@ -1,2 +0,0 @@
-export * from './DSToolbar';
-export { default } from './DSToolbar';

package/types/index.d.ts

@@ -1,5 +0,0 @@
-export * from './deprecated';
-export { default } from './deprecated';
-export * from './DSToolbarV2';
-export * from './DSToolbarItemV2';
-export * from './DSToolbarSeparatorV2';

package/types/props.d.ts

@@ -1,18 +0,0 @@
-/// <reference path="../../../../shared/typings/react-desc.d.ts" />
-export declare const DSToolbarV2Schema: {
-    alignment: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    withDepth: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    compact: {
-        deprecated: import("react-desc").PropTypesDescValidator;
-    };
-    innerRef: {
-        defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-            deprecated: import("react-desc").PropTypesDescValidator;
-        };
-        isRequired: import("react-desc").PropTypesDescValue;
-    };
-};

package/types/styled.d.ts

@@ -1,4 +0,0 @@
-/// <reference types="react" />
-export declare const StyledToolbarWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledToolbarItem: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledSeparator: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;

package/types/tests/DSToolbar.test.d.ts

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

package/types/useToolbarItemHandlers.d.ts

@@ -1,3 +0,0 @@
-export declare const useToolbarItemHandlers: (toolbarItemId: string) => {
-    onKeyDown: React.KeyboardEventHandler;
-};