@workday/canvas-kit-preview-react 10.3.11 → 10.3.13

package/dist/commonjs/form-field/lib/FormFieldLabel.js

@@ -12,17 +12,8 @@ const hooks_1 = require("./hooks");
 const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
 const layout_1 = require("@workday/canvas-kit-react/layout");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
-const labelStyles = canvas_kit_styling_1.createStyles({
-    fontWeight: tokens_1.type.properties.fontWeights.medium,
-    minWidth: '180px',
-});
-const asteriskStyles = canvas_kit_styling_1.createStyles({
-    marginInlineStart: tokens_1.space.xxxs,
-    fontSize: tokens_1.type.properties.fontSizes[20],
-    fontWeight: tokens_1.type.properties.fontWeights.regular,
-    textDecoration: 'unset',
-    color: canvas_tokens_web_1.brand.error.base,
-});
+const labelStyles = canvas_kit_styling_1.createStyles({ name: "rzi6zs", styles: "font-weight:500px;min-width:180px;" });
+const asteriskStyles = canvas_kit_styling_1.createStyles({ name: "fmarl5", styles: "margin-inline-start:0.25rem;font-size:1.25rem;font-weight:400px;text-decoration:unset;color:var(--cnvs-brand-error-base, rgba(222,46,33,1));" });
 exports.FormFieldLabel = common_1.createSubcomponent(text_1.LabelText)({
     displayName: 'FormField.Label',
     modelHook: hooks_1.useFormFieldModel,

package/dist/commonjs/loading-sparkles/lib/LoadingSparkles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingSparkles.d.ts","sourceRoot":"","sources":["../../../../loading-sparkles/lib/LoadingSparkles.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAe,OAAO,EAA+B,MAAM,6BAA6B,CAAC;AA8EhG;;GAEG;AACH,eAAO,MAAM,eAAe,6EAW1B,CAAC"}
+{"version":3,"file":"LoadingSparkles.d.ts","sourceRoot":"","sources":["../../../../loading-sparkles/lib/LoadingSparkles.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,OAAO,EAKR,MAAM,6BAA6B,CAAC;AA8ErC;;GAEG;AACH,eAAO,MAAM,eAAe,6EAW1B,CAAC"}

package/dist/commonjs/loading-sparkles/lib/LoadingSparkles.js

@@ -21,7 +21,6 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.LoadingSparkles = void 0;
 const React = __importStar(require("react"));
-const css_1 = require("@emotion/css");
 const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
 const common_1 = require("@workday/canvas-kit-react/common");
 const icon_1 = require("@workday/canvas-kit-react/icon");
@@ -46,49 +45,15 @@ const AI_COLORS = {
 /**
  * The animation for the sparkle.
  */
-const LOADING_ANIMATION = css_1.keyframes({
-    '0%, 79%, 100%': {
-        opacity: 0.2,
-        transform: 'scale(0.55)',
-    },
-    '27%': {
-        opacity: 1,
-        transform: 'scale(1)',
-    },
-    '53%': {
-        opacity: 0.6,
-        transform: 'scale(0.7)',
-    },
-});
-const loadingSparklesIconStyles = canvas_kit_styling_1.createStyles({
-    animationDuration: `${ANIMATION_DURATION_MS}ms`,
-    animationFillMode: 'both',
-    animationIterationCount: 'infinite',
-    animationName: LOADING_ANIMATION,
-    animationTimingFunction: 'ease-in-out',
-    '.wd-sparkle-fill': {
-        fill: AI_COLORS.dragonFruit400,
-    },
-    '&:nth-child(1)': {
-        animationDelay: '0ms',
-    },
-    '&:nth-child(2)': {
-        animationDelay: `calc(${ANIMATION_DURATION_MS}ms * (1/3))`,
-    },
-    '&:nth-child(3)': {
-        animationDelay: `calc(${ANIMATION_DURATION_MS}ms * (2/3))`,
-    },
-});
+const LOADING_ANIMATION = canvas_kit_styling_1.keyframes({ name: "1lzmfb3", styles: "0%, 79%, 100%{opacity:0.2px;transform:scale(0.55);}27%{opacity:1px;transform:scale(1);}53%{opacity:0.6px;transform:scale(0.7);}" });
+const loadingSparklesIconStyles = canvas_kit_styling_1.createStyles({ name: "5995an", styles: "animation-duration:1230pxms;animation-fill-mode:both;animation-iteration-count:infinite;animation-name:animation-1lzmfb3;animation-timing-function:ease-in-out;.wd-sparkle-fill{fill:#8C17D2;}&:nth-child(1){animation-delay:0ms;}&:nth-child(2){animation-delay:calc(1230pxms * (1/3));}&:nth-child(3){animation-delay:calc(1230pxms * (2/3));}" });
 /**
  * An individual loading sparkle. ✨
  */
 const Sparkle = () => {
     return (React.createElement(icon_1.SystemIcon, { icon: sparkleIcon_1.sparkleIcon, cs: [loadingSparklesIconStyles], size: canvas_kit_styling_1.cssVar(canvas_tokens_web_1.system.space.x3) }));
 };
-const loadingSparklesStyles = canvas_kit_styling_1.createStyles({
-    display: 'inline-flex',
-    gap: canvas_kit_styling_1.px2rem(1),
-});
+const loadingSparklesStyles = canvas_kit_styling_1.createStyles({ name: "14l8nwz", styles: "display:inline-flex;gap:0.0625rem;" });
 /**
  * A simple component that displays three horizontal sparkles, to be used when an AI operation is in progress.
  */

package/dist/es6/form-field/lib/FormFieldLabel.js

@@ -6,17 +6,8 @@ import { useFormFieldLabel, useFormFieldModel } from './hooks';
 import { createStyles } from '@workday/canvas-kit-styling';
 import { mergeStyles } from '@workday/canvas-kit-react/layout';
 import { brand } from '@workday/canvas-tokens-web';
-const labelStyles = createStyles({
-    fontWeight: type.properties.fontWeights.medium,
-    minWidth: '180px',
-});
-const asteriskStyles = createStyles({
-    marginInlineStart: space.xxxs,
-    fontSize: type.properties.fontSizes[20],
-    fontWeight: type.properties.fontWeights.regular,
-    textDecoration: 'unset',
-    color: brand.error.base,
-});
+const labelStyles = createStyles({ name: "rzi6zs", styles: "font-weight:500px;min-width:180px;" });
+const asteriskStyles = createStyles({ name: "fmarl5", styles: "margin-inline-start:0.25rem;font-size:1.25rem;font-weight:400px;text-decoration:unset;color:var(--cnvs-brand-error-base, rgba(222,46,33,1));" });
 export const FormFieldLabel = createSubcomponent(LabelText)({
     displayName: 'FormField.Label',
     modelHook: useFormFieldModel,

package/dist/es6/loading-sparkles/lib/LoadingSparkles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingSparkles.d.ts","sourceRoot":"","sources":["../../../../loading-sparkles/lib/LoadingSparkles.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAe,OAAO,EAA+B,MAAM,6BAA6B,CAAC;AA8EhG;;GAEG;AACH,eAAO,MAAM,eAAe,6EAW1B,CAAC"}
+{"version":3,"file":"LoadingSparkles.d.ts","sourceRoot":"","sources":["../../../../loading-sparkles/lib/LoadingSparkles.tsx"],"names":[],"mappings":"AAIA,OAAO,EAEL,OAAO,EAKR,MAAM,6BAA6B,CAAC;AA8ErC;;GAEG;AACH,eAAO,MAAM,eAAe,6EAW1B,CAAC"}

package/dist/es6/loading-sparkles/lib/LoadingSparkles.js

@@ -1,9 +1,8 @@
 import * as React from 'react';
-import { keyframes } from '@emotion/css';
 import { system } from '@workday/canvas-tokens-web';
 import { createComponent } from '@workday/canvas-kit-react/common';
 import { SystemIcon } from '@workday/canvas-kit-react/icon';
-import { createStyles, cssVar, handleCsProp, px2rem } from '@workday/canvas-kit-styling';
+import { createStyles, cssVar, handleCsProp, px2rem, keyframes, } from '@workday/canvas-kit-styling';
 import { sparkleIcon } from './sparkleIcon';
 /**
  * Duration of the sparkle animation (in ms).
@@ -24,49 +23,15 @@ const AI_COLORS = {
 /**
  * The animation for the sparkle.
  */
-const LOADING_ANIMATION = keyframes({
-    '0%, 79%, 100%': {
-        opacity: 0.2,
-        transform: 'scale(0.55)',
-    },
-    '27%': {
-        opacity: 1,
-        transform: 'scale(1)',
-    },
-    '53%': {
-        opacity: 0.6,
-        transform: 'scale(0.7)',
-    },
-});
-const loadingSparklesIconStyles = createStyles({
-    animationDuration: `${ANIMATION_DURATION_MS}ms`,
-    animationFillMode: 'both',
-    animationIterationCount: 'infinite',
-    animationName: LOADING_ANIMATION,
-    animationTimingFunction: 'ease-in-out',
-    '.wd-sparkle-fill': {
-        fill: AI_COLORS.dragonFruit400,
-    },
-    '&:nth-child(1)': {
-        animationDelay: '0ms',
-    },
-    '&:nth-child(2)': {
-        animationDelay: `calc(${ANIMATION_DURATION_MS}ms * (1/3))`,
-    },
-    '&:nth-child(3)': {
-        animationDelay: `calc(${ANIMATION_DURATION_MS}ms * (2/3))`,
-    },
-});
+const LOADING_ANIMATION = keyframes({ name: "1lzmfb3", styles: "0%, 79%, 100%{opacity:0.2px;transform:scale(0.55);}27%{opacity:1px;transform:scale(1);}53%{opacity:0.6px;transform:scale(0.7);}" });
+const loadingSparklesIconStyles = createStyles({ name: "5995an", styles: "animation-duration:1230pxms;animation-fill-mode:both;animation-iteration-count:infinite;animation-name:animation-1lzmfb3;animation-timing-function:ease-in-out;.wd-sparkle-fill{fill:#8C17D2;}&:nth-child(1){animation-delay:0ms;}&:nth-child(2){animation-delay:calc(1230pxms * (1/3));}&:nth-child(3){animation-delay:calc(1230pxms * (2/3));}" });
 /**
  * An individual loading sparkle. ✨
  */
 const Sparkle = () => {
     return (React.createElement(SystemIcon, { icon: sparkleIcon, cs: [loadingSparklesIconStyles], size: cssVar(system.space.x3) }));
 };
-const loadingSparklesStyles = createStyles({
-    display: 'inline-flex',
-    gap: px2rem(1),
-});
+const loadingSparklesStyles = createStyles({ name: "14l8nwz", styles: "display:inline-flex;gap:0.0625rem;" });
 /**
  * A simple component that displays three horizontal sparkles, to be used when an AI operation is in progress.
  */

package/loading-sparkles/lib/LoadingSparkles.tsx

@@ -1,9 +1,15 @@
 import * as React from 'react';
-import {keyframes} from '@emotion/css';
 import {system} from '@workday/canvas-tokens-web';
 import {createComponent} from '@workday/canvas-kit-react/common';
 import {SystemIcon} from '@workday/canvas-kit-react/icon';
-import {createStyles, CSProps, cssVar, handleCsProp, px2rem} from '@workday/canvas-kit-styling';
+import {
+  createStyles,
+  CSProps,
+  cssVar,
+  handleCsProp,
+  px2rem,
+  keyframes,
+} from '@workday/canvas-kit-styling';
 
 import {sparkleIcon} from './sparkleIcon';
 
@@ -23,7 +29,7 @@ const AI_COLORS = {
   dragonFruit400: '#8C17D2',
   dragonFruit500: '#6B11A3',
   dragonFruit600: '#4A0D71',
-};
+} as const;
 
 /**
  * The animation for the sparkle.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-preview-react",
-  "version": "10.3.11",
+  "version": "10.3.13",
   "description": "Canvas Kit Preview is made up of components that have the full design and a11y review, are part of the DS ecosystem and are approved for use in product. The API's could be subject to change, but not without strong communication and migration strategies.",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -24,8 +24,8 @@
     "watch": "yarn build:es6 -w",
     "test": "echo \"Error: no test specified\" && exit 1",
     "clean": "rimraf dist && rimraf .build-info && mkdirp dist",
-    "build:cjs": "tsc -p tsconfig.cjs.json",
-    "build:es6": "tsc -p tsconfig.es6.json",
+    "build:cjs": "ttsc -p tsconfig.cjs.json",
+    "build:es6": "ttsc -p tsconfig.es6.json",
     "build:rebuild": "npm-run-all clean build",
     "build": "npm-run-all --parallel build:cjs build:es6",
     "prepack": "node ../../utils/publish.js pre preview-react",
@@ -44,11 +44,10 @@
     "react": ">=16.14"
   },
   "dependencies": {
-    "@emotion/css": "^11.7.1",
     "@emotion/react": "^11.7.1",
     "@emotion/styled": "^11.6.0",
-    "@workday/canvas-kit-react": "^10.3.11",
-    "@workday/canvas-kit-styling": "^10.3.11",
+    "@workday/canvas-kit-react": "^10.3.13",
+    "@workday/canvas-kit-styling": "^10.3.13",
     "@workday/canvas-system-icons-web": "^3.0.0",
     "@workday/canvas-tokens-web": "^1.0.0",
     "@workday/design-assets-types": "^0.2.8"
@@ -59,5 +58,5 @@
     "react-hook-form": "7.36.1",
     "yup": "^0.32.11"
   },
-  "gitHead": "b654828e983d85818aeced1a58fabfb1efd5e70b"
+  "gitHead": "a0e5d527ca03cec9db0d640ef97ac76bdb9ae89f"
 }