@workday/canvas-kit-react 8.6.5 → 8.6.7

package/checkbox/lib/Checkbox.tsx

@@ -359,7 +359,7 @@ export const Checkbox = createComponent('input')({
             htmlFor={inputId}
             disabled={disabled}
             variant={variant}
-            paddingLeft={checkboxLabelDistance}
+            paddingInlineStart={checkboxLabelDistance}
           >
             {label}
           </LabelText>

package/common/lib/utils/changeFocus.ts

@@ -10,15 +10,27 @@ export const changeFocus = (element: unknown) => {
     return;
   }
 
-  if (element instanceof HTMLElement) {
+  if (hasCallableProperty(element, 'focus')) {
     // Dispatch an unidentified keyboard event for an input provider prior to a focus change so that
     // the ring will appear.
-    if (typeof KeyboardEvent === 'function') {
+    if (typeof KeyboardEvent === 'function' && hasCallableProperty(element, 'dispatchEvent')) {
       const event = new KeyboardEvent('keydown', {bubbles: true, key: 'Unidentified'});
-
       element.dispatchEvent(event);
     }
 
     element.focus();
   }
 };
+
+type Callable<K extends string> = {
+  [P in K]: Function;
+};
+
+function hasCallableProperty<K extends string>(input: unknown, method: K): input is Callable<K> {
+  return (
+    !!input &&
+    typeof input === 'object' &&
+    method in input! &&
+    typeof (input as any)[method] === 'function'
+  );
+}

package/dist/commonjs/checkbox/lib/Checkbox.js

@@ -251,7 +251,7 @@ exports.Checkbox = common_1.createComponent('input')({
                     React.createElement(CheckboxCheck, { checked: checked }, indeterminate ? (React.createElement(IndeterminateBox, { variant: variant })) : (React.createElement(icon_1.SystemIcon, { icon: canvas_system_icons_web_1.checkSmallIcon, color: variant === 'inverse'
                             ? theme.canvas.palette.primary.main
                             : theme.canvas.palette.primary.contrast }))))),
-            label && (React.createElement(text_1.LabelText, { htmlFor: inputId, disabled: disabled, variant: variant, paddingLeft: checkboxLabelDistance }, label))));
+            label && (React.createElement(text_1.LabelText, { htmlFor: inputId, disabled: disabled, variant: variant, paddingInlineStart: checkboxLabelDistance }, label))));
     },
     subComponents: {
         ErrorType: common_1.ErrorType,

package/dist/commonjs/common/lib/utils/changeFocus.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"changeFocus.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/changeFocus.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,WAAW,YAAa,OAAO,SAmB3C,CAAC"}
+{"version":3,"file":"changeFocus.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/changeFocus.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,WAAW,YAAa,OAAO,SAkB3C,CAAC"}

package/dist/commonjs/common/lib/utils/changeFocus.js

@@ -12,10 +12,10 @@ var changeFocus = function (element) {
     if (document.activeElement === element || !element) {
         return;
     }
-    if (element instanceof HTMLElement) {
+    if (hasCallableProperty(element, 'focus')) {
         // Dispatch an unidentified keyboard event for an input provider prior to a focus change so that
         // the ring will appear.
-        if (typeof KeyboardEvent === 'function') {
+        if (typeof KeyboardEvent === 'function' && hasCallableProperty(element, 'dispatchEvent')) {
             var event_1 = new KeyboardEvent('keydown', { bubbles: true, key: 'Unidentified' });
             element.dispatchEvent(event_1);
         }
@@ -23,3 +23,9 @@ var changeFocus = function (element) {
     }
 };
 exports.changeFocus = changeFocus;
+function hasCallableProperty(input, method) {
+    return (!!input &&
+        typeof input === 'object' &&
+        method in input &&
+        typeof input[method] === 'function');
+}

package/dist/es6/checkbox/lib/Checkbox.js

@@ -229,7 +229,7 @@ export var Checkbox = createComponent('input')({
                     React.createElement(CheckboxCheck, { checked: checked }, indeterminate ? (React.createElement(IndeterminateBox, { variant: variant })) : (React.createElement(SystemIcon, { icon: checkSmallIcon, color: variant === 'inverse'
                             ? theme.canvas.palette.primary.main
                             : theme.canvas.palette.primary.contrast }))))),
-            label && (React.createElement(LabelText, { htmlFor: inputId, disabled: disabled, variant: variant, paddingLeft: checkboxLabelDistance }, label))));
+            label && (React.createElement(LabelText, { htmlFor: inputId, disabled: disabled, variant: variant, paddingInlineStart: checkboxLabelDistance }, label))));
     },
     subComponents: {
         ErrorType: ErrorType,

package/dist/es6/common/lib/utils/changeFocus.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"changeFocus.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/changeFocus.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,WAAW,YAAa,OAAO,SAmB3C,CAAC"}
+{"version":3,"file":"changeFocus.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/changeFocus.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,WAAW,YAAa,OAAO,SAkB3C,CAAC"}

package/dist/es6/common/lib/utils/changeFocus.js

@@ -9,13 +9,19 @@ export var changeFocus = function (element) {
     if (document.activeElement === element || !element) {
         return;
     }
-    if (element instanceof HTMLElement) {
+    if (hasCallableProperty(element, 'focus')) {
         // Dispatch an unidentified keyboard event for an input provider prior to a focus change so that
         // the ring will appear.
-        if (typeof KeyboardEvent === 'function') {
+        if (typeof KeyboardEvent === 'function' && hasCallableProperty(element, 'dispatchEvent')) {
             var event_1 = new KeyboardEvent('keydown', { bubbles: true, key: 'Unidentified' });
             element.dispatchEvent(event_1);
         }
         element.focus();
     }
 };
+function hasCallableProperty(input, method) {
+    return (!!input &&
+        typeof input === 'object' &&
+        method in input &&
+        typeof input[method] === 'function');
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-react",
-  "version": "8.6.5",
+  "version": "8.6.7",
   "description": "The parent module that contains all Workday Canvas Kit React components",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -49,7 +49,7 @@
     "@emotion/styled": "^11.6.0",
     "@popperjs/core": "^2.5.4",
     "@workday/canvas-colors-web": "^2.0.0",
-    "@workday/canvas-kit-popup-stack": "^8.6.5",
+    "@workday/canvas-kit-popup-stack": "^8.6.7",
     "@workday/canvas-system-icons-web": "^3.0.0",
     "@workday/design-assets-types": "^0.2.8",
     "chroma-js": "^2.1.0",
@@ -67,5 +67,5 @@
     "@workday/canvas-accent-icons-web": "^3.0.0",
     "@workday/canvas-applet-icons-web": "^2.0.0"
   },
-  "gitHead": "ce55b939269407b74c9ba47492283dea36d3329a"
+  "gitHead": "cae5b94c10ae3ad205cf7d298e1c574b30f304a1"
 }