@webitel/styleguide 26.2.4 → 26.2.6

package/src/lib/primevue/components/radio/colors/dark/index.ts

@@ -1,29 +1,29 @@
 const darkColors = {
-  root: {
-    background: '{transparent}',
-    checkedBackground: '{surface.300}',
-    checkedHoverBackground: '{surface.200}',
-    disabledBackground: '{surface.650}',
-    filledBackground: '{form.field.filled.background}',
-    borderColor: '{surface.300}',
-    hoverBorderColor: '{surface.200}',
-    focusBorderColor: '{focus-color}',
-    checkedBorderColor: '{surface.300}',
-    checkedHoverBorderColor: '{surface.200}',
-    checkedFocusBorderColor: '{focus-color}',
-    checkedDisabledBorderColor: '{surface.650}',
-    invalidBorderColor: '{form.field.invalid.border.color}',
-    shadow: '{form.field.shadow}',
-    focusRing: {
-      color: '{focus-color}',
-      shadow: '{focus.ring.shadow}'
-    },
-  },
-  icon: {
-    checkedColor: '{surface.800}',
-    checkedHoverColor: '{surface.800}',
-    disabledColor: '{surface.500}',
-  }
-}
+	root: {
+		background: '{transparent}',
+		checkedBackground: '{surface.300}',
+		checkedHoverBackground: '{surface.200}',
+		disabledBackground: '{surface.650}',
+		filledBackground: '{form.field.filled.background}',
+		borderColor: '{surface.300}',
+		hoverBorderColor: '{surface.200}',
+		focusBorderColor: '{focus-color}',
+		checkedBorderColor: '{surface.300}',
+		checkedHoverBorderColor: '{surface.200}',
+		checkedFocusBorderColor: '{focus-color}',
+		checkedDisabledBorderColor: '{surface.650}',
+		invalidBorderColor: '{form.field.invalid.border.color}',
+		shadow: '{form.field.shadow}',
+		focusRing: {
+			color: '{focus-color}',
+			shadow: '{focus.ring.shadow}',
+		},
+	},
+	icon: {
+		checkedColor: '{surface.800}',
+		checkedHoverColor: '{surface.800}',
+		disabledColor: '{surface.500}',
+	},
+};
 
-export default darkColors
+export default darkColors;

package/src/lib/primevue/components/radio/colors/index.ts

@@ -2,8 +2,8 @@ import darkColors from './dark';
 import lightColors from './light';
 
 const colorScheme = {
-  light: lightColors,
-  dark: darkColors
-}
+	light: lightColors,
+	dark: darkColors,
+};
 
-export default colorScheme;
+export default colorScheme;

package/src/lib/primevue/components/radio/colors/light/index.ts

@@ -1,29 +1,29 @@
 const lightColors = {
-  root: {
-    background: '{transparent}',
-    checkedBackground: '{surface.700}',
-    checkedHoverBackground: '{surface.600}',
-    disabledBackground: '{surface.200}',
-    filledBackground: '{form.field.filled.background}',
-    borderColor: '{surface.700}',
-    hoverBorderColor: '{surface.600}',
-    focusBorderColor: '{focus-color}',
-    checkedBorderColor: '{surface.700}',
-    checkedHoverBorderColor: '{surface.600}',
-    checkedFocusBorderColor: '{focus-color}',
-    checkedDisabledBorderColor: '{surface.200}',
-    invalidBorderColor: '{form.field.invalid.border.color}',
-    shadow: '{form.field.shadow}',
-    focusRing: {
-      color: '{focus-color}',
-      shadow: '{focus.ring.shadow}'
-    },
-  },
-  icon: {
-    checkedColor: '{surface.0}',
-    checkedHoverColor: '{surface.0}',
-    disabledColor: '{surface.400}',
-  }
-}
+	root: {
+		background: '{transparent}',
+		checkedBackground: '{surface.700}',
+		checkedHoverBackground: '{surface.600}',
+		disabledBackground: '{surface.200}',
+		filledBackground: '{form.field.filled.background}',
+		borderColor: '{surface.700}',
+		hoverBorderColor: '{surface.600}',
+		focusBorderColor: '{focus-color}',
+		checkedBorderColor: '{surface.700}',
+		checkedHoverBorderColor: '{surface.600}',
+		checkedFocusBorderColor: '{focus-color}',
+		checkedDisabledBorderColor: '{surface.200}',
+		invalidBorderColor: '{form.field.invalid.border.color}',
+		shadow: '{form.field.shadow}',
+		focusRing: {
+			color: '{focus-color}',
+			shadow: '{focus.ring.shadow}',
+		},
+	},
+	icon: {
+		checkedColor: '{surface.0}',
+		checkedHoverColor: '{surface.0}',
+		disabledColor: '{surface.400}',
+	},
+};
 
