@aivenio/aquarium 2.8.0 → 2.9.0

package/dist/tailwind.config.js

@@ -1,173 +0,0 @@
-/* eslint-disable @typescript-eslint/no-var-requires */
-const plugin = require('tailwindcss/plugin');
-
-const backgroundColor = require('./tailwind/tailwind.backgroundColor');
-const borderColor = require('./tailwind/tailwind.borderColor');
-const borderRadius = require('./tailwind/tailwind.borderRadius');
-const borderWidth = require('./tailwind/tailwind.borderWidth');
-const boxShadow = require('./tailwind/tailwind.boxShadow');
-const colors = require('./tailwind/tailwind.colors');
-const elevations = require('./tailwind/tailwind.elevations');
-const margin = require('./tailwind/tailwind.margin');
-const screens = require('./tailwind/tailwind.screens');
-const spacing = require('./tailwind/tailwind.spacing');
-const textColor = require('./tailwind/tailwind.textColor');
-const typography = require('./tailwind/tailwind.typography');
-
-// Convert the typography object into a format that tailwind can understand
-const typographyComponents = Object.fromEntries(Object.entries(typography).map(([key, font]) => [`.${key}`, { font }]));
-
-// Utility function used to collect all the keys from an object that can be used in the safelist.
-const collectKeys = (obj, prefix = '') =>
-  Object.entries(obj).reduce((acc, [key, value]) => {
-    if (typeof value === 'object') {
-      return acc.concat(collectKeys(value, `${prefix}${key}-`));
-    }
-
-    return acc.concat(`${prefix}${key}`);
-  }, []);
-
-// Generate negative margin values
-const negativeMargin = Object.entries(margin).reduce((acc, [key, value]) => {
-  if (!['auto', '0'].includes(key)) {
-    acc[`-${key}`] = `-${value}`;
-  }
-
-  return acc;
-}, {});
-
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-  theme: {
-    boxShadow,
-    colors,
-    elevations,
-    margin: {
-      auto: 'auto',
-      ...margin,
-      ...negativeMargin,
-    },
-    screens,
-    spacing,
-    borderWidth,
-    extend: {
-      backgroundColor,
-      borderColor,
-      ringColor: borderColor,
-      outlineColor: borderColor,
-      stroke: borderColor,
-      borderRadius,
-      textColor,
-      zIndex: {
-        modal: '100',
-      },
-      animation: {
-        'positioner-fade-in': 'positioner-fade-in 300ms ease-in-out',
-        'draw': 'draw 2s cubic-bezier(0.47, 0, 0.745, 0.715) forwards',
-      },
-      keyframes: {
-        'positioner-fade-in': {
-          from: { opacity: '0' },
-          to: { opacity: '1' },
-        },
-        'draw': {
-          from: {
-            'stroke-dasharray': '1000',
-            'stroke-dashoffset': '1000',
-          },
-          to: {
-            'stroke-dashoffset': '0',
-          },
-        },
-      },
-    },
-  },
-  // https://tailwindcss.com/docs/configuring-variants#ordering-variants
-  variants: {
-    backgroundColor: ['odd', 'even', 'hover', 'group-hover', 'active', 'disabled', 'focus'],
-    textColor: ['hover', 'hover-save', 'active', 'disabled', 'visited'],
-    cursor: ['disabled'],
-    borderColor: ['children', 'focus', 'hover', 'hover-save', 'active', 'disabled'],
-    borderWidth: ['focus', 'hover', 'hover-save', 'active', 'disabled'],
-    boxShadow: ['focus', 'hover', 'hover-save'],
-    transitionProperty: ['hover', 'focus'],
-    aivenTypographyComponent: ['focus'],
-    display: ['children'],
-    opacity: ['sibling-input-focus', 'focus'],
-  },
-  content: ['./src/**/*.tsx', './src/**/*.ts'],
-  safelist: [
-    ...Object.keys(typographyComponents),
-    ...collectKeys(colors, 'text-'),
-    ...collectKeys(colors, 'bg-'),
-    ...collectKeys(colors, 'border-'),
-    ...collectKeys(textColor, 'text-'),
-    ...collectKeys(backgroundColor, 'bg-'),
-    ...collectKeys(borderColor, 'border-'),
-    'line-clamp-1',
-    'line-clamp-2',
-    'line-clamp-3',
-    'line-clamp-4',
-    'line-clamp-5',
-    'line-clamp-6',
-    'animate-draw',
-  ],
-  plugins: [
-    require('tailwindcss-children'),
-    require('tailwindcss-react-aria-components'),
-
-    plugin(({ addVariant, e }) => {
-      addVariant('hover-save', ({ modifySelectors, separator }) => {
-        modifySelectors(({ className }) => {
-          return `.${e(`hover-save${separator}${className}`)}:hover:not(:disabled)`;
-        });
-      });
-    }),
-
-    plugin(({ addComponents, variants }) => {
-      return addComponents(typographyComponents, variants('aivenTypographyComponent'));
-    }),
-
-    plugin(({ addVariant, e }) => {
-      addVariant('sibling-input-focus', ({ modifySelectors, separator }) => {
-        modifySelectors(({ className }) => {
-          const eClassName = e(`sibling-input-focus${separator}${className}`);
-          return `input:focus ~ * .${eClassName}`;
-        });
-      });
-    }),
-
-    plugin(({ addUtilities }) => {
-      addUtilities(
-        {
-          '.scrollbar-hide': {
-            /* IE and Edge */
-            '-ms-overflow-style': 'none',
-
-            /* Firefox */
-            'scrollbar-width': 'none',
-
-            /* Safari and Chrome */
-            '&::-webkit-scrollbar': {
-              display: 'none',
-            },
-          },
-
-          '.scrollbar-default': {
-            /* IE and Edge */
-            '-ms-overflow-style': 'auto',
-
-            /* Firefox */
-            'scrollbar-width': 'auto',
-
-            /* Safari and Chrome */
-            '&::-webkit-scrollbar': {
-              display: 'block',
-            },
-          },
-        },
-        ['responsive'],
-      );
-    }),
-  ],
-};