npm - @workday/canvas-kit-docs - Versions diffs - 12.0.9 → 12.1.0-943-next.0 - Mend

@workday/canvas-kit-docs 12.0.9 → 12.1.0-943-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/es6/lib/docs.js CHANGED Viewed

@@ -172198,6 +172198,585 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
       }
     }
   },
+  {
+    "name": "LoadingDotsProps",
+    "fileName": "/home/runner/work/canvas-kit/canvas-kit/modules/react/loading-dots/lib/LoadingDots.tsx",
+    "description": "",
+    "declarations": [
+      {
+        "name": "LoadingDotsProps",
+        "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/loading-dots/lib/LoadingDots.tsx"
+      }
+    ],
+    "tags": {},
+    "type": {
+      "kind": "alias",
+      "name": "LoadingDots"
+    }
+  },
+  {
+    "name": "loadingDotsStencil",
+    "fileName": "/home/runner/work/canvas-kit/canvas-kit/modules/react/loading-dots/lib/LoadingDots.tsx",
+    "description": "",
+    "declarations": [
+      {
+        "name": "loadingDotsStencil",
+        "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/loading-dots/lib/LoadingDots.tsx"
+      }
+    ],
+    "tags": {},
+    "type": {
+      "kind": "function",
+      "parameters": [
+        {
+          "kind": "parameter",
+          "name": "options",
+          "type": {
+            "kind": "conditional",
+            "check": {
+              "kind": "tuple",
+              "value": [
+                {
+                  "kind": "symbol",
+                  "name": "E",
+                  "value": "E"
+                }
+              ]
+            },
+            "extends": {
+              "kind": "tuple",
+              "value": [
+                {
+                  "kind": "primitive",
+                  "value": "never"
+                }
+              ]
+            },
+            "trueType": {
+              "kind": "intersection",
+              "value": [
+                {
+                  "kind": "symbol",
+                  "name": "ModifierValuesStencil",
+                  "typeParameters": [
+                    {
+                      "kind": "symbol",
+                      "name": "M",
+                      "value": "M"
+                    },
+                    {
+                      "kind": "symbol",
+                      "name": "V",
+                      "value": "V"
+                    }
+                  ],
+                  "value": "ModifierValuesStencil<M, V>"
+                },
+                {
+                  "kind": "symbol",
+                  "name": "VariableValuesStencil",
+                  "typeParameters": [
+                    {
+                      "kind": "symbol",
+                      "name": "V",
+                      "value": "V"
+                    }
+                  ],
+                  "value": "VariableValuesStencil<V>"
+                }
+              ]
+            },
+            "falseType": {
+              "kind": "conditional",
+              "check": {
+                "kind": "symbol",
+                "name": "E",
+                "value": "E"
+              },
+              "extends": {
+                "kind": "symbol",
+                "name": "BaseStencil",
+                "typeParameters": [
+                  {
+                    "kind": "infer",
+                    "value": {
+                      "kind": "typeParameter",
+                      "name": "ME",
+                      "required": true
+                    }
+                  },
+                  {
+                    "kind": "infer",
+                    "value": {
+                      "kind": "typeParameter",
+                      "name": "VE",
+                      "required": true
+                    }
+                  },
+                  {
+                    "kind": "primitive",
+                    "value": "any"
+                  },
+                  {
+                    "kind": "primitive",
+                    "value": "any"
+                  }
+                ],
+                "value": "BaseStencil<M, V, E, ID>"
+              },
+              "trueType": {
+                "kind": "intersection",
+                "value": [
+                  {
+                    "kind": "symbol",
+                    "name": "ModifierValuesStencil",
+                    "typeParameters": [
+                      {
+                        "kind": "intersection",
+                        "value": [
+                          {
+                            "kind": "symbol",
+                            "name": "ME",
+                            "value": "ME"
+                          },
+                          {
+                            "kind": "symbol",
+                            "name": "M",
+                            "value": "M"
+                          }
+                        ]
+                      }
+                    ],
+                    "value": "ModifierValuesStencil<M, V>"
+                  },
+                  {
+                    "kind": "symbol",
+                    "name": "VariableValuesStencil",
+                    "typeParameters": [
+                      {
+                        "kind": "intersection",
+                        "value": [
+                          {
+                            "kind": "symbol",
+                            "name": "VE",
+                            "value": "VE"
+                          },
+                          {
+                            "kind": "symbol",
+                            "name": "V",
+                            "value": "V"
+                          }
+                        ]
+                      }
+                    ],
+                    "value": "VariableValuesStencil<V>"
+                  }
+                ]
+              },
+              "falseType": {
+                "kind": "primitive",
+                "value": "never"
+              }
+            }
+          },
+          "required": false,
+          "rest": false,
+          "description": "",
+          "declarations": [
+            {
+              "name": "options",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        }
+      ],
+      "members": [
+        {
+          "kind": "property",
+          "name": "vars",
+          "required": true,
+          "type": {
+            "kind": "symbol",
+            "name": "StencilDefaultVars",
+            "typeParameters": [
+              {
+                "kind": "symbol",
+                "name": "V",
+                "value": "V"
+              },
+              {
+                "kind": "symbol",
+                "name": "E",
+                "value": "E"
+              },
+              {
+                "kind": "symbol",
+                "name": "ID",
+                "value": "ID"
+              }
+            ],
+            "value": "StencilDefaultVars<V, E, ID>"
+          },
+          "description": "",
+          "declarations": [
+            {
+              "name": "vars",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        },
+        {
+          "kind": "property",
+          "name": "base",
+          "required": true,
+          "type": {
+            "kind": "primitive",
+            "value": "string"
+          },
+          "description": "",
+          "declarations": [
+            {
+              "name": "base",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        },
+        {
+          "kind": "property",
+          "name": "modifiers",
+          "required": true,
+          "type": {
+            "kind": "conditional",
+            "check": {
+              "kind": "tuple",
+              "value": [
+                {
+                  "kind": "symbol",
+                  "name": "E",
+                  "value": "E"
+                }
+              ]
+            },
+            "extends": {
+              "kind": "tuple",
+              "value": [
+                {
+                  "kind": "symbol",
+                  "name": "BaseStencil",
+                  "typeParameters": [
+                    {
+                      "kind": "infer",
+                      "value": {
+                        "kind": "typeParameter",
+                        "name": "ME",
+                        "required": true
+                      }
+                    },
+                    {
+                      "kind": "infer",
+                      "value": {
+                        "kind": "typeParameter",
+                        "name": "VE",
+                        "required": true
+                      }
+                    },
+                    {
+                      "kind": "primitive",
+                      "value": "any"
+                    },
+                    {
+                      "kind": "primitive",
+                      "value": "any"
+                    }
+                  ],
+                  "value": "BaseStencil<M, V, E, ID>"
+                }
+              ]
+            },
+            "trueType": {
+              "kind": "symbol",
+              "name": "StencilModifierReturn",
+              "typeParameters": [
+                {
+                  "kind": "intersection",
+                  "value": [
+                    {
+                      "kind": "symbol",
+                      "name": "ME",
+                      "value": "ME"
+                    },
+                    {
+                      "kind": "symbol",
+                      "name": "M",
+                      "value": "M"
+                    }
+                  ]
+                },
+                {
+                  "kind": "intersection",
+                  "value": [
+                    {
+                      "kind": "symbol",
+                      "name": "VE",
+                      "value": "VE"
+                    },
+                    {
+                      "kind": "symbol",
+                      "name": "V",
+                      "value": "V"
+                    }
+                  ]
+                }
+              ],
+              "value": "StencilModifierReturn<M, V>"
+            },
+            "falseType": {
+              "kind": "symbol",
+              "name": "StencilModifierReturn",
+              "typeParameters": [
+                {
+                  "kind": "symbol",
+                  "name": "M",
+                  "value": "M"
+                },
+                {
+                  "kind": "symbol",
+                  "name": "V",
+                  "value": "V"
+                }
+              ],
+              "value": "StencilModifierReturn<M, V>"
+            }
+          },
+          "description": "",
+          "declarations": [
+            {
+              "name": "modifiers",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        },
+        {
+          "kind": "property",
+          "name": "defaultModifiers",
+          "required": true,
+          "type": {
+            "kind": "conditional",
+            "check": {
+              "kind": "tuple",
+              "value": [
+                {
+                  "kind": "symbol",
+                  "name": "E",
+                  "value": "E"
+                }
+              ]
+            },
+            "extends": {
+              "kind": "tuple",
+              "value": [
+                {
+                  "kind": "symbol",
+                  "name": "BaseStencil",
+                  "typeParameters": [
+                    {
+                      "kind": "infer",
+                      "value": {
+                        "kind": "typeParameter",
+                        "name": "ME",
+                        "required": true
+                      }
+                    },
+                    {
+                      "kind": "primitive",
+                      "value": "any"
+                    },
+                    {
+                      "kind": "primitive",
+                      "value": "any"
+                    },
+                    {
+                      "kind": "primitive",
+                      "value": "any"
+                    }
+                  ],
+                  "value": "BaseStencil<M, V, E, ID>"
+                }
+              ]
+            },
+            "trueType": {
+              "kind": "symbol",
+              "name": "StencilDefaultModifierReturn",
+              "typeParameters": [
+                {
+                  "kind": "intersection",
+                  "value": [
+                    {
+                      "kind": "symbol",
+                      "name": "ME",
+                      "value": "ME"
+                    },
+                    {
+                      "kind": "symbol",
+                      "name": "M",
+                      "value": "M"
+                    }
+                  ]
+                }
+              ],
+              "value": "StencilDefaultModifierReturn<M>"
+            },
+            "falseType": {
+              "kind": "symbol",
+              "name": "StencilDefaultModifierReturn",
+              "typeParameters": [
+                {
+                  "kind": "symbol",
+                  "name": "M",
+                  "value": "M"
+                }
+              ],
+              "value": "StencilDefaultModifierReturn<M>"
+            }
+          },
+          "description": "",
+          "declarations": [
+            {
+              "name": "defaultModifiers",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        },
+        {
+          "kind": "property",
+          "name": "__extends",
+          "required": false,
+          "type": {
+            "kind": "symbol",
+            "name": "E",
+            "value": "E"
+          },
+          "description": "",
+          "declarations": [
+            {
+              "name": "__extends",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        },
+        {
+          "kind": "property",
+          "name": "__vars",
+          "required": true,
+          "type": {
+            "kind": "symbol",
+            "name": "V",
+            "value": "V"
+          },
+          "description": "",
+          "declarations": [
+            {
+              "name": "__vars",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        },
+        {
+          "kind": "property",
+          "name": "__modifiers",
+          "required": true,
+          "type": {
+            "kind": "symbol",
+            "name": "M",
+            "value": "M"
+          },
+          "description": "",
+          "declarations": [
+            {
+              "name": "__modifiers",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        },
+        {
+          "kind": "property",
+          "name": "__id",
+          "required": true,
+          "type": {
+            "kind": "symbol",
+            "name": "ID",
+            "value": "ID"
+          },
+          "description": "",
+          "declarations": [
+            {
+              "name": "__id",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        }
+      ],
+      "returnType": {
+        "kind": "object",
+        "properties": [
+          {
+            "kind": "property",
+            "name": "className",
+            "required": true,
+            "type": {
+              "kind": "primitive",
+              "value": "string"
+            },
+            "description": "",
+            "declarations": [
+              {
+                "name": "className",
+                "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+              }
+            ],
+            "tags": {}
+          },
+          {
+            "kind": "property",
+            "name": "style",
+            "required": false,
+            "type": {
+              "kind": "external",
+              "name": "Record",
+              "url": "https://www.typescriptlang.org/docs/handbook/utility-types.html#recordkeys-type",
+              "typeParameters": [
+                {
+                  "kind": "primitive",
+                  "value": "string"
+                },
+                {
+                  "kind": "primitive",
+                  "value": "string"
+                }
+              ]
+            },
+            "description": "",
+            "declarations": [
+              {
+                "name": "style",
+                "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+              }
+            ],
+            "tags": {}
+          }
+        ]
+      }
+    }
+  },
   {
     "name": "LoadingDots",
     "fileName": "/home/runner/work/canvas-kit/canvas-kit/modules/react/loading-dots/lib/LoadingDots.tsx",
@@ -172214,6 +172793,54 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
       "componentType": "regular",
       "displayName": "LoadingDots",
       "props": [
+        {
+          "kind": "property",
+          "name": "loadingDotColor",
+          "required": false,
+          "type": {
+            "kind": "primitive",
+            "value": "string"
+          },
+          "description": "Applies backgroundColor to loading dots, intended for use with the circle variant design on grey/dark/image-based backgrounds.",
+          "declarations": [
+            {
+              "name": "loadingDotColor",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/loading-dots/lib/LoadingDots.tsx"
+            }
+          ],
+          "tags": {
+            "default": "`system.color.bg.alt.strong`"
+          },
+          "defaultValue": {
+            "kind": "symbol",
+            "name": "`system.color.bg.alt.strong`",
+            "value": "`system.color.bg.alt.strong`"
+          }
+        },
+        {
+          "kind": "property",
+          "name": "animationDurationMs",
+          "required": false,
+          "type": {
+            "kind": "primitive",
+            "value": "string"
+          },
+          "description": "Duration of the loading animation in milliseconds.",
+          "declarations": [
+            {
+              "name": "animationDurationMs",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/loading-dots/lib/LoadingDots.tsx"
+            }
+          ],
+          "tags": {
+            "default": "`40ms`"
+          },
+          "defaultValue": {
+            "kind": "symbol",
+            "name": "`40ms`",
+            "value": "`40ms`"
+          }
+        },
         {
           "kind": "property",
           "name": "cs",

package/dist/mdx/react/loading-dots/LoadingDots.mdx CHANGED Viewed

@@ -1,14 +1,16 @@
-import {ExampleCodeBlock} from '@workday/canvas-kit-docs';
+import {ExampleCodeBlock, SymbolDoc} from '@workday/canvas-kit-docs';
 import Basic from './examples/Basic';
 import RTL from './examples/RTL';
 import Accessible from './examples/Accessible';
+import CustomShape from './examples/CustomShape';
+import CustomColorAndAnimation from './examples/CustomColorAndAnimation';
 # Canvas Kit Loading Dots
 Loading Dots make users aware that content is currently being loaded, processing, or that change
 will occur on the page.
-[> Workday Design Reference](https://design.workday.com/components/indicators/loading-dots)
+[> Workday Design Reference](https://canvas.workdaydesign.com/components/indicators/loading-dots/)
 ## Installation
@@ -26,10 +28,20 @@ yarn add @workday/canvas-kit-react
 <ExampleCodeBlock code={RTL} />
+### Custom Shape
+<ExampleCodeBlock code={CustomShape} />
+### Custom Color and Animation
+<ExampleCodeBlock code={CustomColorAndAnimation} />
 ### Custom Styles
 Loading Dots supports custom styling via the `cs` prop. For more information, check our
-["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--page).
+["How To Customize Styles"](https://workday.github.io/canvas-kit/?path=/docs/styling-how-to-customize-styles--docs).
+Custom styling is also supported through the [Loading Dots documented props below](#props).
 ### Adding screen reader support to loading animations
@@ -47,7 +59,6 @@ components included in Canvas to describe both the appearance and disappearance
 <ExampleCodeBlock code={Accessible} />
-## Props
+## Component API
-Loading Dots does not have any documented props. Undocumented props are spread to its outermost
-element.
+<SymbolDoc name="LoadingDots" fileName="/react/" />

package/dist/mdx/react/loading-dots/examples/Accessible.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 import React from 'react';
 import {LoadingDots} from '@workday/canvas-kit-react/loading-dots';
-import {base, system} from '@workday/canvas-tokens-web';
+import {system} from '@workday/canvas-tokens-web';
 import {Flex} from '@workday/canvas-kit-react/layout';
 import {SecondaryButton} from '@workday/canvas-kit-react/button';
 import {createStyles} from '@workday/canvas-kit-styling';

package/dist/mdx/react/loading-dots/examples/CustomColorAndAnimation.tsx ADDED Viewed

@@ -0,0 +1,19 @@
+import React from 'react';
+import {LoadingDots} from '@workday/canvas-kit-react/loading-dots';
+import {system} from '@workday/canvas-tokens-web';
+import {createStyles} from '@workday/canvas-kit-styling';
+const styleOverrides = {
+  parentContainer: createStyles({
+    display: 'flex',
+    gap: system.space.x4,
+  }),
+};
+export default () => {
+  return (
+    <div className={styleOverrides.parentContainer}>
+      <LoadingDots loadingDotColor={system.color.fg.primary.default} animationDurationMs="60ms" />
+    </div>
+  );
+};

package/dist/mdx/react/loading-dots/examples/CustomShape.tsx ADDED Viewed

@@ -0,0 +1,32 @@
+import React from 'react';
+import {LoadingDots, loadingDotsStencil} from '@workday/canvas-kit-react/loading-dots';
+import {system} from '@workday/canvas-tokens-web';
+import {createStyles, createStencil} from '@workday/canvas-kit-styling';
+const styleOverrides = {
+  parentContainer: createStyles({
+    display: 'flex',
+    gap: system.space.x4,
+  }),
+};
+const loadingStencil = createStencil({
+  base: {
+    borderRadius: system.shape.round,
+    backgroundColor: system.color.bg.overlay,
+    height: 80,
+    width: 80,
+    alignItems: 'center',
+    justifyContent: 'center',
+    display: 'flex',
+    [loadingDotsStencil.vars.loadingDotColor]: system.color.icon.inverse,
+  },
+});
+export default () => {
+  return (
+    <div className={styleOverrides.parentContainer}>
+      <LoadingDots cs={loadingStencil()} />
+    </div>
+  );
+};

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-docs",
-  "version": "12.0.9",
+  "version": "12.1.0-943-next.0",
   "description": "Documentation components of Canvas Kit components",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -44,10 +44,10 @@
   "dependencies": {
     "@emotion/styled": "^11.6.0",
     "@storybook/csf": "0.0.1",
-    "@workday/canvas-kit-labs-react": "^12.0.9",
-    "@workday/canvas-kit-preview-react": "^12.0.9",
-    "@workday/canvas-kit-react": "^12.0.9",
-    "@workday/canvas-kit-styling": "^12.0.9",
+    "@workday/canvas-kit-labs-react": "^12.1.0-943-next.0",
+    "@workday/canvas-kit-preview-react": "^12.1.0-943-next.0",
+    "@workday/canvas-kit-react": "^12.1.0-943-next.0",
+    "@workday/canvas-kit-styling": "^12.1.0-943-next.0",
     "@workday/canvas-system-icons-web": "^3.0.0",
     "@workday/canvas-tokens-web": "^2.0.1",
     "markdown-to-jsx": "^7.2.0",
@@ -60,5 +60,5 @@
     "mkdirp": "^1.0.3",
     "typescript": "5.0"
   },
-  "gitHead": "67994adcbd4aa2c420f5901cb9b71b2fdbc31bd7"
+  "gitHead": "6259a19bb3bb9912528c6f949bcad0c4bb7f2e30"
 }