@workday/canvas-kit-docs 10.3.0-646-next.0 → 10.3.0-649-next.0

package/dist/es6/lib/docs.js

@@ -7434,6 +7434,118 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
       }
     }
   },
+  {
+    "name": "LoadingSparkles",
+    "fileName": "/home/runner/work/canvas-kit/canvas-kit/modules/preview-react/loading-sparkles/lib/LoadingSparkles.tsx",
+    "description": "A simple component that displays three horizontal sparkles, to be used when an AI operation is in progress.",
+    "declarations": [
+      {
+        "name": "LoadingSparkles",
+        "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/preview-react/loading-sparkles/lib/LoadingSparkles.tsx"
+      }
+    ],
+    "tags": {},
+    "type": {
+      "kind": "enhancedComponent",
+      "componentType": "regular",
+      "displayName": "LoadingSparkles",
+      "props": [
+        {
+          "kind": "property",
+          "name": "cs",
+          "required": false,
+          "type": {
+            "kind": "symbol",
+            "name": "CSToPropsInput",
+            "value": "CSToPropsInput"
+          },
+          "description": "The `cs` prop takes in a single value or an array of values. You can pass the CSS class name\nreturned by {@link createStyles}, or the result of {@link createVars} and\n{@link createModifiers}. If you're extending a component already using `cs`, you can merge that\nprop in as well. Any style that is passed to the `cs` prop will override style props. If you\nwish to have styles that are overridden by the `css` prop, or styles added via the `styled`\nAPI, use {@link handleCsProp} wherever `elemProps` is used. If your component needs to also\nhandle style props, use {@link mergeStyles} instead.\n\n\n```tsx\nimport {handleCsProp} from '@workday/canvas-kit-styling';\nimport {mergeStyles} from '@workday/canvas-kit-react/layout';\n\n// ...\n\n// `handleCsProp` handles compat mode with Emotion's runtime APIs. `mergeStyles` has the same\n// function signature, but adds support for style props.\n\nreturn (\n <Element\n   {...handleCsProp(elemProps, [\n     myStyles,\n     myModifiers({ size: 'medium' }),\n     myVars({ backgroundColor: 'red' })\n   ])}\n >\n   {children}\n </Element>\n)\n```",
+          "declarations": [
+            {
+              "name": "cs",
+              "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
+            }
+          ],
+          "tags": {}
+        },
+        {
+          "kind": "property",
+          "name": "children",
+          "description": "",
+          "tags": {},
+          "declarations": [],
+          "type": {
+            "kind": "external",
+            "name": "React.ReactNode",
+            "url": "https://reactjs.org/docs/rendering-elements.html"
+          }
+        },
+        {
+          "kind": "property",
+          "name": "as",
+          "description": "Optional override of the default element used by the component. Any valid tag or Component. If you provided a Component, this component should forward the ref using `React.forwardRef`and spread extra props to a root element.\n\n**Note:** Not all elements make sense and some elements may cause accessibility issues. Change this value with care.",
+          "tags": {},
+          "declarations": [],
+          "type": {
+            "kind": "external",
+            "name": "React.ElementType",
+            "url": "https://developer.mozilla.org/en-US/docs/Web/API/element"
+          },
+          "defaultValue": {
+            "kind": "external",
+            "name": "div",
+            "url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div"
+          }
+        },
+        {
+          "kind": "property",
+          "name": "ref",
+          "description": "Optional ref. If the component represents an element, this ref will be a reference to the real DOM element of the component. If `as` is set to an element, it will be that element. If `as` is a component, the reference will be to that component (or element if the component uses `React.forwardRef`).",
+          "tags": {},
+          "declarations": [],
+          "type": {
+            "kind": "external",
+            "name": "React.Ref",
+            "url": "https://reactjs.org/docs/refs-and-the-dom.html",
+            "typeParameters": [
+              {
+                "kind": "typeParameter",
+                "name": "R",
+                "required": true,
+                "defaultValue": {
+                  "kind": "external",
+                  "name": "div",
+                  "url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div"
+                }
+              }
+            ]
+          }
+        }
+      ],
+      "baseElement": {
+        "kind": "external",
+        "name": "div",
+        "url": "https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div"
+      }
+    }
+  },
+  {
+    "name": "sparkleIcon",
+    "fileName": "/home/runner/work/canvas-kit/canvas-kit/modules/preview-react/loading-sparkles/lib/sparkleIcon.ts",
+    "description": "",
+    "declarations": [
+      {
+        "name": "sparkleIcon",
+        "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/preview-react/loading-sparkles/lib/sparkleIcon.ts"
+      }
+    ],
+    "tags": {},
+    "type": {
+      "kind": "symbol",
+      "name": "CanvasSystemIcon",
+      "value": "CanvasSystemIcon"
+    }
+  },
   {
     "name": "DeprecatedMenuProps",
     "fileName": "/home/runner/work/canvas-kit/canvas-kit/modules/preview-react/menu/lib/Menu.tsx",
@@ -251859,9 +251971,9 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
                 "value": "SerializedStyles"
               },
               {
-                "kind": "external",
-                "name": "CSSObject",
-                "url": "https://emotion.sh/docs/object-styles"
+                "kind": "symbol",
+                "name": "CSSObjectWithVars",
+                "value": "CSSObjectWithVars<CSSObject>"
               }
             ]
           },

