@zohodesk/components 1.0.0-temp-250 → 1.0.0-temp-253

package/lib/v1/Button/index.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Button", {
+  enumerable: true,
+  get: function get() {
+    return _Button["default"];
+  }
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _Button["default"];
+  }
+});
+
+var _Button = _interopRequireDefault(require("./Button"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

package/lib/v1/Button/props/defaultProps.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _constants = require("@zohodesk/dotkit/es/utils/constants");
+
+var _constants2 = require("../constants");
+
+var defaultProps = {
+  palette: _constants2.DEFAULT_PALETTE,
+  bgAppearance: _constants2.DEFAULT_BG_APPEARANCE,
+  borderAppearance: _constants2.DEFAULT_BORDER_APPEARANCE,
+  variant: _constants2.DEFAULT_VARIANT,
+  size: _constants2.DEFAULT_SIZE,
+  status: _constants2.DEFAULT_STATUS,
+  loaderPlacement: _constants2.DEFAULT_LOADER_PLACEMENT,
+  iconPlacement: _constants2.DEFAULT_ICON_PLACEMENT,
+  iconSize: _constants2.DEFAULT_ICON_SIZE,
+  paletteShade: _constants2.DEFAULT_PALETTE_SHADE,
+  disabledAppearance: _constants2.DEFAULT_DISABLED_APPEARANCE,
+  isDisabled: false,
+  isReadOnly: false,
+  isSelected: false,
+  shape: _constants2.DEFAULT_SHAPE,
+  type: _constants2.DEFAULT_BUTTON_TYPE,
+  onClick: _constants.DUMMY_FUNCTION,
+  customClass: _constants.DUMMY_OBJECT,
+  customProps: _constants.DUMMY_OBJECT,
+  customAttributes: _constants.DUMMY_OBJECT,
+  a11yAttributes: _constants.DUMMY_OBJECT
+};
+var _default = defaultProps;
+exports["default"] = _default;

package/lib/v1/Button/props/propTypes.js

@@ -0,0 +1,56 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _constants = require("../constants");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var renderSlotType = _propTypes["default"].oneOfType([_propTypes["default"].node, _propTypes["default"].func]);
+
+var propTypes = {
+  palette: _propTypes["default"].oneOf(Object.values(_constants.PALETTE)),
+  bgAppearance: _propTypes["default"].oneOf(Object.values(_constants.BG_APPEARANCE)),
+  borderAppearance: _propTypes["default"].oneOf(Object.values(_constants.BORDER_APPEARANCE)),
+  variant: _propTypes["default"].oneOf(Object.values(_constants.VARIANT)),
+  size: _propTypes["default"].oneOf(Object.values(_constants.SIZE)),
+  status: _propTypes["default"].oneOf(Object.values(_constants.STATUS)),
+  loaderPlacement: _propTypes["default"].oneOf(Object.values(_constants.LOADER_PLACEMENT)),
+  iconName: _propTypes["default"].string,
+  iconSize: _propTypes["default"].number,
+  iconPlacement: _propTypes["default"].oneOf(Object.values(_constants.ICON_PLACEMENT)),
+  paletteShade: _propTypes["default"].oneOf(Object.values(_constants.PALETTE_SHADE)),
+  disabledAppearance: _propTypes["default"].oneOf(Object.values(_constants.DISABLED_APPEARANCE)),
+  renderIcon: renderSlotType,
+  renderBefore: renderSlotType,
+  renderAfter: renderSlotType,
+  renderLoader: renderSlotType,
+  renderSuccess: renderSlotType,
+  children: _propTypes["default"].node,
+  type: _propTypes["default"].oneOf(Object.values(_constants.BUTTON_TYPE)),
+  onClick: _propTypes["default"].func,
+  isDisabled: _propTypes["default"].bool,
+  isReadOnly: _propTypes["default"].bool,
+  isSelected: _propTypes["default"].bool,
+  shape: _propTypes["default"].oneOf(Object.values(_constants.SHAPE)),
+  title: _propTypes["default"].string,
+  customClass: _propTypes["default"].shape({
+    wrapper: _propTypes["default"].string,
+    text: _propTypes["default"].string
+  }),
+  customProps: _propTypes["default"].shape({
+    text: _propTypes["default"].object,
+    icon: _propTypes["default"].object
+  }),
+  customAttributes: _propTypes["default"].object,
+  a11yAttributes: _propTypes["default"].object,
+  customId: _propTypes["default"].string,
+  testId: _propTypes["default"].string
+};
+var _default = propTypes;
+exports["default"] = _default;

package/lib/v1/Switch/css/Switch_v1.module.css

@@ -4,47 +4,47 @@
     gap: var(--zd_size6) ;
 }
 .small {
-    --local-switch-track-width: 22px;
-    --local-switch-track-height: 12px;
+    --local-switch-track-width: var(--zd_size22);
+    --local-switch-track-height: var(--zd_size12);
     --local-switch-track-border-radius: 8px;
-    --local-switch-thumb-size: 10px;
-    --local-switch-onLabel-height: 6px;
-    --local-switch-onLabel-left: 5px;
-    --local-switch-offLabel-size: 7px;
-    --local-switch-offLabel-right: 2px;
+    --local-switch-thumb-size: var(--zd_size10);
+    --local-switch-onLabel-height: var(--zd_size6);
+    --local-switch-onLabel-left: var(--zd_size5);
+    --local-switch-offLabel-size: var(--zd_size7);
+    --local-switch-offLabel-right: var(--zd_size2);
     --local-switch-onLabel-scaleX: 1.2;
 }
 .medium {
-    --local-switch-track-width: 28px;
-    --local-switch-track-height: 16px;
+    --local-switch-track-width: var(--zd_size28);
+    --local-switch-track-height: var(--zd_size16);
     --local-switch-track-border-radius: 16px;
-    --local-switch-thumb-size: 14px;
-    --local-switch-onLabel-height: 8px;
-    --local-switch-onLabel-left: 6px;
-    --local-switch-offLabel-size: 8px;
-    --local-switch-offLabel-right: 3px;
+    --local-switch-thumb-size: var(--zd_size14);
+    --local-switch-onLabel-height: var(--zd_size8);
+    --local-switch-onLabel-left: var(--zd_size6);
+    --local-switch-offLabel-size: var(--zd_size8);
+    --local-switch-offLabel-right: var(--zd_size3);
     --local-switch-onLabel-scaleX: 1.4;
 }
 .large {
-    --local-switch-track-width: 34px;
-    --local-switch-track-height: 20px;
+    --local-switch-track-width: var(--zd_size34);
+    --local-switch-track-height: var(--zd_size20);
     --local-switch-track-border-radius: 10px;
-    --local-switch-thumb-size: 18px;
-    --local-switch-onLabel-height: 10px;
-    --local-switch-onLabel-left: 7px;
-    --local-switch-offLabel-size: 9px;
-    --local-switch-offLabel-right: 4px;
+    --local-switch-thumb-size: var(--zd_size18);
+    --local-switch-onLabel-height: var(--zd_size10);
+    --local-switch-onLabel-left: var(--zd_size7);
+    --local-switch-offLabel-size: var(--zd_size9);
+    --local-switch-offLabel-right: var(--zd_size4);
     --local-switch-onLabel-scaleX: 1.6;
 }
 .xlarge {
-    --local-switch-track-width: 40px;
-    --local-switch-track-height: 24px;
+    --local-switch-track-width: var(--zd_size40);
+    --local-switch-track-height: var(--zd_size24);
     --local-switch-track-border-radius: 12px;
-    --local-switch-thumb-size: 22px;
-    --local-switch-onLabel-height: 12px;
-    --local-switch-onLabel-left: 8px;
-    --local-switch-offLabel-size: 10px;
-    --local-switch-offLabel-right: 5px;
+    --local-switch-thumb-size: var(--zd_size22);
+    --local-switch-onLabel-height: var(--zd_size12);
+    --local-switch-onLabel-left: var(--zd_size8);
+    --local-switch-offLabel-size: var(--zd_size10);
+    --local-switch-offLabel-right: var(--zd_size5);
     --local-switch-onLabel-scaleX: 1.8;
 }
 .disabled, .readonly {