-export default lightColors
+export default lightColors;

package/src/lib/primevue/components/radio/index.ts

@@ -1,9 +1,9 @@
-import colorScheme from "./colors";
-import sizes from "./sizes";
+import colorScheme from './colors';
+import sizes from './sizes';
 
 const TableScheme = {
-  colorScheme,
-  sizes,
+	colorScheme,
+	sizes,
 };
 
-export default TableScheme
+export default TableScheme;

package/src/lib/primevue/components/radio/sizes/index.ts

@@ -1,33 +1,33 @@
 const sizes = {
-  root: {
-    width: '1.125rem',
-    height: '1.125rem',
-    focusRing: {
-      width: '{focus.ring.width}',
-      style: '{focus.ring.style}',
-      offset: '{focus.ring.offset}',
-    },
-    transitionDuration: '{form.field.transition.duration}',
-    sm: {
-        width: '1rem',
-        height: '1rem'
-    },
-    lg: {
-        width: '1.5rem',
-        height: '1.5rem'
-    },
-    wrapperWidth: '1.5rem',
-    wrapperHeight: '1.5rem',
-  },
-  icon: {
-    size: '0.5rem',
-    sm: {
-      size: '0.5rem'
-    },
-    lg: {
-        size: '1rem'
-    }
-  }
-}
+	root: {
+		width: '1.125rem',
+		height: '1.125rem',
+		focusRing: {
+			width: '{focus.ring.width}',
+			style: '{focus.ring.style}',
+			offset: '{focus.ring.offset}',
+		},
+		transitionDuration: '{form.field.transition.duration}',
+		sm: {
+			width: '1rem',
+			height: '1rem',
+		},
+		lg: {
+			width: '1.5rem',
+			height: '1.5rem',
+		},
+		wrapperWidth: '1.5rem',
+		wrapperHeight: '1.5rem',
+	},
+	icon: {
+		size: '0.5rem',
+		sm: {
+			size: '0.5rem',
+		},
+		lg: {
+			size: '1rem',
+		},
+	},
+};
 
-export default sizes
+export default sizes;

package/src/lib/primevue/components/slider/colors/dark/index.ts

@@ -1,23 +1,24 @@
 const darkColors = {
-  track: {
-    background: '{content.border.color}',
-  },
-  range: {
-    background: '{primary.color}'
-  },
-  handle: {
-    background: '{content.border.color}',
-    hoverBackground: '{content.border.color}',
-    content: {
-      background: '{content.background}',
-      hoverBackground: '{content.hoverBackground}',
-      shadow: '0px 0.5px 0px 0px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.14)'
-    },
-    focusRing: {
-      color: '{focus.ring.color}',
-      shadow: '{focus.ring.shadow}'
-    }
-  },
-}
+	track: {
+		background: '{content.border.color}',
+	},
+	range: {
+		background: '{primary.color}',
+	},
+	handle: {
+		background: '{content.border.color}',
+		hoverBackground: '{content.border.color}',
+		content: {
+			background: '{content.background}',
+			hoverBackground: '{content.hoverBackground}',
+			shadow:
+				'0px 0.5px 0px 0px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.14)',
+		},
+		focusRing: {
+			color: '{focus.ring.color}',
+			shadow: '{focus.ring.shadow}',
+		},
+	},
+};
 
-export default darkColors
+export default darkColors;

package/src/lib/primevue/components/slider/colors/index.ts

@@ -2,8 +2,8 @@ import darkColors from './dark';
 import lightColors from './light';
 
 const colorScheme = {
-  light: lightColors,
-  dark: darkColors
-}
+	light: lightColors,
+	dark: darkColors,
+};
 
 export default colorScheme;

package/src/lib/primevue/components/slider/colors/light/index.ts

