@zohodesk/components 1.0.0-temp-73 → 1.0.0-temp-75

package/lib/index.js

@@ -8,14 +8,6 @@ var _exportNames = {
   ReactDOM: true,
   renderToStaticMarkup: true,
   _provider: true,
-  Grid__default: true,
-  Grid__Basic_Detail_Layout: true,
-  Grid__Auto_Flow_Row: true,
-  Grid__Area_Based_Detail_Layout: true,
-  Grid__Line_Based_Detail_Layout: true,
-  Grid__Area_Based_List_Layout: true,
-  Grid__Line_Based_List_Layout: true,
-  Grid__Box_Alignment: true,
   Layout__default: true,
   Layout__two_Column: true,
   Layout__three_Column: true,
@@ -473,54 +465,6 @@ Object.defineProperty(exports, "DropDownHeading__Heading", {
     return _DropDownHeading__default["default"];
   }
 });
-Object.defineProperty(exports, "Grid__Area_Based_Detail_Layout", {
-  enumerable: true,
-  get: function get() {
-    return _Grid__Area_Based_Detail_Layout["default"];
-  }
-});
-Object.defineProperty(exports, "Grid__Area_Based_List_Layout", {
-  enumerable: true,
-  get: function get() {
-    return _Grid__Area_Based_List_Layout["default"];
-  }
-});
-Object.defineProperty(exports, "Grid__Auto_Flow_Row", {
-  enumerable: true,
-  get: function get() {
-    return _Grid__Auto_Flow_Row["default"];
-  }
-});
-Object.defineProperty(exports, "Grid__Basic_Detail_Layout", {
-  enumerable: true,
-  get: function get() {
-    return _Grid__Basic_Detail_Layout["default"];
-  }
-});
-Object.defineProperty(exports, "Grid__Box_Alignment", {
-  enumerable: true,
-  get: function get() {
-    return _Grid__Box_Alignment["default"];
-  }
-});
-Object.defineProperty(exports, "Grid__Line_Based_Detail_Layout", {
-  enumerable: true,
-  get: function get() {
-    return _Grid__Line_Based_Detail_Layout["default"];
-  }
-});
-Object.defineProperty(exports, "Grid__Line_Based_List_Layout", {
-  enumerable: true,
-  get: function get() {
-    return _Grid__Line_Based_List_Layout["default"];
-  }
-});
-Object.defineProperty(exports, "Grid__default", {
-  enumerable: true,
-  get: function get() {
-    return _Grid__default["default"];
-  }
-});
 Object.defineProperty(exports, "GroupSelect", {
   enumerable: true,
   get: function get() {
@@ -1122,36 +1066,6 @@ Object.keys(_Layout).forEach(function (key) {
   });
 });
 
-var _Grid = require("./ucl/Grid");
-
-Object.keys(_Grid).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Grid[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Grid[key];
-    }
-  });
-});
-
-var _Grid__default = _interopRequireDefault(require("./ucl/Grid/docs/Grid__default.docs"));
-
-var _Grid__Basic_Detail_Layout = _interopRequireDefault(require("./ucl/Grid/docs/Grid__Basic_Detail_Layout.docs"));
-
-var _Grid__Auto_Flow_Row = _interopRequireDefault(require("./ucl/Grid/docs/Grid__Auto_Flow_Row.docs"));
-
-var _Grid__Area_Based_Detail_Layout = _interopRequireDefault(require("./ucl/Grid/docs/Grid__Area_Based_Detail_Layout.docs"));
-
-var _Grid__Line_Based_Detail_Layout = _interopRequireDefault(require("./ucl/Grid/docs/Grid__Line_Based_Detail_Layout.docs"));
-
-var _Grid__Area_Based_List_Layout = _interopRequireDefault(require("./ucl/Grid/docs/Grid__Area_Based_List_Layout.docs"));
-
-var _Grid__Line_Based_List_Layout = _interopRequireDefault(require("./ucl/Grid/docs/Grid__Line_Based_List_Layout.docs"));
-
-var _Grid__Box_Alignment = _interopRequireDefault(require("./ucl/Grid/docs/Grid__Box_Alignment.docs"));
-
 var _Layout__default = _interopRequireDefault(require("./Layout/docs/Layout__default.docs"));
 
 var _Layout__two_Column = _interopRequireDefault(require("./Layout/docs/Layout__two_Column.docs"));

package/lib/semantic/Button/Button.js

