biome format --write

src/components/shadow_control/shadow_control.js

@@ -8,23 +8,24 @@ import ComponentPreview from 'src/components/component_preview/component_preview
 import { rgb2hex } from 'src/services/color_convert/color_convert.js'
 import { serializeShadow } from 'src/services/theme_data/iss_serializer.js'
 import { deserializeShadow } from 'src/services/theme_data/iss_deserializer.js'
-import { getCssShadow, getCssShadowFilter } from 'src/services/theme_data/css_utils.js'
-import { findShadow, findColor } from 'src/services/theme_data/theme_data_3.service.js'
+import {
+  getCssShadow,
+  getCssShadowFilter,
+} from 'src/services/theme_data/css_utils.js'
+import {
+  findShadow,
+  findColor,
+} from 'src/services/theme_data/theme_data_3.service.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { throttle, flattenDeep } from 'lodash'
 import {
   faTimes,
   faChevronDown,
   faChevronUp,
-  faPlus
+  faPlus,
 } from '@fortawesome/free-solid-svg-icons'
 
-library.add(
-  faChevronDown,
-  faChevronUp,
-  faTimes,
-  faPlus
-)
+library.add(faChevronDown, faChevronUp, faTimes, faPlus)
 
 const toModel = (input) => {
   if (typeof input === 'object') {
@@ -36,7 +37,7 @@ const toModel = (input) => {
       inset: false,
       color: '#000000',
       alpha: 1,
-      ...input
+      ...input,
     }
   } else if (typeof input === 'string') {
     return input
@@ -51,13 +52,13 @@ export default {
     'noPreview',
     'disabled',
     'staticVars',
-    'compact'
+    'compact',
   ],
   emits: ['update:modelValue', 'subShadowSelected'],
-  data () {
+  data() {
     return {
       selectedId: 0,
-      invalid: false
+      invalid: false,
     }
   },
   components: {
@@ -67,27 +68,27 @@ export default {
     SelectMotion,
     Checkbox,
     Popover,
-    ComponentPreview
+    ComponentPreview,
   },
   computed: {
     cValue: {
-      get () {
+      get() {
         return (this.modelValue ?? this.fallback ?? []).map(toModel)
       },
-      set (newVal) {
+      set(newVal) {
         this.$emit('update:modelValue', newVal)
-      }
+      },
     },
     selectedType: {
-      get () {
+      get() {
         return typeof this.selected
       },
-      set (newType) {
+      set(newType) {
         this.selected = toModel(newType === 'object' ? {} : '')
-      }
+      },
     },
     selected: {
-      get () {
+      get() {
         const selected = this.cValue[this.selectedId]
         if (selected && typeof selected === 'object') {
           return { ...selected }
@@ -96,24 +97,28 @@ export default {
         }
         return null
       },
-      set (value) {
+      set(value) {
         this.cValue[this.selectedId] = toModel(value)
         this.$emit('update:modelValue', this.cValue)
-      }
+      },
     },
-    present () {
+    present() {
       return this.selected != null && this.modelValue != null
     },
-    shadowsAreNull () {
+    shadowsAreNull() {
       return this.modelValue == null
     },
-    currentFallback () {
+    currentFallback() {
       return this.fallback?.[this.selectedId]
     },
-    getColorFallback () {
+    getColorFallback() {
       if (this.staticVars && this.selected?.color) {
         try {
-          const computedColor = findColor(this.selected.color, { dynamicVars: {}, staticVars: this.staticVars }, true)
+          const computedColor = findColor(
+            this.selected.color,
+            { dynamicVars: {}, staticVars: this.staticVars },
+            true,
+          )
           if (computedColor) return rgb2hex(computedColor)
           return null
         } catch (e) {
@@ -124,22 +129,30 @@ export default {
         return this.currentFallback?.color
       }
     },
-    style () {
+    style() {
       try {
         let result
-        const serialized = this.cValue.map(x => serializeShadow(x)).join(',')
+        const serialized = this.cValue.map((x) => serializeShadow(x)).join(',')
         serialized.split(/,/).map(deserializeShadow) // validate
-        const expandedShadow = flattenDeep(findShadow(this.cValue, { dynamicVars: {}, staticVars: this.staticVars }))
-        const fixedShadows = expandedShadow.map(x => ({ ...x, color: rgb2hex(x.color) }))
+        const expandedShadow = flattenDeep(
+          findShadow(this.cValue, {
+            dynamicVars: {},
+            staticVars: this.staticVars,
+          }),
+        )
+        const fixedShadows = expandedShadow.map((x) => ({
+          ...x,
+          color: rgb2hex(x.color),
+        }))
 
         if (this.separateInset) {
           result = {
             filter: getCssShadowFilter(fixedShadows),
-            boxShadow: getCssShadow(fixedShadows, true)
+            boxShadow: getCssShadow(fixedShadows, true),
           }
         } else {
           result = {
-            boxShadow: getCssShadow(fixedShadows)
+            boxShadow: getCssShadow(fixedShadows),
           }
         }
         this.invalid = false
@@ -148,23 +161,26 @@ export default {
         console.error('Invalid shadow', e)
         this.invalid = true
       }
-    }
+    },
   },
   watch: {
-    selected () {
+    selected() {
       this.$emit('subShadowSelected', this.selectedId)
-    }
+    },
   },
   methods: {
-    getNewSubshadow () {
+    getNewSubshadow() {
       return toModel(this.selected)
     },
-    onSelectChange (id) {
+    onSelectChange(id) {
       this.selectedId = id
     },
-    getSubshadowLabel (shadow, index) {
+    getSubshadowLabel(shadow, index) {
       if (typeof shadow === 'object') {
-        return shadow?.name ?? this.$t('settings.style.shadows.shadow_id', { value: index })
+        return (
+          shadow?.name ??
+          this.$t('settings.style.shadows.shadow_id', { value: index })
+        )
       } else if (typeof shadow === 'string') {
         return shadow || this.$t('settings.style.shadows.empty_expression')
       }
@@ -175,6 +191,6 @@ export default {
         this.cValue[this.selectedId].spread = 0
       }
       this.$emit('update:modelValue', this.cValue)
-    }, 100)
-  }
+    }, 100),
+  },
 }