fix: prevent overriding default animation

shuriken-ui · Jun 30, 2023 · 6233615 · 6233615
1 parent 9586f5b
commit 6233615
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 21 deletions.
diff --git a/src/plugins/components/placeload.ts b/src/plugins/components/placeload.ts
@@ -28,14 +28,16 @@ export default plugin.withOptions(
 
     return {
       theme: {
-        keyframes: {
-          [`${prefix}-placeload`]: {
-            '0%': { 'background-position': '-468px 0' },
-            '100%': { 'background-position': '468px 0' },
+        extend: {
+          keyframes: {
+            [`${prefix}-placeload`]: {
+              '0%': { 'background-position': '-468px 0' },
+              '100%': { 'background-position': '468px 0' },
+            },
+          },
+          animation: {
+            [`${prefix}-placeload`]: `${prefix}-placeload 1s linear infinite forwards`,
           },
-        },
-        animation: {
-          [`${prefix}-placeload`]: `${prefix}-placeload 1s linear infinite forwards`,
         },
       },
     }

diff --git a/src/plugins/components/tooltip.ts b/src/plugins/components/tooltip.ts
@@ -195,23 +195,25 @@ export default plugin.withOptions(
 
     return {
       theme: {
-        keyframes: {
-          [`${prefix}-tooltip-x`]: {
-            to: {
-              opacity: '1',
-              transform: 'translate(-50%, 0)',
+        extend: {
+          keyframes: {
+            [`${prefix}-tooltip-x`]: {
+              to: {
+                opacity: '1',
+                transform: 'translate(-50%, 0)',
+              },
             },
-          },
-          [`${prefix}-tooltip-y`]: {
-            to: {
-              opacity: '1',
-              transform: 'translate(0, -50%)',
+            [`${prefix}-tooltip-y`]: {
+              to: {
+                opacity: '1',
+                transform: 'translate(0, -50%)',
+              },
             },
           },
-        },
-        animation: {
-          [`${prefix}-tooltip-x`]: `${prefix}-tooltip-x 300ms ease-out forwards`,
-          [`${prefix}-tooltip-y`]: `${prefix}-tooltip-y 300ms ease-out forwards`,
+          animation: {
+            [`${prefix}-tooltip-x`]: `${prefix}-tooltip-x 300ms ease-out forwards`,
+            [`${prefix}-tooltip-y`]: `${prefix}-tooltip-y 300ms ease-out forwards`,
+          },
         },
         shurikenUi: {
           tooltip: defaultTooltipConfig,