@@ -1,23 +1,24 @@
 const lightColors = {
-  track: {
-    background: '{content.border.color}',
-  },
-  range: {
-    background: '{primary.color}'
-  },
-  handle: {
-    background: '{content.border.color}',
-    hoverBackground: '{content.border.color}',
-    content: {
-      background: '{content.background}',
-      hoverBackground: '{content.hoverBackground}',
-      shadow: '0px 0.5px 0px 0px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.14)'
-    },
-    focusRing: {
-      color: '{focus.ring.color}',
-      shadow: '{focus.ring.shadow}'
-    }
-  },
-}
+	track: {
+		background: '{content.border.color}',
+	},
+	range: {
+		background: '{primary.color}',
+	},
+	handle: {
+		background: '{content.border.color}',
+		hoverBackground: '{content.border.color}',
+		content: {
+			background: '{content.background}',
+			hoverBackground: '{content.hoverBackground}',
+			shadow:
+				'0px 0.5px 0px 0px rgba(0, 0, 0, 0.08), 0px 1px 1px 0px rgba(0, 0, 0, 0.14)',
+		},
+		focusRing: {
+			color: '{focus.ring.color}',
+			shadow: '{focus.ring.shadow}',
+		},
+	},
+};
 
-export default lightColors
+export default lightColors;

package/src/lib/primevue/components/slider/index.ts

@@ -2,8 +2,8 @@ import colorScheme from './colors';
 import sizes from './sizes';
 
 const SliderScheme = {
-  colorScheme,
-  sizes,
-}
+	colorScheme,
+	sizes,
+};
 
-export default SliderScheme
+export default SliderScheme;

package/src/lib/primevue/components/slider/sizes/index.ts

@@ -1,26 +1,26 @@
 const sizes = {
-  root: {
-    transitionDuration: '{transition.duration}'
-  },
-  track: {
-    borderRadius: '{content.border.radius}',
-    size: '4px'
-  },
-  handle: {
-    width: '16px',
-    height: '16px',
-    borderRadius: '50%',
-    content: {
-      borderRadius: '50%',
-      width: '12px',
-      height: '12px',
-    },
-    focusRing: {
-      width: '{focus.ring.width}',
-      style: '{focus.ring.style}',
-      offset: '{focus.ring.offset}',
-    }
-  }
-}
+	root: {
+		transitionDuration: '{transition.duration}',
+	},
+	track: {
+		borderRadius: '{content.border.radius}',
+		size: '4px',
+	},
+	handle: {
+		width: '16px',
+		height: '16px',
+		borderRadius: '50%',
+		content: {
+			borderRadius: '50%',
+			width: '12px',
+			height: '12px',
+		},
+		focusRing: {
+			width: '{focus.ring.width}',
+			style: '{focus.ring.style}',
+			offset: '{focus.ring.offset}',
+		},
+	},
+};
 
-export default sizes
+export default sizes;

package/src/lib/primevue/components/switcher/colors/dark/index.ts

@@ -1,32 +1,32 @@
 const darkColors = {
-  root: {
-    shadow: '{form.field.shadow}',
-    focusRing: {
-      color: '{focus.ring.color}',
-      shadow: '{focus.ring.shadow}'
-    },
-    borderColor: 'transparent',
-    hoverBorderColor: 'transparent',
-    checkedBorderColor: 'transparent',
-    checkedHoverBorderColor: 'transparent',
-    invalidBorderColor: '{form.field.invalid.border.color}',
-    background: '{surface.450}',
-    disabledBackground: '{surface.650}',
-    hoverBackground: '{surface.350}',
-    checkedBackground: '{primary.color}',
-    checkedHoverBackground: '{primary.hover.color}'
-  },
-  handle: {
-    background: '{surface.850}',
-    disabledBackground: '{surface.750}',
-    hoverBackground: '{surface.750}',
-    checkedBackground: '{surface.800}',
-    checkedHoverBackground: '{surface.700}',
-    color: '{text.muted.color}',
-    hoverColor: '{text.color}',
-    checkedColor: '{primary.color}',
-    checkedHoverColor: '{primary.hover.color}'
-  }
-}
+	root: {
+		shadow: '{form.field.shadow}',
+		focusRing: {
+			color: '{focus.ring.color}',
+			shadow: '{focus.ring.shadow}',
+		},
+		borderColor: 'transparent',
+		hoverBorderColor: 'transparent',
+		checkedBorderColor: 'transparent',
+		checkedHoverBorderColor: 'transparent',
+		invalidBorderColor: '{form.field.invalid.border.color}',
+		background: '{surface.450}',
+		disabledBackground: '{surface.650}',
+		hoverBackground: '{surface.350}',
+		checkedBackground: '{primary.color}',
+		checkedHoverBackground: '{primary.hover.color}',
+	},
+	handle: {
+		background: '{surface.850}',
+		disabledBackground: '{surface.750}',
+		hoverBackground: '{surface.750}',
+		checkedBackground: '{surface.800}',
+		checkedHoverBackground: '{surface.700}',
+		color: '{text.muted.color}',
+		hoverColor: '{text.color}',
+		checkedColor: '{primary.color}',
+		checkedHoverColor: '{primary.hover.color}',
+	},
+};
 
