@workday/canvas-kit-react 8.0.0-alpha.216-next.4 → 8.0.0-alpha.224-next.7

package/{common/lib/utils → testing/lib}/StaticStates.tsx

@@ -4,10 +4,11 @@ import {
   CanvasProvider,
   EmotionCanvasTheme,
   PartialEmotionCanvasTheme,
+  StyleRewriteFn,
 } from '@workday/canvas-kit-react/common';
 import {CSSProperties} from '@workday/canvas-kit-react/tokens';
 
-export const convertToStaticStates = (obj?: CSSProperties): CSSProperties | undefined => {
+export const convertToStaticStates: StyleRewriteFn = obj => {
   if (!obj) {
     return obj;
   }
@@ -26,14 +27,14 @@ export const convertToStaticStates = (obj?: CSSProperties): CSSProperties | unde
       typeof obj[key] === 'object' ? convertToStaticStates(obj[key] as CSSProperties) : obj[key];
     const newObj = {...result, [newKey]: value};
     return newObj;
-  }, {});
+  }, {} as CSSProperties);
 };
 
 export const StaticStates: React.FC<React.PropsWithChildren<
   {theme?: PartialEmotionCanvasTheme} & React.HTMLAttributes<HTMLElement>
 >> = ({children, theme, ...elemProps}) => {
-  const localTheme: EmotionCanvasTheme & {_staticStates?: boolean} = useTheme(theme);
-  localTheme._staticStates = true;
+  const localTheme: EmotionCanvasTheme & {_styleRewriteFn?: StyleRewriteFn} = useTheme(theme);
+  localTheme._styleRewriteFn = convertToStaticStates;
 
   return (
     <CanvasProvider theme={localTheme} {...elemProps}>

package/testing/lib/permutateProps.ts

@@ -0,0 +1,47 @@
+import {PropCombination, PropDeclaration, Props, PropsDeclaration} from './propTypes';
+
+export const permutateProps = (
+  allProps: PropsDeclaration,
+  filter?: (props: Props) => boolean,
+  remainingProps: string[] = Object.keys(allProps),
+  values: {[key: string]: PropDeclaration} = {}
+): PropCombination[] => {
+  // When there are no more props to combine with, return result
+  const prop = remainingProps[0];
+  if (!prop) {
+    const props: Props = {};
+    Object.keys(values).forEach(prop => {
+      props[prop] = values?.[prop]?.value;
+    });
+
+    if (filter && !filter(props)) {
+      return [];
+    }
+
+    const label = Object.keys(values)
+      .map(prop => values?.[prop]?.label)
+      .join(' ');
+
+    return [
+      {
+        label,
+        props,
+      },
+    ];
+  }
+  const possiblePropValues = allProps[prop];
+
+  const permutations = possiblePropValues?.map((value: PropDeclaration) => {
+    const newValues = {...values}; // Required so we don't overwrite previous references
+    newValues[prop] = value;
+
+    return permutateProps(
+      allProps,
+      filter,
+      remainingProps!.slice(1, remainingProps!.length),
+      newValues
+    );
+  });
+
+  return (permutations as any).flat();
+};

package/testing/lib/propTypes.ts

@@ -0,0 +1,15 @@
+export type PropDeclaration = {
+  value: any;
+  label: string;
+};
+
+export type PropsDeclaration = {[key: string]: PropDeclaration[]};
+
+export type Props = {
+  [key: string]: any;
+};
+
+export type PropCombination = {
+  label: string;
+  props: Props;
+};

package/testing/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../dist/commonjs/testing",
+  "module": "../dist/es6/testing",
+  "sideEffects": false,
+  "types": "../dist/es6/testing"
+}

package/dist/commonjs/common/lib/utils/StaticStates.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import { PartialEmotionCanvasTheme } from '@workday/canvas-kit-react/common';
-import { CSSProperties } from '@workday/canvas-kit-react/tokens';
-export declare const convertToStaticStates: (obj?: CSSProperties | undefined) => CSSProperties | undefined;
-export declare const StaticStates: React.FC<React.PropsWithChildren<{
-    theme?: PartialEmotionCanvasTheme;
-} & React.HTMLAttributes<HTMLElement>>>;
-//# sourceMappingURL=StaticStates.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"StaticStates.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/StaticStates.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAIL,yBAAyB,EAC1B,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAE/D,eAAO,MAAM,qBAAqB,uCAA0B,aAAa,GAAG,SAoB3E,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CACzD;IAAC,KAAK,CAAC,EAAE,yBAAyB,CAAA;CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CACxE,CASA,CAAC"}

package/dist/es6/common/lib/utils/StaticStates.d.ts

@@ -1,8 +0,0 @@
-import * as React from 'react';
-import { PartialEmotionCanvasTheme } from '@workday/canvas-kit-react/common';
-import { CSSProperties } from '@workday/canvas-kit-react/tokens';
-export declare const convertToStaticStates: (obj?: CSSProperties | undefined) => CSSProperties | undefined;
-export declare const StaticStates: React.FC<React.PropsWithChildren<{
-    theme?: PartialEmotionCanvasTheme;
-} & React.HTMLAttributes<HTMLElement>>>;
-//# sourceMappingURL=StaticStates.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"StaticStates.d.ts","sourceRoot":"","sources":["../../../../../common/lib/utils/StaticStates.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAIL,yBAAyB,EAC1B,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAE/D,eAAO,MAAM,qBAAqB,uCAA0B,aAAa,GAAG,SAoB3E,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CACzD;IAAC,KAAK,CAAC,EAAE,yBAAyB,CAAA;CAAC,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CACxE,CASA,CAAC"}