@zohodesk/components 1.0.0-temp-252.2 → 1.0.0-temp-252.3

package/README.md

@@ -2,12 +2,18 @@
 
 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
+# 1.6.14
 
 - **Select**
   - Added `renderCustomDropBoxHeader` prop to render a custom node at the top of the dropdown, above the suggestions list.
   - Added `customDropBoxHeader` key under the `customClass` prop to style the custom header wrapper.
 
+# 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 

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/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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.0.0-temp-252.2",
+  "version": "1.0.0-temp-252.3",
   "main": "es/index.js",
   "module": "es/index.js",
   "private": false,
@@ -33,7 +33,7 @@
     "build:watch": "npm run build:es:watch --module:mode=dev -- -w",
     "coverage": "react-cli coverage",
     "prepare": "npm run init &&  npm run css:build ",
-    "prepublishOnly": "node ../prePublish.js && npm run css:review",
+    "prepublishOnly": "node ../prePublish.js && npm run css:review && npm run review:props ",
     "postpublish": "node ../postPublish.js",
     "report": "react-cli publish:report",
     "test": "react-cli test",
@@ -46,9 +46,9 @@
     "download_only": "react-cli clean ./node_modules ./package-lock.json && npm install  --legacy-peer-deps",
     "expublish": "node ../publish.js -- exp",
     "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",
+    "variable:addignore": "npx css-variable-migrator addignore ./src",
+    "variable:convert": "npx css-variable-migrator convert ./src",
+    "variable:check": "npx css-variable-migrator check ./src",
     "css:review": " npm run dubCheck && npm run css:lineheight:validate && npm run theme:validate ",
     "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",
@@ -61,7 +61,8 @@
     "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": "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 ",
+    "css:audit:report": "npx css-audit --common-css=../node_modules/@dot-system/css-utility/es/utilities.plain.css --dir src  --port 8085  --report",
+    "css:audit:css-utility": "npx css-audit --common-css=../node_modules/@dot-system/css-utility/es/utilities.plain.css --error on --dir src",
     "cssVariableConvert": "react-cli variableConverter ./lib ./lib && react-cli variableConverter ./es ./es",
     "publish": "node ../publish.js",
     "check_package": "node ../check_dependencies.js"
@@ -72,9 +73,9 @@
     "@testing-library/react": "^11.2.5",
     "@testing-library/react-hooks": "^7.0.2",
     "@testing-library/user-event": "^13.0.10",
-    "@zohodesk-private/css-audit-tool": "0.0.2",
+    "@dot-system/css-audit-tool": "1.0.0",
     "@zohodesk-private/color-variable-preprocessor": "1.3.1",
-    "@zohodesk-private/css-variable-migrator": "1.0.9",
+    "@zohodesk-private/css-variable-migrator": "1.0.11",
     "@zohodesk-private/node-plugins": "1.1.14",
     "@zohodesk-private/react-prop-validator": "1.2.3",
     "@zohodesk/a11y": "2.3.9",