-export default darkColors
+export default darkColors;

package/src/lib/primevue/components/switcher/colors/index.ts

@@ -2,8 +2,8 @@ import darkColors from './dark';
 import lightColors from './light';
 
 const colorScheme = {
-  light: lightColors,
-  dark: darkColors
-}
+	light: lightColors,
+	dark: darkColors,
+};
 
-export default colorScheme;
+export default colorScheme;

package/src/lib/primevue/components/switcher/colors/light/index.ts

@@ -1,32 +1,32 @@
 const lightColors = {
-  root: {
-    shadow: '{form.field.shadow}',
-    focusRing: {
-      color: '{focus.ring.color}',
-      shadow: '{focus.ring.shadow}'
-    },
-    borderColor: 'transparent',
-    hoverBorderColor: 'transparent',
-    checkedBorderColor: 'transparent',
-    checkedHoverBorderColor: 'transparent',
-    invalidBorderColor: '{form.field.invalid.border.color}',
-    background: '{surface.650}',
-    disabledBackground: '{surface.150}',
-    hoverBackground: '{surface.550}',
-    checkedBackground: '{primary.color}',
-    checkedHoverBackground: '{primary.hover.color}'
-  },
-  handle: {
-    background: '{surface.150}',
-    disabledBackground: '{surface.300}',
-    hoverBackground: '{surface.50}',
-    checkedBackground: '{surface.750}',
-    checkedHoverBackground: '{surface.650}',
-    color: '{text.muted.color}',
-    hoverColor: '{text.color}',
-    checkedColor: '{primary.color}',
-    checkedHoverColor: '{primary.hover.color}'
-  }
-}
+	root: {
+		shadow: '{form.field.shadow}',
+		focusRing: {
+			color: '{focus.ring.color}',
+			shadow: '{focus.ring.shadow}',
+		},
+		borderColor: 'transparent',
+		hoverBorderColor: 'transparent',
+		checkedBorderColor: 'transparent',
+		checkedHoverBorderColor: 'transparent',
+		invalidBorderColor: '{form.field.invalid.border.color}',
+		background: '{surface.650}',
+		disabledBackground: '{surface.150}',
+		hoverBackground: '{surface.550}',
+		checkedBackground: '{primary.color}',
+		checkedHoverBackground: '{primary.hover.color}',
+	},
+	handle: {
+		background: '{surface.150}',
+		disabledBackground: '{surface.300}',
+		hoverBackground: '{surface.50}',
+		checkedBackground: '{surface.750}',
+		checkedHoverBackground: '{surface.650}',
+		color: '{text.muted.color}',
+		hoverColor: '{text.color}',
+		checkedColor: '{primary.color}',
+		checkedHoverColor: '{primary.hover.color}',
+	},
+};
 
-export default lightColors
+export default lightColors;

package/src/lib/primevue/components/switcher/index.ts

@@ -2,8 +2,8 @@ import colorScheme from './colors';
 import sizes from './sizes';
 
 const SwitcherScheme = {
-  colorScheme,
-  sizes,
-}
+	colorScheme,
+	sizes,
+};
 
-export default SwitcherScheme
+export default SwitcherScheme;

package/src/lib/primevue/components/switcher/sizes/index.ts

@@ -1,17 +1,17 @@
 const sizes = {
-  root: {
-    width: '2.5rem',
-    height: '1.5rem',
-    borderRadius: '30px',
-    gap: '0.25rem',
-    borderWidth: '1px',
-    transitionDuration: '{form.field.transition.duration}',
-    slideDuration: '0.2s'
-  },
-  handle: {
-    borderRadius: '50%',
-    size: '1rem'
-  }
-}
+	root: {
+		width: '2.5rem',
+		height: '1.5rem',
+		borderRadius: '30px',
+		gap: '0.25rem',
+		borderWidth: '1px',
+		transitionDuration: '{form.field.transition.duration}',
+		slideDuration: '0.2s',
+	},
+	handle: {
+		borderRadius: '50%',
+		size: '1rem',
+	},
+};
 
-export default sizes
+export default sizes;