fix: typo, pallete => palette

src/_utils/cssr/index.js

@@ -17,7 +17,7 @@ const plugin = BEMPlugin({
 cssr.use(plugin)
 const { c, context, find } = cssr
 context.theme = null
-context.pallete = null
+context.palette = null
 const { cB, cE, cM, cNotM } = plugin
 
 function insideFormItem (status, style) {

src/button/src/styles/button/themed-color.cssr.js

@@ -3,14 +3,14 @@ import { c, cB, cTB, cE, cM, cNotM, createKey } from '../../../../_utils/cssr'
 export default c([
   ({ props }) => {
     const type = props.$vm.type
-    const pallete = extractPallete(props.$local, type)
+    const palette = extractPalette(props.$local, type)
     return [
       createRippleAnimation(),
       cTB(
         'button',
         [
           cM(`${type}-type`, {
-            '--ripple-color': pallete.rippleColor
+            '--ripple-color': palette.rippleColor
           }, [
             // wave animation
             cB('base-wave', [
@@ -20,16 +20,16 @@ export default c([
               })
             ]),
             // background-color
-            createBackgroundStyle(pallete),
+            createBackgroundStyle(palette),
             // text-color
-            ['base', 'ghost', 'text'].map(appearance => createTextStyle(pallete, appearance)),
+            ['base', 'ghost', 'text'].map(appearance => createTextStyle(palette, appearance)),
             cM('base', [
               cM('custom-color', {
                 color: `${props.$local.textColorPrimary} !important`
               })
             ]),
             // border-color
-            createBorderStyle(pallete)
+            createBorderStyle(palette)
           ])
         ]
       )
@@ -37,7 +37,7 @@ export default c([
   }
 ])
 
-function extractPallete (props, type) {
+function extractPalette (props, type) {
   return {
     color: props[createKey('color', type)],
     colorHover: props[createKey('colorHover', type)],
@@ -103,7 +103,7 @@ function createBorderMaskStyle (color) {
   })
 }
 
-function createTextStyle (pallete, appearance) {
+function createTextStyle (palette, appearance) {
   // textColor for base
   // textColorGhost for ghost
   // textColorText for text
@@ -117,56 +117,56 @@ function createTextStyle (pallete, appearance) {
   const hoverKey = createKey(propPrefix, 'hover')
   const pressedKey = createKey(propPrefix, 'pressed')
   return cM(appearance, {
-    color: `var(--color, ${pallete[propPrefix]})`
+    color: `var(--color, ${palette[propPrefix]})`
   }, [
     cM('disabled', {
-      color: `var(--color-disabled, ${pallete[disabledKey]})`
+      color: `var(--color-disabled, ${palette[disabledKey]})`
     }),
     cNotM('disabled', [
       c('&:focus', {
-        color: `var(--color-focus, ${pallete[focusKey]})`
+        color: `var(--color-focus, ${palette[focusKey]})`
       }),
       c('&:hover', {
-        color: `var(--color-hover, ${pallete[hoverKey]})`
+        color: `var(--color-hover, ${palette[hoverKey]})`
       }),
       c('&:active', {
-        color: `var(--color-pressed, ${pallete[pressedKey]})`
+        color: `var(--color-pressed, ${palette[pressedKey]})`
       }),
       cM('pressed', {
-        color: `var(--color-pressed, ${pallete[pressedKey]})`
+        color: `var(--color-pressed, ${palette[pressedKey]})`
       })
     ])
   ])
 }
 
-function createBorderStyle (pallete) {
+function createBorderStyle (palette) {
   return [
     cM('ghost, base', {
-      borderColor: `var(--color, ${pallete.borderColor})`
+      borderColor: `var(--color, ${palette.borderColor})`
     }, [
       cM('disabled', {
-        borderColor: `var(--color-disabled, ${pallete.borderColorDisabled})`
+        borderColor: `var(--color-disabled, ${palette.borderColorDisabled})`
       }),
       cNotM('disabled', [
         c('&:focus', {
-          borderColor: `var(--color-focus, ${pallete.borderColorFocus})`
+          borderColor: `var(--color-focus, ${palette.borderColorFocus})`
         }, [
-          createBorderMaskStyle(`var(--color-focus, ${pallete.borderColorFocus})`)
+          createBorderMaskStyle(`var(--color-focus, ${palette.borderColorFocus})`)
         ]),
         c('&:hover', {
-          borderColor: `var(--color-hover, ${pallete.borderColorHover})`
+          borderColor: `var(--color-hover, ${palette.borderColorHover})`
         }, [
-          createBorderMaskStyle(`var(--color-hover, ${pallete.borderColorHover})`)
+          createBorderMaskStyle(`var(--color-hover, ${palette.borderColorHover})`)
         ]),
         c('&:active', {
-          borderColor: `var(--color-pressed, ${pallete.borderColorPressed})`
+          borderColor: `var(--color-pressed, ${palette.borderColorPressed})`
         }, [
-          createBorderMaskStyle(`var(--color-pressed, ${pallete.borderColorPressed})`)
+          createBorderMaskStyle(`var(--color-pressed, ${palette.borderColorPressed})`)
         ]),
         cM('pressed', {
-          borderColor: `var(--color-pressed, ${pallete.borderColorPressed})`
+          borderColor: `var(--color-pressed, ${palette.borderColorPressed})`
         }, [
-          createBorderMaskStyle(`var(--color-pressed, ${pallete.borderColorPressed})`)
+          createBorderMaskStyle(`var(--color-pressed, ${palette.borderColorPressed})`)
         ])
       ])
     ]),
@@ -176,26 +176,26 @@ function createBorderStyle (pallete) {
   ]
 }
 
-function createBackgroundStyle (pallete) {
+function createBackgroundStyle (palette) {
   return [
     cM('base', {
-      backgroundColor: `var(--color, ${pallete.color})`
+      backgroundColor: `var(--color, ${palette.color})`
     }, [
       cM('disabled', {
-        backgroundColor: `var(--color-disabled, ${pallete.colorDisabled})`
+        backgroundColor: `var(--color-disabled, ${palette.colorDisabled})`
       }),
       cNotM('disabled', [
         c('&:focus', {
-          backgroundColor: `var(--color-focus, ${pallete.colorFocus})`
+          backgroundColor: `var(--color-focus, ${palette.colorFocus})`
         }),
         c('&:hover', {
-          backgroundColor: `var(--color-hover, ${pallete.colorHover})`
+          backgroundColor: `var(--color-hover, ${palette.colorHover})`
         }),
         c('&:active', {
-          backgroundColor: `var(--color-pressed, ${pallete.colorPressed})`
+          backgroundColor: `var(--color-pressed, ${palette.colorPressed})`
         }),
         cM('pressed', {
-          backgroundColor: `var(--color-pressed, ${pallete.colorPressed})`
+          backgroundColor: `var(--color-pressed, ${palette.colorPressed})`
         })
       ])
     ]),

src/input/src/styles/input/themed-base.cssr.js

@@ -273,33 +273,33 @@ export default c([
       'warning',
       'error'
     ].map(status => {
-      const pallete = props.$local
+      const palette = props.$local
       return insideFormItem(
         status,
         cTB('input', [
           cM('stateful', [
             cE('state-border', {
-              border: pallete[createKey('border', status)]
+              border: palette[createKey('border', status)]
             }),
             cNotM('disabled', [
               c('&:hover', [
                 cE('state-border', {
-                  border: pallete[createKey('borderHover', status)]
+                  border: palette[createKey('borderHover', status)]
                 })
               ]),
               cM('focus', {
-                backgroundColor: pallete[createKey('colorFocus', status)]
+                backgroundColor: palette[createKey('colorFocus', status)]
               }, [
                 cE('state-border', {
-                  border: pallete[createKey('borderFocus', status)]
+                  border: palette[createKey('borderFocus', status)]
                 }),
                 cE('box-shadow', {
-                  boxShadow: pallete[createKey('boxShadowFocus', status)]
+                  boxShadow: palette[createKey('boxShadowFocus', status)]
                 })
               ])
             ]),
             cE('input, textarea', {
-              caretColor: pallete[createKey('caretColor', status)]
+              caretColor: palette[createKey('caretColor', status)]
             })
           ])
         ])

src/message/src/styles/themed-base.cssr.js

@@ -3,32 +3,32 @@ import iconSwitchTransition from '../../../_styles/transitions/icon-switch'
 
 function typeStyle (
   type,
-  pallete
+  palette
 ) {
   return cM(`${type}-type`, {
     raw: `
-      color: ${pallete[createKey('textColor', type)]};
-      background-color: ${pallete[createKey('color', type)]};
-      box-shadow: ${pallete[createKey('boxShadow', type)]};
+      color: ${palette[createKey('textColor', type)]};
+      background-color: ${palette[createKey('color', type)]};
+      box-shadow: ${palette[createKey('boxShadow', type)]};
     `
   }, [
     cE('icon', [
       cB('icon', {
-        color: pallete[createKey('iconColor', type)]
+        color: palette[createKey('iconColor', type)]
       })
     ]),
     cE('close', [
       cB('icon', {
         raw: `
           cursor: pointer;
-          color: ${pallete[createKey('closeColor', type)]};
+          color: ${palette[createKey('closeColor', type)]};
         `
       }, [
         c('&:hover', {
-          color: pallete[createKey('closeColorHover', type)]
+          color: palette[createKey('closeColorHover', type)]
         }),
         c('&:active', {
-          color: pallete[createKey('closeColorPressed', type)]
+          color: palette[createKey('closeColorPressed', type)]
         })
       ])
     ])

src/timeline/src/styles/themed-base.cssr.js

@@ -136,12 +136,12 @@ export default c([
   }
 ])
 
-function itemTypeStyle (type, pallete) {
+function itemTypeStyle (type, palette) {
   return cM(`${type}-type`, [
     cB('timeline-item-timeline', [
       cE('circle', {
         raw: `
-          border-color: ${pallete[createKey('circleBorderColor', type)]}
+          border-color: ${palette[createKey('circleBorderColor', type)]}
         `
       })
     ])