@zohodesk/components 1.0.0-temp-195.1 → 1.0.0-temp-197

package/lib/Radio/__tests__/Radio.spec.js

@@ -48,7 +48,7 @@ describe('Radio', function () {
 
     expect(asFragment()).toMatchSnapshot();
   });
-  test('rendering the Checked is true', function () {
+  test.each(palette)('rendering the Checked is true for palette - %s', function (palette) {
     var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Radio["default"], {
       palette: palette,
       active: true,
@@ -58,7 +58,7 @@ describe('Radio', function () {
 
     expect(asFragment()).toMatchSnapshot();
   });
-  test('rendering the disabled is true', function () {
+  test.each(palette)('rendering the disabled is true for palette - %s', function (palette) {
     var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Radio["default"], {
       disabled: true,
       palette: palette,
@@ -225,25 +225,21 @@ describe('Radio', function () {
 
     expect(asFragment()).toMatchSnapshot();
   });
-  test('eleRef prop is a function', function () {
-    // Create a mock function
+  test('getRef prop is a function', function () {
     var mockEleRef = jest.fn();
-
-    var _render24 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Radio["default"], {
-      eleRef: mockEleRef
-    })),
-        asFragment = _render24.asFragment;
-
-    expect(asFragment()).toMatchSnapshot();
+    (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_Radio["default"], {
+      getRef: mockEleRef
+    }));
+    expect(mockEleRef).toHaveBeenCalled();
   });
   test('renders with different onClick props', function () {
     var onClickFunction = jest.fn();
 
-    var _render25 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Radio["default"], {
+    var _render24 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Radio["default"], {
       value: "radioValue",
       onChange: onClickFunction
     }))),
-        asFragment = _render25.asFragment;
+        asFragment = _render24.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });

package/lib/Radio/__tests__/__snapshots__/Radio.spec.js.snap

@@ -1,48 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Radio eleRef prop is a function 1`] = `
-<DocumentFragment>
-  <div
-    aria-checked="false"
-    aria-readonly="false"
-    class="container  pointer hoverEfffect   inflex rowdir both"
-    data-id="RadioComp"
-    data-selector-id="container"
-    data-test-id="RadioComp"
-    role="radio"
-    tabindex="0"
-  >
-    <div
-      class="radio  
-            hoverprimary medium filled centerPathprimary  shrinkOff"
-      data-id="boxComponent"
-      data-selector-id="box"
-      data-test-id="boxComponent"
-    >
-      <input
-        type="hidden"
-        value=""
-      />
-      <label
-        class="radioLabel pointer"
-      >
-        <svg
-          viewBox="0 0 40 40"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <circle
-            class="rdBox"
-            cx="20"
-            cy="20"
-            r="19"
-          />
-        </svg>
-      </label>
-    </div>
-  </div>
-</DocumentFragment>
-`;
-
 exports[`Radio rendering ally ariaChecked true 1`] = `
 <DocumentFragment>
   <div
@@ -907,7 +864,68 @@ exports[`Radio rendering size - small 1`] = `
 </DocumentFragment>
 `;
 
-exports[`Radio rendering the Checked is true 1`] = `
+exports[`Radio rendering the Checked is true for palette - danger 1`] = `
+<DocumentFragment>
+  <div
+    aria-checked="false"
+    aria-readonly="false"
+    class="container active pointer hoverEfffect   flex rowdir both"
+    data-id="RadioComp"
+    data-selector-id="container"
+    data-test-id="RadioComp"
+    role="radio"
+    tabindex="0"
+  >
+    <div
+      class="radio  
+            hoverdanger medium filled centerPathdanger  shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    >
+      <input
+        type="hidden"
+        value=""
+      />
+      <label
+        class="radioLabel pointer"
+      >
+        <svg
+          viewBox="0 0 40 40"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <circle
+            class="rdBox"
+            cx="20"
+            cy="20"
+            r="19"
+          />
+        </svg>
+      </label>
+    </div>
+    <div
+      class="text grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    >
+      <label
+        class="label title medium default font_default
+          dotted cursor  
+              dangerLabel pointer  "
+        data-id="RadioText_label"
+        data-selector-id="label"
+        data-test-id="RadioText_label"
+        data-title="RadioText"
+      >
+        RadioText
+      </label>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Radio rendering the Checked is true for palette - primary 1`] = `
 <DocumentFragment>
   <div
     aria-checked="false"
@@ -921,7 +939,7 @@ exports[`Radio rendering the Checked is true 1`] = `
   >
     <div
       class="radio  
-            undefined medium filled undefined  shrinkOff"
+            hoverprimary medium filled centerPathprimary  shrinkOff"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
@@ -955,7 +973,7 @@ exports[`Radio rendering the Checked is true 1`] = `
       <label
         class="label title medium default font_default
           dotted cursor  
-              undefined pointer  "
+              primaryLabel pointer  "
         data-id="RadioText_label"
         data-selector-id="label"
         data-test-id="RadioText_label"
@@ -1459,7 +1477,68 @@ exports[`Radio rendering the defult props 1`] = `
 </DocumentFragment>
 `;
 
-exports[`Radio rendering the disabled is true 1`] = `
+exports[`Radio rendering the disabled is true for palette - danger 1`] = `
+<DocumentFragment>
+  <div
+    aria-checked="false"
+    aria-readonly="true"
+    class="container  disabled    flex rowdir both"
+    data-id="RadioComp"
+    data-selector-id="container"
+    data-test-id="RadioComp"
+    role="radio"
+    tabindex="-1"
+  >
+    <div
+      class="radio  
+             medium filled centerPathdanger  shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    >
+      <input
+        type="hidden"
+        value=""
+      />
+      <label
+        class="radioLabel disabled"
+      >
+        <svg
+          viewBox="0 0 40 40"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <circle
+            class="rdBox"
+            cx="20"
+            cy="20"
+            r="19"
+          />
+        </svg>
+      </label>
+    </div>
+    <div
+      class="text grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="box"
+      data-test-id="boxComponent"
+    >
+      <label
+        class="label title medium default font_default
+          dotted cursor  
+              dangerLabel disabled  "
+        data-id="RadioText_label"
+        data-selector-id="label"
+        data-test-id="RadioText_label"
+        data-title="RadioText"
+      >
+        RadioText
+      </label>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Radio rendering the disabled is true for palette - primary 1`] = `
 <DocumentFragment>
   <div
     aria-checked="false"
@@ -1473,7 +1552,7 @@ exports[`Radio rendering the disabled is true 1`] = `
   >
     <div
       class="radio  
-             medium filled undefined  shrinkOff"
+             medium filled centerPathprimary  shrinkOff"
       data-id="boxComponent"
       data-selector-id="box"
       data-test-id="boxComponent"
@@ -1507,7 +1586,7 @@ exports[`Radio rendering the disabled is true 1`] = `
       <label
         class="label title medium default font_default
           dotted cursor  
-              undefined disabled  "
+              primaryLabel disabled  "
         data-id="RadioText_label"
         data-selector-id="label"
         data-test-id="RadioText_label"

package/lib/Ribbon/Ribbon.module.css

@@ -132,27 +132,27 @@
 }
 
 .default_default {
-  --ribbon_box_shadow: var(--zd_bs_ribbon_default);
+  --ribbon_box_shadow: var(--zd_bs_contrast_outline, 0 5px 10px var(--zdt_ribbon_default_shadow));
 }
 
 .default_danger {
-  --ribbon_box_shadow: var(--zd_bs_ribbon_danger);
+  --ribbon_box_shadow: var(--zd_bs_contrast_outline, 0 5px 10px var(--zdt_ribbon_danger_shadow));
 }
 
 .default_primary {
-  --ribbon_box_shadow: var(--zd_bs_ribbon_primary);
+  --ribbon_box_shadow: var(--zd_bs_contrast_outline, 0 5px 10px var(--zdt_ribbon_primary_shadow));
 }
 
 .default_secondary {
-  --ribbon_box_shadow: var(--zd_bs_ribbon_secondary);
+  --ribbon_box_shadow: var(--zd_bs_contrast_outline, 0 5px 10px var(--zdt_ribbon_secondary_shadow));
 }
 
 .default_info {
-  --ribbon_box_shadow: var(--zd_bs_ribbon_info);
+  --ribbon_box_shadow: var(--zd_bs_contrast_outline, 0 5px 10px var(--zdt_ribbon_info_shadow));
 }
 
 .default_dark {
-  --ribbon_box_shadow: var(--zd_bs_ribbon_dark);
+  --ribbon_box_shadow: var(--zd_bs_contrast_outline, 0 5px 10px var(--zdt_ribbon_dark_shadow));
 }
 
 .box_default {