@@ -25,7 +25,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
 
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
@@ -35,7 +35,7 @@ function _assertThisInitialized(self) { if (self === void 0) { throw new Referen
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
 var Button = /*#__PURE__*/function (_React$Component) {
   _inherits(Button, _React$Component);

package/lib/semantic/Button/docs/Button__default.docs.js

@@ -23,7 +23,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
 
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
 
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
@@ -33,7 +33,7 @@ function _assertThisInitialized(self) { if (self === void 0) { throw new Referen
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
 var Button__default = /*#__PURE__*/function (_React$Component) {
   _inherits(Button__default, _React$Component);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.0.0-temp-73",
+  "version": "1.0.0-temp-75",
   "main": "lib/index.js",
   "module": "es/index.js",
   "jsnext:main": "es/index.js",
@@ -42,12 +42,10 @@
     "@zohodesk/virtualizer": "1.0.3",
     "velocity-react": "1.4.3",
     "react-sortable-hoc": "^0.8.3",
-    "@zohodesk/svg": "1.0.0-beta.48"
+    "@zohodesk/svg": "1.0.0-beta.48",
+    "@zohodesk/a11y": "1.0.0-alpha-2"
   },
   "dependencies": {
-    "@zohodesk/hooks": "^1.0.3-alpha.2",
-    "@zohodesk/theme": "^1.0.3-alpha.1",
-    "@zohodesk/utils": "^1.0.3-alpha.1",
     "hoist-non-react-statics": "3.0.1",
     "react-transition-group": "2.5.0",
     "reselect": "4.0.0",
@@ -76,4 +74,4 @@
       "hasRTL": true
     }
   }
-}
+}

package/es/ucl/Grid/Grid.js

@@ -1,45 +0,0 @@
-import React from 'react';
-import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
-import { withTheme } from '@zohodesk/theme';
-import style from './css/Grid.module.css';
-import defaultProps from './props/defaultProps';
-import propTypes from './props/propTypes';
-import constantProps from './props/propConstants';
-import cssJSLogic from './css/cssJSLogic';
-import componentNames from './componentNames';
-const additionStyle = ['base'];
-const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
-  let {
-    tagName,
-    customStyle,
-    customId,
-    tagAttributes,
-    tagGeneralAttributes,
-    children,
-    a11y
-  } = props;
-  /* external customization - need memorize?*/
-
-  let newStyle = useMergeStyle(style, customStyle, additionStyle);
-  /* css classname added based on logic */
-
-  const className = cssJSLogic(props, newStyle);
-  return /*#__PURE__*/React.createElement(tagName, { ...tagGeneralAttributes,
-    'data-id': customId,
-    className,
-    ref,
-    ...tagAttributes,
-    ...a11y
-  }, children);
-});
-Grid.displayName = 'Grid';
-Grid.defaultProps = defaultProps;
-Grid.propTypes = propTypes;
-Grid.constantProps = constantProps;
-export default withTheme(Grid, componentNames.GridLayout);
-Grid.docs = {
-  componentGroup: 'Grid',
-  folderName: 'Style Guide',
-  description: ' ',
-  external: false
-};

package/es/ucl/Grid/componentNames.js

@@ -1,6 +0,0 @@
-export default {
-  "GridLayout": "GridLayout",
-  "NileLayout": "NileLayout",
-  "AmazonLayout": "AmazonLayout",
-  "YangtzeLayout": "YangtzeLayout"
-};

package/es/ucl/Grid/css/Grid.module.css

