@zohodesk/components 1.6.11 → 1.6.13

package/README.md

@@ -2,6 +2,17 @@
 
 Dot UI is a customizable React component library built to deliver a clean, accessible, and developer-friendly UI experience. It offers a growing set of reusable components designed to align with modern design systems and streamline application development across projects.
 
+# 1.6.13
+
+- **Tab**
+  - `contentAlign` prop supported to control the internal content container's alignment (justify-content). Default value is `both`.
+  - `contentAlignBox` prop supported to control the internal content container's flex direction. Default value is `row`.
+
+# 1.6.12
+
+- v1/Button/_shared/SuccessTick/SuccessTick.module.css file renamed to SuccessTick_v1.module.css 
+- v1/Button/_shared/Loader/Loader.module.css file renamed to Loader_v1.module.css 
+
 # 1.6.9, 1.6.10 , 1.6.11
 
 - padding, margin based css properties migrated to padding-inline,padding-block, margin-inline, margin-block 

package/es/Tab/Tab.js

@@ -50,6 +50,8 @@ export default function Tab(_ref) {
     needAppearance,
     align,
     isVirtual,
+    contentAlign,
+    contentAlignBox,
     customProps
   } = _ref;
   let clickListener = useCallback(event => {
@@ -91,8 +93,8 @@ export default function Tab(_ref) {
     "aria-label": text ? text : null,
     dataSelectorId: dataSelectorId
   }, customProps), /*#__PURE__*/React.createElement(Container, {
-    alignBox: "row",
-    align: "both",
+    alignBox: contentAlignBox,
+    align: contentAlign,
     className: styles.textContainer
   }, text && /*#__PURE__*/React.createElement(Box, {
     flexible: true,

package/es/Tab/props/defaultProps.js

@@ -1,5 +1,7 @@
 export const Tab_defaultProps = {
   dataId: 'tabMenu',
+  contentAlign: 'both',
+  contentAlignBox: 'row',
   customProps: {},
   dataSelectorId: 'tab'
 };

package/es/Tab/props/propTypes.js

@@ -22,6 +22,8 @@ export const Tab_propTypes = {
   titlePosition: PropTypes.oneOf(['top', 'bottom', 'right', 'left']),
   tourId: PropTypes.string,
   type: PropTypes.string,
+  contentAlign: PropTypes.oneOf(['both', 'left', 'right', 'vertical', 'horizontal', 'top', 'bottom', 'between', 'around', 'baseline']),
+  contentAlignBox: PropTypes.oneOf(['row', 'column', 'row-reverse', 'column-reverse']),
   customProps: PropTypes.object,
   isVirtual: PropTypes.bool,
   dataSelectorId: PropTypes.string

package/es/v1/Button/_shared/Loader/Loader.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import style from "./Loader.module.css";
+import style from "./Loader_v1.module.css";
 import propTypes from "./props/propTypes";
 import defaultProps from "./props/defaultProps";
 

package/es/v1/Button/_shared/SuccessTick/SuccessTick.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import style from "./SuccessTick.module.css";
+import style from "./SuccessTick_v1.module.css";
 import propTypes from "./props/propTypes";
 import defaultProps from "./props/defaultProps";
 

package/lib/Tab/Tab.js

@@ -69,6 +69,8 @@ function Tab(_ref) {
       needAppearance = _ref.needAppearance,
       align = _ref.align,
       isVirtual = _ref.isVirtual,
+      contentAlign = _ref.contentAlign,
+      contentAlignBox = _ref.contentAlignBox,
       customProps = _ref.customProps;
   var clickListener = (0, _react.useCallback)(function (event) {
     if (isLink && event && (event.metaKey || event.altKey || event.ctrlKey || event.shiftKey)) {
@@ -113,8 +115,8 @@ function Tab(_ref) {
     "aria-label": text ? text : null,
     dataSelectorId: dataSelectorId
   }, customProps), /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
-    alignBox: "row",
-    align: "both",
+    alignBox: contentAlignBox,
+    align: contentAlign,
     className: _TabModule["default"].textContainer
   }, text && /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
     flexible: true,

package/lib/Tab/props/defaultProps.js

@@ -6,6 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.Tabs_defaultProps = exports.Tab_defaultProps = exports.TabWrapper_defaultProps = exports.TabContent_defaultProps = exports.TabContentWrapper_defaultProps = void 0;
 var Tab_defaultProps = {
   dataId: 'tabMenu',
+  contentAlign: 'both',
+  contentAlignBox: 'row',
   customProps: {},
   dataSelectorId: 'tab'
 };

package/lib/Tab/props/propTypes.js

@@ -32,6 +32,8 @@ var Tab_propTypes = {
   titlePosition: _propTypes["default"].oneOf(['top', 'bottom', 'right', 'left']),
   tourId: _propTypes["default"].string,
   type: _propTypes["default"].string,
+  contentAlign: _propTypes["default"].oneOf(['both', 'left', 'right', 'vertical', 'horizontal', 'top', 'bottom', 'between', 'around', 'baseline']),
+  contentAlignBox: _propTypes["default"].oneOf(['row', 'column', 'row-reverse', 'column-reverse']),
   customProps: _propTypes["default"].object,
   isVirtual: _propTypes["default"].bool,
   dataSelectorId: _propTypes["default"].string

package/lib/v1/Button/_shared/Loader/Loader.js

@@ -7,7 +7,7 @@ exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _LoaderModule = _interopRequireDefault(require("./Loader.module.css"));
+var _Loader_v1Module = _interopRequireDefault(require("./Loader_v1.module.css"));
 
 var _propTypes = _interopRequireDefault(require("./props/propTypes"));
 
@@ -20,17 +20,17 @@ var Loader = function Loader(props) {
   var _customClass$customWr = customClass.customWrapperClass,
       customWrapperClass = _customClass$customWr === void 0 ? '' : _customClass$customWr;
   return /*#__PURE__*/_react["default"].createElement("svg", {
-    className: "".concat(_LoaderModule["default"].spinner, " ").concat(customWrapperClass),
+    className: "".concat(_Loader_v1Module["default"].spinner, " ").concat(customWrapperClass),
     viewBox: "0 0 24 24",
     role: "img",
     "aria-hidden": "true"
   }, /*#__PURE__*/_react["default"].createElement("circle", {
-    className: _LoaderModule["default"].spinnerTrack,
+    className: _Loader_v1Module["default"].spinnerTrack,
     cx: "12",
     cy: "12",
     r: "10"
   }), /*#__PURE__*/_react["default"].createElement("circle", {
-    className: _LoaderModule["default"].spinnerHead,
+    className: _Loader_v1Module["default"].spinnerHead,
     cx: "12",
     cy: "12",
     r: "10"

package/lib/v1/Button/_shared/SuccessTick/SuccessTick.js

@@ -7,7 +7,7 @@ exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _SuccessTickModule = _interopRequireDefault(require("./SuccessTick.module.css"));
+var _SuccessTick_v1Module = _interopRequireDefault(require("./SuccessTick_v1.module.css"));
 
 var _propTypes = _interopRequireDefault(require("./props/propTypes"));
 
@@ -20,7 +20,7 @@ var SuccessTick = function SuccessTick(props) {
   var _customClass$customWr = customClass.customWrapperClass,
       customWrapperClass = _customClass$customWr === void 0 ? '' : _customClass$customWr;
   return /*#__PURE__*/_react["default"].createElement("svg", {
-    className: "".concat(_SuccessTickModule["default"].tick, " ").concat(customWrapperClass),
+    className: "".concat(_SuccessTick_v1Module["default"].tick, " ").concat(customWrapperClass),
     viewBox: "0 0 24 24",
     role: "img",
     "aria-hidden": "true"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.6.11",
+  "version": "1.6.13",
   "main": "es/index.js",
   "module": "es/index.js",
   "private": false,
@@ -22,7 +22,7 @@
     "lintAllFix": "npm run lintAll --eslint:fix=true",
     "lint": "npx eslint ./src",
     "clean": "react-cli clean build unittest coverage es lib assets && mkdir assets",
-    "dubCheck": "node ./node_modules/@zohodesk-private/node-plugins/es/dublication_css_file_finder  node_modules/@zohodesk/icons/es node_modules/@zohodesk/variables/es",
+    "dubCheck": "npx z-node-plugins dub:check node_modules/@zohodesk/icons/es node_modules/@zohodesk/variables/es ../dot/src ../internal/desk-components/src",
     "init": "npm run clean && cd ../assets && npm run componentsassets && cd ../components",
     "common_package_build": "cd ../common && npm run build && cd ../components",
     "build:lib": "cbt build:lib src,assets lib,assets",
@@ -45,22 +45,22 @@
     "download": "npm run download_only && cd ../ && npm run download",
     "download_only": "react-cli clean ./node_modules ./package-lock.json && npm install  --legacy-peer-deps",
     "expublish": "node ../publish.js -- exp",
-    "css:lineheight:validate": "node ./node_modules/@zohodesk-private/node-plugins/es/lineheight_automation/lineHeightErrorCheck.js ./src/",
+    "css:lineheight:validate": "npx z-node-plugins lineheight:errorcheck ./src/",
     "variable:addignore": "node ./node_modules/@zohodesk-private/css-variable-migrator/es/variableIgnore.js ./src",
     "variable:convert": "node ./node_modules/@zohodesk-private/css-variable-migrator/es/pxParserPostcss.js ./src",
     "variable:check": "node  ./node_modules/@zohodesk-private/css-variable-migrator/es/variableErrorCheck.js ./src ./node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json",
     "css:review": " npm run dubCheck && npm run css:lineheight:validate && npm run theme:validate ",
-    "theme:validate": "node ./node_modules/@zohodesk-private/node-plugins/es/appearance_theme_validation validate ./src ./.cli ./.cli/themeValidate/stringContains.js",
-    "theme:addignore": "node ./node_modules/@zohodesk-private/node-plugins/es/appearance_theme_validation addignore ./src ./.cli ./.cli/themeValidate/stringContains.js",
-    "theme:removeignore": "node ./node_modules/@zohodesk-private/node-plugins/es/appearance_theme_validation removeignore ./src ./.cli",
+    "theme:validate": "npx z-node-plugins theme:validate ./src ./.cli ./.cli/themeValidate/stringContains.js",
+    "theme:addignore": "npx z-node-plugins theme:addignore ./src ./.cli ./.cli/themeValidate/stringContains.js",
+    "theme:removeignore": "npx z-node-plugins theme:removeignore ./src ./.cli",
     "review:props": "node ./node_modules/@zohodesk-private/react-prop-validator/es/propValidation.js propValidationArg.json ",
-    "css:layer_config_generate": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/scan_css_generate_json.js ./src ./assets css_layer_config.json",
-    "css:layer_wrap_es": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/write_layer_in_css.js ./es ./assets css_layer_config.json --rewrite=src=es --rewrite=assets=assets --skip-existing-layer",
-    "css:layer_wrap_lib": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/write_layer_in_css.js ./lib ./assets css_layer_config.json --rewrite=src=lib  --rewrite=assets=assets --skip-existing-layer",
-    "css:layer_generate_order": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/generate_layer_order.js  css_layer_config.json ./src/components_layer.module.css",
-    "css:layer_config_validate": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/validate.js  css_layer_config.json ./src/ ./assets",
+    "css:layer_config_generate": "npx z-node-plugins css:scan ./src ./assets css_layer_config.json",
+    "css:layer_wrap_es": "npx z-node-plugins css:layer_wrap ./es ./assets css_layer_config.json --rewrite=src=es --rewrite=assets=assets --skip-existing-layer",
+    "css:layer_wrap_lib": "npx z-node-plugins css:layer_wrap ./lib ./assets css_layer_config.json --rewrite=src=lib --rewrite=assets=assets --skip-existing-layer",
+    "css:layer_generate_order": "npx z-node-plugins css:layer_order css_layer_config.json ./src/components_layer.module.css",
+    "css:layer_config_validate": "npx z-node-plugins css:layer_validate css_layer_config.json ./src/ ./assets",
     "css:build": "npm run css:layer_config_validate && npm run css:layer_generate_order && npm run build",
-    "css:layer_remove": "node ./node_modules/@zohodesk-private/node-plugins/es/css_layer_generator/remove_layer.js ./es ./assets css_layer_config.json --rewrite=src=es  --rewrite=assets=assets",
+    "css:layer_remove": "npx z-node-plugins css:layer_remove ./es ./assets css_layer_config.json --rewrite=src=es --rewrite=assets=assets",
     "css:audit": "npx css-audit  --common-css=common/common.module.css --dir src  --port 8085  --report ",
     "cssVariableConvert": "react-cli variableConverter ./lib ./lib && react-cli variableConverter ./es ./es",
     "publish": "node ../publish.js",
@@ -75,13 +75,13 @@
     "@zohodesk-private/css-audit-tool": "0.0.2",
     "@zohodesk-private/color-variable-preprocessor": "1.3.1",
     "@zohodesk-private/css-variable-migrator": "1.0.9",
-    "@zohodesk-private/node-plugins": "1.1.13",
+    "@zohodesk-private/node-plugins": "1.1.14",
     "@zohodesk-private/react-prop-validator": "1.2.3",
     "@zohodesk/a11y": "2.3.9",
     "@zohodesk/docstool": "1.0.0-alpha-2",
     "@zohodesk/dotkit": "1.0.9",
     "@zohodesk/hooks": "2.0.8",
-    "@zohodesk/icons": "1.2.8",
+    "@zohodesk/icons": "1.3.1",
     "@zohodesk/layout": "3.1.0",
     "@zohodesk/svg": "1.3.5",
     "@zohodesk/utils": "1.3.16",
@@ -91,7 +91,8 @@
     "velocity-react": "1.4.3",
     "@zohodesk/react-cli": "1.1.27",
     "@zohodesk/client_build_tool": "0.0.20",
-    "color": "4.2.3"
+    "color": "4.2.3",
+    "@dot-system/css-utility": "0.1.1"
   },
   "dependencies": {
     "hoist-non-react-statics": "3.0.1",
@@ -100,7 +101,7 @@
     "selectn": "1.1.2"
   },
   "peerDependencies": {
-    "@zohodesk/icons": "1.2.8",
+    "@zohodesk/icons": "1.3.1",
     "@zohodesk/variables": "1.3.1",
     "@zohodesk/svg": "1.3.5",
     "@zohodesk/virtualizer": "1.0.13",
@@ -111,6 +112,7 @@
     "@zohodesk/a11y": "2.3.9",
     "@zohodesk/layout": "3.1.0",
     "@zohodesk/dotkit": "1.0.9",
-    "color": "4.2.3"
+    "color": "4.2.3",
+    "@dot-system/css-utility": "0.1.1"
   }
 }