package/dist/mdx/preview-react/loading-sparkles/LoadingSparkles.mdx

@@ -0,0 +1,33 @@
+import {SymbolDoc} from '@workday/canvas-kit-docs';
+import {LoadingSparkles} from '@workday/canvas-kit-preview-react/loading-sparkles';
+
+import Basic from './examples/Basic';
+import RTL from './examples/RTL';
+
+
+# Canvas Kit Loading Sparkles
+
+`LoadingSparkles` is a loading animation that makes users aware an AI operation is in progress.
+
+## Installation
+
+```sh
+yarn add @workday/canvas-kit-react
+```
+
+## Usage
+
+### Basic Example
+
+`LoadingSparkles` is designed to work out-of-the-box, but you'll need to add `aria-live="polite"`
+and a descriptive `aria-label` for screen reader accesibility.
+
+<ExampleCodeBlock code={Basic} />
+
+### Right-to-Left (RTL)
+
+<ExampleCodeBlock code={RTL} />
+
+## Component API
+
+<SymbolDoc name="LoadingSparkles" fileName="/preview-react/" />

package/dist/mdx/preview-react/loading-sparkles/examples/Basic.tsx

@@ -0,0 +1,6 @@
+import React from 'react';
+import {LoadingSparkles} from '@workday/canvas-kit-preview-react/loading-sparkles';
+
+export default () => {
+  return <LoadingSparkles aria-live="polite" aria-label="Generating content" />;
+};

package/dist/mdx/preview-react/loading-sparkles/examples/RTL.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import {LoadingSparkles} from '@workday/canvas-kit-preview-react/loading-sparkles';
+import {CanvasProvider, ContentDirection} from '@workday/canvas-kit-react/common';
+
+export default () => {
+  const theme = {
+    canvas: {
+      direction: ContentDirection.RTL,
+    },
+  };
+  return (
+    <CanvasProvider theme={theme}>
+      <LoadingSparkles />
+    </CanvasProvider>
+  );
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-docs",
-  "version": "10.3.0-646-next.0",
+  "version": "10.3.0-649-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": "^10.3.0-646-next.0",
-    "@workday/canvas-kit-preview-react": "^10.3.0-646-next.0",
-    "@workday/canvas-kit-react": "^10.3.0-646-next.0",
-    "@workday/canvas-kit-styling": "^10.3.0-646-next.0",
+    "@workday/canvas-kit-labs-react": "^10.3.0-649-next.0",
+    "@workday/canvas-kit-preview-react": "^10.3.0-649-next.0",
+    "@workday/canvas-kit-react": "^10.3.0-649-next.0",
+    "@workday/canvas-kit-styling": "^10.3.0-649-next.0",
     "@workday/canvas-system-icons-web": "^3.0.0",
     "@workday/canvas-tokens-web": "^1.0.0",
     "markdown-to-jsx": "^6.10.3",
@@ -59,5 +59,5 @@
     "mkdirp": "^1.0.3",
     "typescript": "4.2"
   },
-  "gitHead": "99b5f95ef4d26c34b68bfb57d27a74bd468948e5"
+  "gitHead": "b3d01b2eebf049527f7b3254a9871c531d7e60d4"
 }