@ctlyst.id/internal-ui 2.1.4 → 2.1.5

package/dist/internal-ui.esm.js

@@ -4119,6 +4119,7 @@ const Input = /*#__PURE__*/defineMultiStyleConfig$2({
   }
 });
 
+/* eslint-disable prefer-destructuring */
 const rotate = /*#__PURE__*/keyframes({
   '0%': {
     transform: 'rotate(0deg)'
@@ -4128,10 +4129,23 @@ const rotate = /*#__PURE__*/keyframes({
   }
 });
 const getLoaderColor = color => {
-  if (color === 'primary') return '--chakra-colors-primary-600';
-  if (color === 'danger') return '--chakra-colors-danger-500';
-  if (color === 'warning') return '--chakra-colors-warning-700';
-  return '--chakra-colors-white-high';
+  const colorValue = color.split('.');
+  let backgroundColor;
+  switch (colorValue.length) {
+    case 1:
+      backgroundColor = colorValue[0];
+      break;
+    case 2:
+      backgroundColor = `var(--chakra-colors-${colorValue[0]}-${colorValue[1]})`;
+      break;
+    default:
+      backgroundColor = 'var(--chakra-colors-white-high)';
+      break;
+  }
+  if (color === 'primary') return 'var(--chakra-colors-primary-600)';
+  if (color === 'danger') return 'var(--chakra-colors-danger-500)';
+  if (color === 'warning') return 'var(--chakra-colors-warning-700)';
+  return backgroundColor;
 };
 const LoaderStyle = /*#__PURE__*/defineStyleConfig({
   baseStyle: props => {
@@ -4142,7 +4156,7 @@ const LoaderStyle = /*#__PURE__*/defineStyleConfig({
       justifyContent: 'center',
       alignItems: 'center',
       animation: `${rotate} 1s linear infinite`,
-      background: `conic-gradient(from 180deg at 50% 50%, var(${colors}) 0deg, rgba(217, 217, 217, 0) 360deg);`,
+      background: `conic-gradient(from 180deg at 50% 50%, ${colors} 0deg, rgba(217, 217, 217, 0) 360deg);`,
       ':before': {
         content: `''`,
         display: 'block',