@@ -1,217 +0,0 @@
-.cover {
-  height: 100%;
-  width: 100%;
-}
-
-/*Container Props */
-
-.grid {
-  display: grid;
-}
-
-.inlineGrid {
-  display: inline-grid;
-}
-
-.row {
-  grid-auto-flow: row;
-}
-
-.column {
-  grid-auto-flow: column;
-}
-
-.dense {
-  grid-auto-flow: dense;
-}
-
-.rowDense {
-  grid-auto-flow: row dense;
-}
-
-.colDense {
-  grid-auto-flow: column dense;
-}
-
-/* align-items props start */
-
-.alignItems_start {
-  align-items: start;
-}
-
-.alignItems_end {
-  align-items: end;
-}
-
-.alignItems_center {
-  align-items: center;
-}
-
-.alignItems_stretch {
-  align-items: stretch;
-}
-
-.alignItems_baseline {
-  align-items: baseline;
-}
-
-/* align-items props end */
-
-/* align-self props start */
-
-.alignSelf_start {
-  align-self: start;
-}
-
-.alignSelf_end {
-  align-self: end;
-}
-
-.alignSelf_center {
-  align-self: center;
-}
-
-.alignSelf_stretch {
-  align-self: stretch;
-}
-
-.alignSelf_baseline {
-  align-self: baseline;
-}
-
-/* align-self props End */
-
-/* align-content props start*/
-
-.alignContent_start {
-  align-content: start;
-}
-
-.alignContent_end {
-  align-content: end;
-}
-
-.alignContent_center {
-  align-content: center;
-}
-
-.alignContent_stretch {
-  align-content: stretch;
-}
-
-.alignContent_baseline {
-  align-content: baseline;
-}
-
-.alignContent_spaceBetween {
-  align-content: space-between;
-}
-
-.alignContent_spaceAround {
-  align-content: space-around;
-}
-
-.alignContent_spaceEvenly {
-  align-content: space-evenly;
-}
-
-/* align-content props end*/
-
-
-/* justify-items props start */
-
-.justifyItems_start {
-  justify-items: start;
-}
-
-.justifyItems_end {
-  justify-items: end;
-}
-
-.justifyItems_center {
-  justify-items: center;
-}
-
-.justifyItems_stretch {
-  justify-items: stretch;
-}
-
-.justifyItems_baseline {
-  justify-items: baseline;
-}
-
-/* justify-items props end */
-
-/* justify-self props start */
-
-.justifySelf_start {
-  justify-self: start;
-}
-
-.justifySelf_end {
-  justify-self: end;
-}
-
-.justifySelf_center {
-  justify-self: center;
-}
-
-.justifySelf_stretch {
-  justify-self: stretch;
-}
-
-.justifySelf_baseline {
-  justify-self: baseline;
-}
-
-/* justify-self props end */
-
-/* justify-content props start */
-
-.justifyContent_start {
-  justify-content: start;
-}
-
-.justifyContent_end {
-  justify-content: end;
-}
-
-.justifyContent_center {
-  justify-content: center;
-}
-
-.justifyContent_stretch {
-  justify-content: stretch;
-}
-
-.justifyContent_spaceBetween {
-  justify-content: space-between;
-}
-
-.justifyContent_spaceAround {
-  justify-content: space-around;
-}
-
-.justifyContent_spaceEvenly {
-  justify-content: space-evenly;
-}
-
-/* justify-content props end */
-
-.scroll_y {
-  overflow-y: auto;
-  overflow-x: hidden;
-}
-
-.scroll_x {
-  overflow-x: auto;
-  overflow-y: hidden;
-}
-
-.scroll_none {
-  overflow: hidden;
-}
-
-.scroll_both {
-  overflow: auto;
-}

package/es/ucl/Grid/css/cssJSLogic.js

@@ -1,46 +0,0 @@
-import { compileClassNames } from '@zohodesk/utils';
-import propConstants from '../props/propConstants';
-/**
- * container classname based on js state
- * @param {object} props flex props
- * @param {object} flex style object
- * @returns {string} classnames string with space separate
- */
-
-export default function (props, newStyle) {
-  const {
-    display,
-    flow,
-    alignItems,
-    alignSelf,
-    alignContent,
-    justifyItems,
-    justifySelf,
-    justifyContent,
-    overFlowScroll,
-    isCover,
-    className
-  } = props;
-  const alignItemsClassname = `alignItems_${alignItems}`;
-  const alignSelfClassname = `alignSelf_${alignSelf}`;
-  const alignContentClassname = `alignContent_${alignContent}`;
-  const justifyItemsClassname = `justifyItems_${justifyItems}`;
-  const justifySelfClassname = `justifySelf_${justifySelf}`;
-  const justifyContentClassname = `justifyContent_${justifyContent}`;
-  const overFlow = `scroll_${overFlowScroll}`;
-  return compileClassNames({
-    [newStyle.base]: true,
-    [newStyle.grid]: display === propConstants.display.grid,
-    [newStyle.inlineGrid]: display === propConstants.display.inline,
-    [newStyle[flow]]: flow && display,
-    [newStyle[alignItemsClassname]]: alignItems && display,
-    [newStyle[justifyItemsClassname]]: justifyItems && display,
-    [newStyle[alignContentClassname]]: alignContent && display,
-    [newStyle[justifyContentClassname]]: justifyContent && display,
-    [newStyle[alignSelfClassname]]: alignSelf,
-    [newStyle[justifySelfClassname]]: justifySelf,
-    [newStyle[overFlow]]: overFlowScroll,
-    [newStyle.cover]: isCover,
-    [className]: className
-  });
-}

package/es/ucl/Grid/docs/Grid__Area_Based_Detail_Layout.docs.js

