@workday/canvas-kit-css 12.4.0-1015-next.0 → 13.0.0-alpha.1009-next.0

package/badge.css

@@ -1,4 +1,4 @@
-@keyframes animation-lqrz3f {
+@keyframes animation-p07h3g {
   from {
     transform: scale(0.85);
   }
@@ -12,7 +12,7 @@
 .cnvs-count-badge {
   box-sizing: border-box;
   align-items: center;
-  animation: animation-lqrz3f 0.2s ease;
+  animation: animation-p07h3g 0.2s ease;
   background: var(--cnvs-sys-color-static-red-default);
   border-radius: var(--cnvs-sys-shape-round);
   color: var(--cnvs-sys-color-text-inverse);

package/button.css

@@ -434,6 +434,27 @@
 }
 
 
+.cnvs-external-hyperlink {
+  box-sizing: border-box;
+  display: inline-flex;
+  flex-direction: row;
+  align-items: center;
+}
+
+.cnvs-external-hyperlink [data-part="external-hyperlink-icon"] {
+  --cnvs-system-icon-color: currentColor;
+  --cnvs-svg-size: 1em;
+  width: calc(1em - 0.0625rem);
+  min-width: calc(var(--cnvs-sys-space-x4) - 0.0625rem);
+  margin-inline-start: calc(var(--cnvs-sys-space-x1) - 0.125rem);
+}
+
+.cnvs-external-hyperlink [data-part="external-hyperlink-icon"]>svg {
+  min-width: var(--cnvs-sys-space-x4);
+  min-height: var(--cnvs-sys-space-x4);
+}
+
+
 .cnvs-primary-button {
   box-sizing: border-box;
   --cnvs-button-background: var(--cnvs-brand-action-base, var(--cnvs-brand-primary-base));

package/loading-dots.css

@@ -1,4 +1,4 @@
-@keyframes animation-lqrz50 {
+@keyframes animation-p07h51 {
   0%, 80%, 100% {
     transform: scale(0);
   }
@@ -25,7 +25,7 @@
   border-radius: var(--cnvs-sys-shape-round);
   transform: scale(0);
   display: inline-block;
-  animation-name: animation-lqrz50;
+  animation-name: animation-p07h51;
   animation-duration: calc(var(--cnvs-loading-dots-animation-duration-ms) * 35);
   animation-iteration-count: infinite;
   animation-timing-function: ease-in-out;

package/modal.css

@@ -1,4 +1,4 @@
-@keyframes animation-lqrz52 {
+@keyframes animation-p07h53 {
   0% {
     background: none;
   }
@@ -18,7 +18,7 @@
   height: 100vh;
   background: var(--cnvs-sys-color-bg-overlay);
   animation-duration: 0.3s;
-  animation-name: animation-lqrz52;
+  animation-name: animation-p07h53;
 }
 
 .wd-no-animation .cnvs-modal-overlay-container {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@workday/canvas-kit-css",
-  "version": "12.4.0-1015-next.0",
+  "version": "13.0.0-alpha.1009-next.0",
   "description": "The parent module that contains all Workday Canvas Kit CSS components",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
@@ -25,5 +25,5 @@
     "components",
     "workday"
   ],
-  "gitHead": "d2351f7f9b4ef85afeaaf40ce7100fefb9f2d27b"
+  "gitHead": "86905802e45baf8c7c06c3f673597dc2792c6dc5"
 }

package/popup.css

@@ -1,4 +1,4 @@
-@keyframes animation-lqrzx {
+@keyframes animation-p07hx {
   0% {
     opacity: 1;
     transform: translate(var(--cnvs-translate-position-x), var(--cnvs-translate-position-y));
@@ -27,7 +27,7 @@
   padding: var(--cnvs-sys-space-x6);
   max-height: var(--cnvs-popup-card-max-height);
   overflow-y: auto;
-  animation-name: animation-lqrzx;
+  animation-name: animation-p07hx;
   animation-duration: 150ms;
   animation-timing-function: ease-out;
   transform-origin: var(--cnvs-popup-card-transform-origin-vertical) var(--cnvs-popup-card-transform-origin-horizontal);

package/skeleton.css

@@ -0,0 +1,71 @@
+.cnvs-skeleton-shape {
+  box-sizing: border-box;
+  background-color: var(--cnvs-skeleton-shape-background-color, var(--cnvs-sys-color-bg-alt-strong));
+  border-radius: var(--cnvs-skeleton-shape-border-radius, var(--cnvs-sys-space-zero));
+  height: var(--cnvs-skeleton-shape-height, 100%);
+  width: var(--cnvs-skeleton-shape-width);
+  margin-bottom: var(--cnvs-sys-space-x4);
+}
+
+
+.cnvs-skeleton-header {
+  box-sizing: border-box;
+  background-color: var(--cnvs-skeleton-header-background-color, var(--cnvs-sys-color-bg-alt-strong));
+  border-radius: 0;
+  height: var(--cnvs-skeleton-header-height, calc(var(--cnvs-sys-space-x1) * 7));
+  width: var(--cnvs-skeleton-header-width);
+  margin-bottom: var(--cnvs-sys-space-x4);
+}
+
+
+.cnvs-skeleton-text {
+  box-sizing: border-box;
+  margin-bottom: var(--cnvs-sys-space-x6);
+}
+
+.cnvs-skeleton-text [data-part="skeleton-text-lines"] {
+  background-color: var(--cnvs-skeleton-text-background-color, var(--cnvs-sys-color-bg-alt-strong));
+  height: 1.3125rem;
+  margin-block-end: var(--cnvs-sys-space-x3);
+  border-radius: var(--cnvs-sys-shape-half);
+  width: 100%;
+}
+
+.cnvs-skeleton-text [data-part="skeleton-text-lines"]:last-child {
+  width: 60%;
+}
+
+
+@keyframes animation-p07h5g {
+  from {
+    opacity: 0.4;
+  }
+  
+  to {
+    opacity: 1;
+  }
+  
+}
+
+.cnvs-skeleton {
+  box-sizing: border-box;
+  animation: animation-p07h5g 0.8s linear infinite alternate;
+  position: relative;
+  overflow: hidden;
+  height: 100%;
+  width: 100%;
+}
+
+.cnvs-skeleton [data-part="skeleton-accessible-hide"] {
+  clip: rect(1px, 1px, 1px, 1px);
+  clip-path: polygon(0px 0px, 0px 0px, 0px 0px, 0px 0px);
+  position: absolute;
+  overflow: hidden;
+  white-space: nowrap;
+  height: 1px;
+  width: 1px;
+  margin: -1px;
+  padding: 0;
+  border: 0;
+}
+