@@ -1,41 +0,0 @@
-import React from 'react';
-import Grid from '../Grid';
-import propConstants from '../props/propConstants';
-import commonStyle from './css/gridDocsStyle.module.css';
-import style from './css/gridDocsAreaBasedDetailLayout.module.css';
-export default class Grid__Area_Based_Detail_Layout extends React.Component {
-  render() {
-    return /*#__PURE__*/React.createElement("div", {
-      className: commonStyle.parent
-    }, /*#__PURE__*/React.createElement(Grid, {
-      display: propConstants.display.grid,
-      isCover: true,
-      customStyle: {
-        base: style.container
-      }
-    }, /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.leftPanel
-      }
-    }, "Left Panel"), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.propertiesPanel
-      }
-    }, "Properties Panel"), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.mainContent
-      }
-    }, "Main Content"), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.rightPanel
-      }
-    }, "Right Panel")));
-  }
-
-}
-Grid__Area_Based_Detail_Layout.docs = {
-  componentGroup: 'Grid',
-  folderName: 'Style Guide',
-  description: ' ',
-  external: false
-};

package/es/ucl/Grid/docs/Grid__Area_Based_List_Layout.docs.js

@@ -1,49 +0,0 @@
-import React from 'react';
-import Grid from '../Grid';
-import propConstants from '../props/propConstants';
-import commonStyle from './css/gridDocsStyle.module.css';
-import style from './css/gridDocsAreaBasedListLayout.module.css';
-export default class Grid__Area_Based_List_Layout extends React.Component {
-  render() {
-    return /*#__PURE__*/React.createElement("div", {
-      className: commonStyle.parent
-    }, /*#__PURE__*/React.createElement(Grid, {
-      display: propConstants.display.grid,
-      isCover: true,
-      customStyle: {
-        base: style.container
-      }
-    }, /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.header
-      },
-      tagName: "header"
-    }, /*#__PURE__*/React.createElement("h2", null, "Header")), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.nav
-      },
-      tagName: "nav"
-    }, /*#__PURE__*/React.createElement("ul", null, /*#__PURE__*/React.createElement("li", null, "Home"), /*#__PURE__*/React.createElement("li", null, "Privacy Policy"))), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.main
-      }
-    }, /*#__PURE__*/React.createElement("p", null, "Main Content")), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.aside
-      },
-      tagName: "aside"
-    }, /*#__PURE__*/React.createElement("h3", null, "Sidebar")), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.footer
-      },
-      tagName: "footer"
-    }, /*#__PURE__*/React.createElement("span", null, "Footer"))));
-  }
-
-}
-Grid__Area_Based_List_Layout.docs = {
-  componentGroup: 'Grid',
-  folderName: 'Style Guide',
-  description: ' ',
-  external: false
-};

package/es/ucl/Grid/docs/Grid__Auto_Flow_Row.docs.js

@@ -1,32 +0,0 @@
-import React from 'react';
-import Grid from '../Grid';
-import propConstants from '../props/propConstants';
-import commonStyle from './css/gridDocsStyle.module.css';
-import style from './css/gridDocsAutoFlowRow.module.css';
-export default class Grid__Auto_Flow_Row extends React.Component {
-  render() {
-    let arrayList = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20];
-    return /*#__PURE__*/React.createElement("div", {
-      className: commonStyle.parent
-    }, /*#__PURE__*/React.createElement(Grid, {
-      display: propConstants.display.grid,
-      flow: propConstants.flow.row,
-      customStyle: {
-        base: style.container
-      }
-    }, arrayList.map((ele, index) => /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.item
-      },
-      shrink: false,
-      key: 'list_' + index
-    }, ele))));
-  }
-
-}
-Grid__Auto_Flow_Row.docs = {
-  componentGroup: 'Grid',
-  folderName: 'Style Guide',
-  description: ' ',
-  external: false
-};

package/es/ucl/Grid/docs/Grid__Basic_Detail_Layout.docs.js

@@ -1,41 +0,0 @@
-import React from 'react';
-import Grid from '../Grid';
-import propConstants from '../props/propConstants';
-import commonStyle from './css/gridDocsStyle.module.css';
-import style from './css/gridDocsBasicDetailLayout.module.css';
-export default class Grid__Basic_Detail_Layout extends React.Component {
-  render() {
-    return /*#__PURE__*/React.createElement("div", {
-      className: commonStyle.parent
-    }, /*#__PURE__*/React.createElement(Grid, {
-      display: propConstants.display.grid,
-      isCover: true,
-      customStyle: {
-        base: style.container
-      }
-    }, /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.leftPanel
-      }
-    }, "Left Panel"), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.propertiesPanel
-      }
-    }, "Properties Panel"), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.mainContent
-      }
-    }, "Main Content"), /*#__PURE__*/React.createElement(Grid, {
-      customStyle: {
-        base: style.rightPanel
-      }
-    }, "Right Panel")));
-  }
-
-}
-Grid__Basic_Detail_Layout.docs = {
-  componentGroup: 'Grid',
-  folderName: 'Style Guide',
-  description: ' ',
-  external: false
-};