npm - @quillsql/react - Versions diffs - 1.6.9 → 1.7.1 - Mend

@quillsql/react 1.6.9 → 1.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (201) hide show

package/lib/AddToDashboardModal.js +249 -369
package/lib/AddToDashboardModal.js.map +1 -1
package/lib/BarList.js +92 -109
package/lib/BarList.js.map +1 -1
package/lib/Chart.js +378 -491
package/lib/Chart.js.map +1 -1
package/lib/Context.d.ts +3 -3
package/lib/Context.js +94 -96
package/lib/Context.js.map +1 -1
package/lib/Dashboard.js +200 -217
package/lib/Dashboard.js.map +1 -1
package/lib/DateRangePicker/Calendar.js +87 -91
package/lib/DateRangePicker/Calendar.js.map +1 -1
package/lib/DateRangePicker/DateRangePicker.js +70 -68
package/lib/DateRangePicker/DateRangePicker.js.map +1 -1
package/lib/DateRangePicker/DateRangePickerButton.js +46 -57
package/lib/DateRangePicker/DateRangePickerButton.js.map +1 -1
package/lib/DateRangePicker/dateRangePickerUtils.js +105 -99
package/lib/DateRangePicker/dateRangePickerUtils.js.map +1 -1
package/lib/DateRangePicker/index.js +8 -1
package/lib/DateRangePicker/index.js.map +1 -1
package/lib/PieChart.js +221 -225
package/lib/PieChart.js.map +1 -1
package/lib/QuillProvider.d.ts +2 -1
package/lib/QuillProvider.js +8 -18
package/lib/QuillProvider.js.map +1 -1
package/lib/ReportBuilder.d.ts +1 -1
package/lib/ReportBuilder.js +430 -526
package/lib/ReportBuilder.js.map +1 -1
package/lib/SQLEditor.js +183 -268
package/lib/SQLEditor.js.map +1 -1
package/lib/Table.js +213 -256
package/lib/Table.js.map +1 -1
package/lib/TableChart.js +76 -75
package/lib/TableChart.js.map +1 -1
package/lib/assets/ArrowDownHeadIcon.js +5 -28
package/lib/assets/ArrowDownHeadIcon.js.map +1 -1
package/lib/assets/ArrowDownIcon.js +5 -28
package/lib/assets/ArrowDownIcon.js.map +1 -1
package/lib/assets/ArrowDownRightIcon.js +5 -28
package/lib/assets/ArrowDownRightIcon.js.map +1 -1
package/lib/assets/ArrowLeftHeadIcon.js +5 -28
package/lib/assets/ArrowLeftHeadIcon.js.map +1 -1
package/lib/assets/ArrowRightHeadIcon.js +5 -28
package/lib/assets/ArrowRightHeadIcon.js.map +1 -1
package/lib/assets/ArrowRightIcon.js +5 -28
package/lib/assets/ArrowRightIcon.js.map +1 -1
package/lib/assets/ArrowUpHeadIcon.js +5 -28
package/lib/assets/ArrowUpHeadIcon.js.map +1 -1
package/lib/assets/ArrowUpIcon.js +5 -28
package/lib/assets/ArrowUpIcon.js.map +1 -1
package/lib/assets/ArrowUpRightIcon.js +5 -28
package/lib/assets/ArrowUpRightIcon.js.map +1 -1
package/lib/assets/CalendarIcon.js +5 -28
package/lib/assets/CalendarIcon.js.map +1 -1
package/lib/assets/DoubleArrowLeftHeadIcon.js +5 -28
package/lib/assets/DoubleArrowLeftHeadIcon.js.map +1 -1
package/lib/assets/DoubleArrowRightHeadIcon.js +5 -28
package/lib/assets/DoubleArrowRightHeadIcon.js.map +1 -1
package/lib/assets/ExclamationFilledIcon.js +5 -28
package/lib/assets/ExclamationFilledIcon.js.map +1 -1
package/lib/assets/LoadingSpinner.js +5 -28
package/lib/assets/LoadingSpinner.js.map +1 -1
package/lib/assets/SearchIcon.js +5 -28
package/lib/assets/SearchIcon.js.map +1 -1
package/lib/assets/XCircleIcon.js +5 -28
package/lib/assets/XCircleIcon.js.map +1 -1
package/lib/assets/index.js +38 -16
package/lib/assets/index.js.map +1 -1
package/lib/components/BigModal/BigModal.js +45 -43
package/lib/components/BigModal/BigModal.js.map +1 -1
package/lib/components/Dropdown/Dropdown.js +57 -53
package/lib/components/Dropdown/Dropdown.js.map +1 -1
package/lib/components/Dropdown/DropdownItem.js +43 -40
package/lib/components/Dropdown/DropdownItem.js.map +1 -1
package/lib/components/Dropdown/index.js +10 -2
package/lib/components/Dropdown/index.js.map +1 -1
package/lib/components/Modal/Modal.js +45 -43
package/lib/components/Modal/Modal.js.map +1 -1
package/lib/components/Modal/index.js +8 -1
package/lib/components/Modal/index.js.map +1 -1
package/lib/components/selectUtils.js +20 -15
package/lib/components/selectUtils.js.map +1 -1
package/lib/contexts/BaseColorContext.js +5 -3
package/lib/contexts/BaseColorContext.js.map +1 -1
package/lib/contexts/HoveredValueContext.js +5 -3
package/lib/contexts/HoveredValueContext.js.map +1 -1
package/lib/contexts/RootStylesContext.js +5 -3
package/lib/contexts/RootStylesContext.js.map +1 -1
package/lib/contexts/SelectedValueContext.js +5 -3
package/lib/contexts/SelectedValueContext.js.map +1 -1
package/lib/contexts/index.js +14 -4
package/lib/contexts/index.js.map +1 -1
package/lib/hooks/index.js +14 -4
package/lib/hooks/index.js.map +1 -1
package/lib/hooks/useInternalState.js +9 -7
package/lib/hooks/useInternalState.js.map +1 -1
package/lib/hooks/useOnClickOutside.js +8 -6
package/lib/hooks/useOnClickOutside.js.map +1 -1
package/lib/hooks/useOnWindowResize.js +9 -7
package/lib/hooks/useOnWindowResize.js.map +1 -1
package/lib/hooks/useQuill.js +60 -111
package/lib/hooks/useQuill.js.map +1 -1
package/lib/hooks/useSelectOnKeyDown.js +17 -15
package/lib/hooks/useSelectOnKeyDown.js.map +1 -1
package/lib/index.js +22 -8
package/lib/index.js.map +1 -1
package/package.json +9 -2
package/rollup.config.ts +21 -0
package/src/AddToDashboardModal.tsx +10 -3
package/src/Chart.tsx +66 -195
package/src/Context.tsx +10 -27
package/src/Dashboard.tsx +40 -23
package/src/QuillProvider.tsx +3 -0
package/src/ReportBuilder.tsx +10 -5
package/src/SQLEditor.tsx +9 -4
package/src/Table.tsx +0 -1
package/src/hooks/useQuill.ts +2 -1
package/lib/AddToDashboardButton.d.ts +0 -1
package/lib/AddToDashboardButton.js +0 -2
package/lib/AddToDashboardButton.js.map +0 -1
package/lib/AppContext.d.ts +0 -29
package/lib/AppContext.js +0 -94
package/lib/AppContext.js.map +0 -1
package/lib/Button.d.ts +0 -26
package/lib/Button.js +0 -151
package/lib/Button.js.map +0 -1
package/lib/ContextProvider.d.ts +0 -28
package/lib/ContextProvider.js +0 -93
package/lib/ContextProvider.js.map +0 -1
package/lib/DateRangePicker.d.ts +0 -32
package/lib/DateRangePicker.js +0 -105
package/lib/DateRangePicker.js.map +0 -1
package/lib/Dialog.d.ts +0 -68
package/lib/Dialog.js +0 -407
package/lib/Dialog.js.map +0 -1
package/lib/Portal.d.ts +0 -32
package/lib/Portal.js +0 -171
package/lib/Portal.js.map +0 -1
package/lib/Props.d.ts +0 -0
package/lib/Props.js +0 -2
package/lib/Props.js.map +0 -1
package/lib/components/BigModal/Modal.d.ts +0 -14
package/lib/components/BigModal/Modal.js +0 -109
package/lib/components/BigModal/Modal.js.map +0 -1
package/lib/components/Modal/Dropdown/Dropdown.d.ts +0 -12
package/lib/components/Modal/Dropdown/Dropdown.js +0 -52
package/lib/components/Modal/Dropdown/Dropdown.js.map +0 -1
package/lib/components/Modal/Dropdown/DropdownItem.d.ts +0 -8
package/lib/components/Modal/Dropdown/DropdownItem.js +0 -51
package/lib/components/Modal/Dropdown/DropdownItem.js.map +0 -1
package/lib/components/Modal/Dropdown/index.d.ts +0 -2
package/lib/components/Modal/Dropdown/index.js +0 -3
package/lib/components/Modal/Dropdown/index.js.map +0 -1
package/lib/hooks/useSyncRefs.d.ts +0 -5
package/lib/hooks/useSyncRefs.js +0 -38
package/lib/hooks/useSyncRefs.js.map +0 -1
package/lib/lib/colorClassNames.d.ts +0 -19
package/lib/lib/colorClassNames.js +0 -3175
package/lib/lib/colorClassNames.js.map +0 -1
package/lib/lib/constants.d.ts +0 -16
package/lib/lib/constants.js +0 -47
package/lib/lib/constants.js.map +0 -1
package/lib/lib/font.d.ts +0 -13
package/lib/lib/font.js +0 -14
package/lib/lib/font.js.map +0 -1
package/lib/lib/hexColors.d.ts +0 -3
package/lib/lib/hexColors.js +0 -29
package/lib/lib/hexColors.js.map +0 -1
package/lib/lib/index.d.ts +0 -3
package/lib/lib/index.js +0 -4
package/lib/lib/index.js.map +0 -1
package/lib/lib/inputTypes.d.ts +0 -20
package/lib/lib/inputTypes.js +0 -56
package/lib/lib/inputTypes.js.map +0 -1
package/lib/lib/shape.d.ts +0 -73
package/lib/lib/shape.js +0 -74
package/lib/lib/shape.js.map +0 -1
package/lib/lib/sizing.d.ts +0 -46
package/lib/lib/sizing.js +0 -43
package/lib/lib/sizing.js.map +0 -1
package/lib/lib/spacing.d.ts +0 -264
package/lib/lib/spacing.js +0 -265
package/lib/lib/spacing.js.map +0 -1
package/lib/lib/theme.d.ts +0 -22
package/lib/lib/theme.js +0 -46
package/lib/lib/theme.js.map +0 -1
package/lib/lib/utils.d.ts +0 -9
package/lib/lib/utils.js +0 -40
package/lib/lib/utils.js.map +0 -1
package/lib/styles.css +0 -15795
package/lib/types/Props.d.ts +0 -0
package/lib/types/Props.js +0 -2
package/lib/types/Props.js.map +0 -1
package/lib/types.d.ts +0 -27
package/lib/types.js +0 -6
package/lib/types.js.map +0 -1
package/src/lib/font.ts +0 -14
package/src/lib/index.ts +0 -3
package/src/lib/inputTypes.ts +0 -81
package/src/lib/utils.tsx +0 -46

package/lib/lib/colorClassNames.js DELETED Viewed

@@ -1,3175 +0,0 @@
-export var colorClassNames = {
-    transparent: {
-        500: {
-            bgColor: 'qq-bg-transparent',
-            hoverBgColor: 'hover:qq-bg-transparent',
-            textColor: 'qq-text-transparent',
-            hoverTextColor: 'hover:qq-text-transparent',
-            borderColor: 'qq-border-transparent',
-            hoverBorderColor: 'hover:qq-border-transparent',
-            ringRolor: 'qq-ring-transparent',
-            ringColor: 'qq-ring-transparent',
-            hoverRingColor: 'hover:qq-ring-transparent',
-            divideColor: 'qq-divide-transparent',
-            outlineColor: 'qq-outline-transparent',
-            focusRingColor: 'focus:qq-ring-transparent',
-        },
-    },
-    white: {
-        500: {
-            bgColor: 'qq-bg-white',
-            hoverBgColor: 'hover:qq-bg-white',
-            textColor: 'qq-text-white',
-            hoverTextColor: 'hover:qq-text-white',
-            borderColor: 'qq-border-white',
-            hoverBorderColor: 'hover:qq-border-white',
-            ringRolor: 'qq-ring-white',
-            ringColor: 'qq-ring-white',
-            hoverRingColor: 'hover:qq-ring-white',
-            divideColor: 'qq-divide-white',
-            outlineColor: 'qq-outline-white',
-            focusRingColor: 'focus:qq-ring-white',
-        },
-    },
-    black: {
-        500: {
-            bgColor: 'qq-bg-black',
-            hoverBgColor: 'hover:qq-bg-black',
-            textColor: 'qq-text-black',
-            hoverTextColor: 'hover:qq-text-black',
-            borderColor: 'qq-border-black',
-            hoverBorderColor: 'hover:qq-border-black',
-            ringRolor: 'qq-ring-black',
-            ringColor: 'qq-ring-black',
-            hoverRingColor: 'hover:qq-ring-black',
-            divideColor: 'qq-divide-black',
-            outlineColor: 'qq-outline-black',
-            focusRingColor: 'focus:qq-ring-black',
-        },
-    },
-    slate: {
-        '50': {
-            bgColor: 'qq-bg-slate-50',
-            hoverBgColor: 'hover:qq-bg-slate-50',
-            textColor: 'qq-text-slate-50',
-            hoverTextColor: 'hover:qq-text-slate-50',
-            borderColor: 'qq-border-slate-50',
-            hoverBorderColor: 'hover:qq-border-slate-50',
-            ringRolor: 'qq-ring-slate-50',
-            ringColor: 'qq-ring-slate-50',
-            hoverRingColor: 'hover:qq-ring-slate-50',
-            divideColor: 'qq-divide-slate-50',
-            outlineColor: 'qq-outline-slate-50',
-            focusRingColor: 'focus:qq-ring-slate-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-slate-100',
-            hoverBgColor: 'hover:qq-bg-slate-100',
-            textColor: 'qq-text-slate-100',
-            hoverTextColor: 'hover:qq-text-slate-100',
-            borderColor: 'qq-border-slate-100',
-            hoverBorderColor: 'hover:qq-border-slate-100',
-            ringRolor: 'qq-ring-slate-100',
-            ringColor: 'qq-ring-slate-100',
-            hoverRingColor: 'hover:qq-ring-slate-100',
-            divideColor: 'qq-divide-slate-100',
-            outlineColor: 'qq-outline-slate-100',
-            focusRingColor: 'focus:qq-ring-slate-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-slate-200',
-            hoverBgColor: 'hover:qq-bg-slate-200',
-            textColor: 'qq-text-slate-200',
-            hoverTextColor: 'hover:qq-text-slate-200',
-            borderColor: 'qq-border-slate-200',
-            hoverBorderColor: 'hover:qq-border-slate-200',
-            ringRolor: 'qq-ring-slate-200',
-            ringColor: 'qq-ring-slate-200',
-            hoverRingColor: 'hover:qq-ring-slate-200',
-            divideColor: 'qq-divide-slate-200',
-            outlineColor: 'qq-outline-slate-200',
-            focusRingColor: 'focus:qq-ring-slate-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-slate-300',
-            hoverBgColor: 'hover:qq-bg-slate-300',
-            textColor: 'qq-text-slate-300',
-            hoverTextColor: 'hover:qq-text-slate-300',
-            borderColor: 'qq-border-slate-300',
-            hoverBorderColor: 'hover:qq-border-slate-300',
-            ringRolor: 'qq-ring-slate-300',
-            ringColor: 'qq-ring-slate-300',
-            hoverRingColor: 'hover:qq-ring-slate-300',
-            divideColor: 'qq-divide-slate-300',
-            outlineColor: 'qq-outline-slate-300',
-            focusRingColor: 'focus:qq-ring-slate-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-slate-400',
-            hoverBgColor: 'hover:qq-bg-slate-400',
-            textColor: 'qq-text-slate-400',
-            hoverTextColor: 'hover:qq-text-slate-400',
-            borderColor: 'qq-border-slate-400',
-            hoverBorderColor: 'hover:qq-border-slate-400',
-            ringRolor: 'qq-ring-slate-400',
-            ringColor: 'qq-ring-slate-400',
-            hoverRingColor: 'hover:qq-ring-slate-400',
-            divideColor: 'qq-divide-slate-400',
-            outlineColor: 'qq-outline-slate-400',
-            focusRingColor: 'focus:qq-ring-slate-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-slate-500',
-            hoverBgColor: 'hover:qq-bg-slate-500',
-            textColor: 'qq-text-slate-500',
-            hoverTextColor: 'hover:qq-text-slate-500',
-            borderColor: 'qq-border-slate-500',
-            hoverBorderColor: 'hover:qq-border-slate-500',
-            ringRolor: 'qq-ring-slate-500',
-            ringColor: 'qq-ring-slate-500',
-            hoverRingColor: 'hover:qq-ring-slate-500',
-            divideColor: 'qq-divide-slate-500',
-            outlineColor: 'qq-outline-slate-500',
-            focusRingColor: 'focus:qq-ring-slate-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-slate-600',
-            hoverBgColor: 'hover:qq-bg-slate-600',
-            textColor: 'qq-text-slate-600',
-            hoverTextColor: 'hover:qq-text-slate-600',
-            borderColor: 'qq-border-slate-600',
-            hoverBorderColor: 'hover:qq-border-slate-600',
-            ringRolor: 'qq-ring-slate-600',
-            ringColor: 'qq-ring-slate-600',
-            hoverRingColor: 'hover:qq-ring-slate-600',
-            divideColor: 'qq-divide-slate-600',
-            outlineColor: 'qq-outline-slate-600',
-            focusRingColor: 'focus:qq-ring-slate-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-slate-700',
-            hoverBgColor: 'hover:qq-bg-slate-700',
-            textColor: 'qq-text-slate-700',
-            hoverTextColor: 'hover:qq-text-slate-700',
-            borderColor: 'qq-border-slate-700',
-            hoverBorderColor: 'hover:qq-border-slate-700',
-            ringRolor: 'qq-ring-slate-700',
-            ringColor: 'qq-ring-slate-700',
-            hoverRingColor: 'hover:qq-ring-slate-700',
-            divideColor: 'qq-divide-slate-700',
-            outlineColor: 'qq-outline-slate-700',
-            focusRingColor: 'focus:qq-ring-slate-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-slate-800',
-            hoverBgColor: 'hover:qq-bg-slate-800',
-            textColor: 'qq-text-slate-800',
-            hoverTextColor: 'hover:qq-text-slate-800',
-            borderColor: 'qq-border-slate-800',
-            hoverBorderColor: 'hover:qq-border-slate-800',
-            ringRolor: 'qq-ring-slate-800',
-            ringColor: 'qq-ring-slate-800',
-            hoverRingColor: 'hover:qq-ring-slate-800',
-            divideColor: 'qq-divide-slate-800',
-            outlineColor: 'qq-outline-slate-800',
-            focusRingColor: 'focus:qq-ring-slate-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-slate-900',
-            hoverBgColor: 'hover:qq-bg-slate-900',
-            textColor: 'qq-text-slate-900',
-            hoverTextColor: 'hover:qq-text-slate-900',
-            borderColor: 'qq-border-slate-900',
-            hoverBorderColor: 'hover:qq-border-slate-900',
-            ringRolor: 'qq-ring-slate-900',
-            ringColor: 'qq-ring-slate-900',
-            hoverRingColor: 'hover:qq-ring-slate-900',
-            divideColor: 'qq-divide-slate-900',
-            outlineColor: 'qq-outline-slate-900',
-            focusRingColor: 'focus:qq-ring-slate-900',
-        },
-    },
-    gray: {
-        '50': {
-            bgColor: 'qq-bg-gray-50',
-            hoverBgColor: 'hover:qq-bg-gray-50',
-            textColor: 'qq-text-gray-50',
-            hoverTextColor: 'hover:qq-text-gray-50',
-            borderColor: 'qq-border-gray-50',
-            hoverBorderColor: 'hover:qq-border-gray-50',
-            ringRolor: 'qq-ring-gray-50',
-            ringColor: 'qq-ring-gray-50',
-            hoverRingColor: 'hover:qq-ring-gray-50',
-            divideColor: 'qq-divide-gray-50',
-            outlineColor: 'qq-outline-gray-50',
-            focusRingColor: 'focus:qq-ring-gray-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-gray-100',
-            hoverBgColor: 'hover:qq-bg-gray-100',
-            textColor: 'qq-text-gray-100',
-            hoverTextColor: 'hover:qq-text-gray-100',
-            borderColor: 'qq-border-gray-100',
-            hoverBorderColor: 'hover:qq-border-gray-100',
-            ringRolor: 'qq-ring-gray-100',
-            ringColor: 'qq-ring-gray-100',
-            hoverRingColor: 'hover:qq-ring-gray-100',
-            divideColor: 'qq-divide-gray-100',
-            outlineColor: 'qq-outline-gray-100',
-            focusRingColor: 'focus:qq-ring-gray-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-gray-200',
-            hoverBgColor: 'hover:qq-bg-gray-200',
-            textColor: 'qq-text-gray-200',
-            hoverTextColor: 'hover:qq-text-gray-200',
-            borderColor: 'qq-border-gray-200',
-            hoverBorderColor: 'hover:qq-border-gray-200',
-            ringRolor: 'qq-ring-gray-200',
-            ringColor: 'qq-ring-gray-200',
-            hoverRingColor: 'hover:qq-ring-gray-200',
-            divideColor: 'qq-divide-gray-200',
-            outlineColor: 'qq-outline-gray-200',
-            focusRingColor: 'focus:qq-ring-gray-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-gray-300',
-            hoverBgColor: 'hover:qq-bg-gray-300',
-            textColor: 'qq-text-gray-300',
-            hoverTextColor: 'hover:qq-text-gray-300',
-            borderColor: 'qq-border-gray-300',
-            hoverBorderColor: 'hover:qq-border-gray-300',
-            ringRolor: 'qq-ring-gray-300',
-            ringColor: 'qq-ring-gray-300',
-            hoverRingColor: 'hover:qq-ring-gray-300',
-            divideColor: 'qq-divide-gray-300',
-            outlineColor: 'qq-outline-gray-300',
-            focusRingColor: 'focus:qq-ring-gray-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-gray-400',
-            hoverBgColor: 'hover:qq-bg-gray-400',
-            textColor: 'qq-text-gray-400',
-            hoverTextColor: 'hover:qq-text-gray-400',
-            borderColor: 'qq-border-gray-400',
-            hoverBorderColor: 'hover:qq-border-gray-400',
-            ringRolor: 'qq-ring-gray-400',
-            ringColor: 'qq-ring-gray-400',
-            hoverRingColor: 'hover:qq-ring-gray-400',
-            divideColor: 'qq-divide-gray-400',
-            outlineColor: 'qq-outline-gray-400',
-            focusRingColor: 'focus:qq-ring-gray-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-gray-500',
-            hoverBgColor: 'hover:qq-bg-gray-500',
-            textColor: 'qq-text-gray-500',
-            hoverTextColor: 'hover:qq-text-gray-500',
-            borderColor: 'qq-border-gray-500',
-            hoverBorderColor: 'hover:qq-border-gray-500',
-            ringRolor: 'qq-ring-gray-500',
-            ringColor: 'qq-ring-gray-500',
-            hoverRingColor: 'hover:qq-ring-gray-500',
-            divideColor: 'qq-divide-gray-500',
-            outlineColor: 'qq-outline-gray-500',
-            focusRingColor: 'focus:qq-ring-gray-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-gray-600',
-            hoverBgColor: 'hover:qq-bg-gray-600',
-            textColor: 'qq-text-gray-600',
-            hoverTextColor: 'hover:qq-text-gray-600',
-            borderColor: 'qq-border-gray-600',
-            hoverBorderColor: 'hover:qq-border-gray-600',
-            ringRolor: 'qq-ring-gray-600',
-            ringColor: 'qq-ring-gray-600',
-            hoverRingColor: 'hover:qq-ring-gray-600',
-            divideColor: 'qq-divide-gray-600',
-            outlineColor: 'qq-outline-gray-600',
-            focusRingColor: 'focus:qq-ring-gray-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-gray-700',
-            hoverBgColor: 'hover:qq-bg-gray-700',
-            textColor: 'qq-text-gray-700',
-            hoverTextColor: 'hover:qq-text-gray-700',
-            borderColor: 'qq-border-gray-700',
-            hoverBorderColor: 'hover:qq-border-gray-700',
-            ringRolor: 'qq-ring-gray-700',
-            ringColor: 'qq-ring-gray-700',
-            hoverRingColor: 'hover:qq-ring-gray-700',
-            divideColor: 'qq-divide-gray-700',
-            outlineColor: 'qq-outline-gray-700',
-            focusRingColor: 'focus:qq-ring-gray-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-gray-800',
-            hoverBgColor: 'hover:qq-bg-gray-800',
-            textColor: 'qq-text-gray-800',
-            hoverTextColor: 'hover:qq-text-gray-800',
-            borderColor: 'qq-border-gray-800',
-            hoverBorderColor: 'hover:qq-border-gray-800',
-            ringRolor: 'qq-ring-gray-800',
-            ringColor: 'qq-ring-gray-800',
-            hoverRingColor: 'hover:qq-ring-gray-800',
-            divideColor: 'qq-divide-gray-800',
-            outlineColor: 'qq-outline-gray-800',
-            focusRingColor: 'focus:qq-ring-gray-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-gray-900',
-            hoverBgColor: 'hover:qq-bg-gray-900',
-            textColor: 'qq-text-gray-900',
-            hoverTextColor: 'hover:qq-text-gray-900',
-            borderColor: 'qq-border-gray-900',
-            hoverBorderColor: 'hover:qq-border-gray-900',
-            ringRolor: 'qq-ring-gray-900',
-            ringColor: 'qq-ring-gray-900',
-            hoverRingColor: 'hover:qq-ring-gray-900',
-            divideColor: 'qq-divide-gray-900',
-            outlineColor: 'qq-outline-gray-900',
-            focusRingColor: 'focus:qq-ring-gray-900',
-        },
-    },
-    zinc: {
-        '50': {
-            bgColor: 'qq-bg-zinc-50',
-            hoverBgColor: 'hover:qq-bg-zinc-50',
-            textColor: 'qq-text-zinc-50',
-            hoverTextColor: 'hover:qq-text-zinc-50',
-            borderColor: 'qq-border-zinc-50',
-            hoverBorderColor: 'hover:qq-border-zinc-50',
-            ringRolor: 'qq-ring-zinc-50',
-            ringColor: 'qq-ring-zinc-50',
-            hoverRingColor: 'hover:qq-ring-zinc-50',
-            divideColor: 'qq-divide-zinc-50',
-            outlineColor: 'qq-outline-zinc-50',
-            focusRingColor: 'focus:qq-ring-zinc-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-zinc-100',
-            hoverBgColor: 'hover:qq-bg-zinc-100',
-            textColor: 'qq-text-zinc-100',
-            hoverTextColor: 'hover:qq-text-zinc-100',
-            borderColor: 'qq-border-zinc-100',
-            hoverBorderColor: 'hover:qq-border-zinc-100',
-            ringRolor: 'qq-ring-zinc-100',
-            ringColor: 'qq-ring-zinc-100',
-            hoverRingColor: 'hover:qq-ring-zinc-100',
-            divideColor: 'qq-divide-zinc-100',
-            outlineColor: 'qq-outline-zinc-100',
-            focusRingColor: 'focus:qq-ring-zinc-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-zinc-200',
-            hoverBgColor: 'hover:qq-bg-zinc-200',
-            textColor: 'qq-text-zinc-200',
-            hoverTextColor: 'hover:qq-text-zinc-200',
-            borderColor: 'qq-border-zinc-200',
-            hoverBorderColor: 'hover:qq-border-zinc-200',
-            ringRolor: 'qq-ring-zinc-200',
-            ringColor: 'qq-ring-zinc-200',
-            hoverRingColor: 'hover:qq-ring-zinc-200',
-            divideColor: 'qq-divide-zinc-200',
-            outlineColor: 'qq-outline-zinc-200',
-            focusRingColor: 'focus:qq-ring-zinc-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-zinc-300',
-            hoverBgColor: 'hover:qq-bg-zinc-300',
-            textColor: 'qq-text-zinc-300',
-            hoverTextColor: 'hover:qq-text-zinc-300',
-            borderColor: 'qq-border-zinc-300',
-            hoverBorderColor: 'hover:qq-border-zinc-300',
-            ringRolor: 'qq-ring-zinc-300',
-            ringColor: 'qq-ring-zinc-300',
-            hoverRingColor: 'hover:qq-ring-zinc-300',
-            divideColor: 'qq-divide-zinc-300',
-            outlineColor: 'qq-outline-zinc-300',
-            focusRingColor: 'focus:qq-ring-zinc-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-zinc-400',
-            hoverBgColor: 'hover:qq-bg-zinc-400',
-            textColor: 'qq-text-zinc-400',
-            hoverTextColor: 'hover:qq-text-zinc-400',
-            borderColor: 'qq-border-zinc-400',
-            hoverBorderColor: 'hover:qq-border-zinc-400',
-            ringRolor: 'qq-ring-zinc-400',
-            ringColor: 'qq-ring-zinc-400',
-            hoverRingColor: 'hover:qq-ring-zinc-400',
-            divideColor: 'qq-divide-zinc-400',
-            outlineColor: 'qq-outline-zinc-400',
-            focusRingColor: 'focus:qq-ring-zinc-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-zinc-500',
-            hoverBgColor: 'hover:qq-bg-zinc-500',
-            textColor: 'qq-text-zinc-500',
-            hoverTextColor: 'hover:qq-text-zinc-500',
-            borderColor: 'qq-border-zinc-500',
-            hoverBorderColor: 'hover:qq-border-zinc-500',
-            ringRolor: 'qq-ring-zinc-500',
-            ringColor: 'qq-ring-zinc-500',
-            hoverRingColor: 'hover:qq-ring-zinc-500',
-            divideColor: 'qq-divide-zinc-500',
-            outlineColor: 'qq-outline-zinc-500',
-            focusRingColor: 'focus:qq-ring-zinc-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-zinc-600',
-            hoverBgColor: 'hover:qq-bg-zinc-600',
-            textColor: 'qq-text-zinc-600',
-            hoverTextColor: 'hover:qq-text-zinc-600',
-            borderColor: 'qq-border-zinc-600',
-            hoverBorderColor: 'hover:qq-border-zinc-600',
-            ringRolor: 'qq-ring-zinc-600',
-            ringColor: 'qq-ring-zinc-600',
-            hoverRingColor: 'hover:qq-ring-zinc-600',
-            divideColor: 'qq-divide-zinc-600',
-            outlineColor: 'qq-outline-zinc-600',
-            focusRingColor: 'focus:qq-ring-zinc-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-zinc-700',
-            hoverBgColor: 'hover:qq-bg-zinc-700',
-            textColor: 'qq-text-zinc-700',
-            hoverTextColor: 'hover:qq-text-zinc-700',
-            borderColor: 'qq-border-zinc-700',
-            hoverBorderColor: 'hover:qq-border-zinc-700',
-            ringRolor: 'qq-ring-zinc-700',
-            ringColor: 'qq-ring-zinc-700',
-            hoverRingColor: 'hover:qq-ring-zinc-700',
-            divideColor: 'qq-divide-zinc-700',
-            outlineColor: 'qq-outline-zinc-700',
-            focusRingColor: 'focus:qq-ring-zinc-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-zinc-800',
-            hoverBgColor: 'hover:qq-bg-zinc-800',
-            textColor: 'qq-text-zinc-800',
-            hoverTextColor: 'hover:qq-text-zinc-800',
-            borderColor: 'qq-border-zinc-800',
-            hoverBorderColor: 'hover:qq-border-zinc-800',
-            ringRolor: 'qq-ring-zinc-800',
-            ringColor: 'qq-ring-zinc-800',
-            hoverRingColor: 'hover:qq-ring-zinc-800',
-            divideColor: 'qq-divide-zinc-800',
-            outlineColor: 'qq-outline-zinc-800',
-            focusRingColor: 'focus:qq-ring-zinc-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-zinc-900',
-            hoverBgColor: 'hover:qq-bg-zinc-900',
-            textColor: 'qq-text-zinc-900',
-            hoverTextColor: 'hover:qq-text-zinc-900',
-            borderColor: 'qq-border-zinc-900',
-            hoverBorderColor: 'hover:qq-border-zinc-900',
-            ringRolor: 'qq-ring-zinc-900',
-            ringColor: 'qq-ring-zinc-900',
-            hoverRingColor: 'hover:qq-ring-zinc-900',
-            divideColor: 'qq-divide-zinc-900',
-            outlineColor: 'qq-outline-zinc-900',
-            focusRingColor: 'focus:qq-ring-zinc-900',
-        },
-    },
-    neutral: {
-        '50': {
-            bgColor: 'qq-bg-neutral-50',
-            hoverBgColor: 'hover:qq-bg-neutral-50',
-            textColor: 'qq-text-neutral-50',
-            hoverTextColor: 'hover:qq-text-neutral-50',
-            borderColor: 'qq-border-neutral-50',
-            hoverBorderColor: 'hover:qq-border-neutral-50',
-            ringRolor: 'qq-ring-neutral-50',
-            ringColor: 'qq-ring-neutral-50',
-            hoverRingColor: 'hover:qq-ring-neutral-50',
-            divideColor: 'qq-divide-neutral-50',
-            outlineColor: 'qq-outline-neutral-50',
-            focusRingColor: 'focus:qq-ring-neutral-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-neutral-100',
-            hoverBgColor: 'hover:qq-bg-neutral-100',
-            textColor: 'qq-text-neutral-100',
-            hoverTextColor: 'hover:qq-text-neutral-100',
-            borderColor: 'qq-border-neutral-100',
-            hoverBorderColor: 'hover:qq-border-neutral-100',
-            ringRolor: 'qq-ring-neutral-100',
-            ringColor: 'qq-ring-neutral-100',
-            hoverRingColor: 'hover:qq-ring-neutral-100',
-            divideColor: 'qq-divide-neutral-100',
-            outlineColor: 'qq-outline-neutral-100',
-            focusRingColor: 'focus:qq-ring-neutral-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-neutral-200',
-            hoverBgColor: 'hover:qq-bg-neutral-200',
-            textColor: 'qq-text-neutral-200',
-            hoverTextColor: 'hover:qq-text-neutral-200',
-            borderColor: 'qq-border-neutral-200',
-            hoverBorderColor: 'hover:qq-border-neutral-200',
-            ringRolor: 'qq-ring-neutral-200',
-            ringColor: 'qq-ring-neutral-200',
-            hoverRingColor: 'hover:qq-ring-neutral-200',
-            divideColor: 'qq-divide-neutral-200',
-            outlineColor: 'qq-outline-neutral-200',
-            focusRingColor: 'focus:qq-ring-neutral-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-neutral-300',
-            hoverBgColor: 'hover:qq-bg-neutral-300',
-            textColor: 'qq-text-neutral-300',
-            hoverTextColor: 'hover:qq-text-neutral-300',
-            borderColor: 'qq-border-neutral-300',
-            hoverBorderColor: 'hover:qq-border-neutral-300',
-            ringRolor: 'qq-ring-neutral-300',
-            ringColor: 'qq-ring-neutral-300',
-            hoverRingColor: 'hover:qq-ring-neutral-300',
-            divideColor: 'qq-divide-neutral-300',
-            outlineColor: 'qq-outline-neutral-300',
-            focusRingColor: 'focus:qq-ring-neutral-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-neutral-400',
-            hoverBgColor: 'hover:qq-bg-neutral-400',
-            textColor: 'qq-text-neutral-400',
-            hoverTextColor: 'hover:qq-text-neutral-400',
-            borderColor: 'qq-border-neutral-400',
-            hoverBorderColor: 'hover:qq-border-neutral-400',
-            ringRolor: 'qq-ring-neutral-400',
-            ringColor: 'qq-ring-neutral-400',
-            hoverRingColor: 'hover:qq-ring-neutral-400',
-            divideColor: 'qq-divide-neutral-400',
-            outlineColor: 'qq-outline-neutral-400',
-            focusRingColor: 'focus:qq-ring-neutral-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-neutral-500',
-            hoverBgColor: 'hover:qq-bg-neutral-500',
-            textColor: 'qq-text-neutral-500',
-            hoverTextColor: 'hover:qq-text-neutral-500',
-            borderColor: 'qq-border-neutral-500',
-            hoverBorderColor: 'hover:qq-border-neutral-500',
-            ringRolor: 'qq-ring-neutral-500',
-            ringColor: 'qq-ring-neutral-500',
-            hoverRingColor: 'hover:qq-ring-neutral-500',
-            divideColor: 'qq-divide-neutral-500',
-            outlineColor: 'qq-outline-neutral-500',
-            focusRingColor: 'focus:qq-ring-neutral-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-neutral-600',
-            hoverBgColor: 'hover:qq-bg-neutral-600',
-            textColor: 'qq-text-neutral-600',
-            hoverTextColor: 'hover:qq-text-neutral-600',
-            borderColor: 'qq-border-neutral-600',
-            hoverBorderColor: 'hover:qq-border-neutral-600',
-            ringRolor: 'qq-ring-neutral-600',
-            ringColor: 'qq-ring-neutral-600',
-            hoverRingColor: 'hover:qq-ring-neutral-600',
-            divideColor: 'qq-divide-neutral-600',
-            outlineColor: 'qq-outline-neutral-600',
-            focusRingColor: 'focus:qq-ring-neutral-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-neutral-700',
-            hoverBgColor: 'hover:qq-bg-neutral-700',
-            textColor: 'qq-text-neutral-700',
-            hoverTextColor: 'hover:qq-text-neutral-700',
-            borderColor: 'qq-border-neutral-700',
-            hoverBorderColor: 'hover:qq-border-neutral-700',
-            ringRolor: 'qq-ring-neutral-700',
-            ringColor: 'qq-ring-neutral-700',
-            hoverRingColor: 'hover:qq-ring-neutral-700',
-            divideColor: 'qq-divide-neutral-700',
-            outlineColor: 'qq-outline-neutral-700',
-            focusRingColor: 'focus:qq-ring-neutral-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-neutral-800',
-            hoverBgColor: 'hover:qq-bg-neutral-800',
-            textColor: 'qq-text-neutral-800',
-            hoverTextColor: 'hover:qq-text-neutral-800',
-            borderColor: 'qq-border-neutral-800',
-            hoverBorderColor: 'hover:qq-border-neutral-800',
-            ringRolor: 'qq-ring-neutral-800',
-            ringColor: 'qq-ring-neutral-800',
-            hoverRingColor: 'hover:qq-ring-neutral-800',
-            divideColor: 'qq-divide-neutral-800',
-            outlineColor: 'qq-outline-neutral-800',
-            focusRingColor: 'focus:qq-ring-neutral-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-neutral-900',
-            hoverBgColor: 'hover:qq-bg-neutral-900',
-            textColor: 'qq-text-neutral-900',
-            hoverTextColor: 'hover:qq-text-neutral-900',
-            borderColor: 'qq-border-neutral-900',
-            hoverBorderColor: 'hover:qq-border-neutral-900',
-            ringRolor: 'qq-ring-neutral-900',
-            ringColor: 'qq-ring-neutral-900',
-            hoverRingColor: 'hover:qq-ring-neutral-900',
-            divideColor: 'qq-divide-neutral-900',
-            outlineColor: 'qq-outline-neutral-900',
-            focusRingColor: 'focus:qq-ring-neutral-900',
-        },
-    },
-    stone: {
-        '50': {
-            bgColor: 'qq-bg-stone-50',
-            hoverBgColor: 'hover:qq-bg-stone-50',
-            textColor: 'qq-text-stone-50',
-            hoverTextColor: 'hover:qq-text-stone-50',
-            borderColor: 'qq-border-stone-50',
-            hoverBorderColor: 'hover:qq-border-stone-50',
-            ringRolor: 'qq-ring-stone-50',
-            ringColor: 'qq-ring-stone-50',
-            hoverRingColor: 'hover:qq-ring-stone-50',
-            divideColor: 'qq-divide-stone-50',
-            outlineColor: 'qq-outline-stone-50',
-            focusRingColor: 'focus:qq-ring-stone-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-stone-100',
-            hoverBgColor: 'hover:qq-bg-stone-100',
-            textColor: 'qq-text-stone-100',
-            hoverTextColor: 'hover:qq-text-stone-100',
-            borderColor: 'qq-border-stone-100',
-            hoverBorderColor: 'hover:qq-border-stone-100',
-            ringRolor: 'qq-ring-stone-100',
-            ringColor: 'qq-ring-stone-100',
-            hoverRingColor: 'hover:qq-ring-stone-100',
-            divideColor: 'qq-divide-stone-100',
-            outlineColor: 'qq-outline-stone-100',
-            focusRingColor: 'focus:qq-ring-stone-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-stone-200',
-            hoverBgColor: 'hover:qq-bg-stone-200',
-            textColor: 'qq-text-stone-200',
-            hoverTextColor: 'hover:qq-text-stone-200',
-            borderColor: 'qq-border-stone-200',
-            hoverBorderColor: 'hover:qq-border-stone-200',
-            ringRolor: 'qq-ring-stone-200',
-            ringColor: 'qq-ring-stone-200',
-            hoverRingColor: 'hover:qq-ring-stone-200',
-            divideColor: 'qq-divide-stone-200',
-            outlineColor: 'qq-outline-stone-200',
-            focusRingColor: 'focus:qq-ring-stone-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-stone-300',
-            hoverBgColor: 'hover:qq-bg-stone-300',
-            textColor: 'qq-text-stone-300',
-            hoverTextColor: 'hover:qq-text-stone-300',
-            borderColor: 'qq-border-stone-300',
-            hoverBorderColor: 'hover:qq-border-stone-300',
-            ringRolor: 'qq-ring-stone-300',
-            ringColor: 'qq-ring-stone-300',
-            hoverRingColor: 'hover:qq-ring-stone-300',
-            divideColor: 'qq-divide-stone-300',
-            outlineColor: 'qq-outline-stone-300',
-            focusRingColor: 'focus:qq-ring-stone-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-stone-400',
-            hoverBgColor: 'hover:qq-bg-stone-400',
-            textColor: 'qq-text-stone-400',
-            hoverTextColor: 'hover:qq-text-stone-400',
-            borderColor: 'qq-border-stone-400',
-            hoverBorderColor: 'hover:qq-border-stone-400',
-            ringRolor: 'qq-ring-stone-400',
-            ringColor: 'qq-ring-stone-400',
-            hoverRingColor: 'hover:qq-ring-stone-400',
-            divideColor: 'qq-divide-stone-400',
-            outlineColor: 'qq-outline-stone-400',
-            focusRingColor: 'focus:qq-ring-stone-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-stone-500',
-            hoverBgColor: 'hover:qq-bg-stone-500',
-            textColor: 'qq-text-stone-500',
-            hoverTextColor: 'hover:qq-text-stone-500',
-            borderColor: 'qq-border-stone-500',
-            hoverBorderColor: 'hover:qq-border-stone-500',
-            ringRolor: 'qq-ring-stone-500',
-            ringColor: 'qq-ring-stone-500',
-            hoverRingColor: 'hover:qq-ring-stone-500',
-            divideColor: 'qq-divide-stone-500',
-            outlineColor: 'qq-outline-stone-500',
-            focusRingColor: 'focus:qq-ring-stone-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-stone-600',
-            hoverBgColor: 'hover:qq-bg-stone-600',
-            textColor: 'qq-text-stone-600',
-            hoverTextColor: 'hover:qq-text-stone-600',
-            borderColor: 'qq-border-stone-600',
-            hoverBorderColor: 'hover:qq-border-stone-600',
-            ringRolor: 'qq-ring-stone-600',
-            ringColor: 'qq-ring-stone-600',
-            hoverRingColor: 'hover:qq-ring-stone-600',
-            divideColor: 'qq-divide-stone-600',
-            outlineColor: 'qq-outline-stone-600',
-            focusRingColor: 'focus:qq-ring-stone-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-stone-700',
-            hoverBgColor: 'hover:qq-bg-stone-700',
-            textColor: 'qq-text-stone-700',
-            hoverTextColor: 'hover:qq-text-stone-700',
-            borderColor: 'qq-border-stone-700',
-            hoverBorderColor: 'hover:qq-border-stone-700',
-            ringRolor: 'qq-ring-stone-700',
-            ringColor: 'qq-ring-stone-700',
-            hoverRingColor: 'hover:qq-ring-stone-700',
-            divideColor: 'qq-divide-stone-700',
-            outlineColor: 'qq-outline-stone-700',
-            focusRingColor: 'focus:qq-ring-stone-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-stone-800',
-            hoverBgColor: 'hover:qq-bg-stone-800',
-            textColor: 'qq-text-stone-800',
-            hoverTextColor: 'hover:qq-text-stone-800',
-            borderColor: 'qq-border-stone-800',
-            hoverBorderColor: 'hover:qq-border-stone-800',
-            ringRolor: 'qq-ring-stone-800',
-            ringColor: 'qq-ring-stone-800',
-            hoverRingColor: 'hover:qq-ring-stone-800',
-            divideColor: 'qq-divide-stone-800',
-            outlineColor: 'qq-outline-stone-800',
-            focusRingColor: 'focus:qq-ring-stone-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-stone-900',
-            hoverBgColor: 'hover:qq-bg-stone-900',
-            textColor: 'qq-text-stone-900',
-            hoverTextColor: 'hover:qq-text-stone-900',
-            borderColor: 'qq-border-stone-900',
-            hoverBorderColor: 'hover:qq-border-stone-900',
-            ringRolor: 'qq-ring-stone-900',
-            ringColor: 'qq-ring-stone-900',
-            hoverRingColor: 'hover:qq-ring-stone-900',
-            divideColor: 'qq-divide-stone-900',
-            outlineColor: 'qq-outline-stone-900',
-            focusRingColor: 'focus:qq-ring-stone-900',
-        },
-    },
-    red: {
-        '50': {
-            bgColor: 'qq-bg-red-50',
-            hoverBgColor: 'hover:qq-bg-red-50',
-            textColor: 'qq-text-red-50',
-            hoverTextColor: 'hover:qq-text-red-50',
-            borderColor: 'qq-border-red-50',
-            hoverBorderColor: 'hover:qq-border-red-50',
-            ringRolor: 'qq-ring-red-50',
-            ringColor: 'qq-ring-red-50',
-            hoverRingColor: 'hover:qq-ring-red-50',
-            divideColor: 'qq-divide-red-50',
-            outlineColor: 'qq-outline-red-50',
-            focusRingColor: 'focus:qq-ring-red-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-red-100',
-            hoverBgColor: 'hover:qq-bg-red-100',
-            textColor: 'qq-text-red-100',
-            hoverTextColor: 'hover:qq-text-red-100',
-            borderColor: 'qq-border-red-100',
-            hoverBorderColor: 'hover:qq-border-red-100',
-            ringRolor: 'qq-ring-red-100',
-            ringColor: 'qq-ring-red-100',
-            hoverRingColor: 'hover:qq-ring-red-100',
-            divideColor: 'qq-divide-red-100',
-            outlineColor: 'qq-outline-red-100',
-            focusRingColor: 'focus:qq-ring-red-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-red-200',
-            hoverBgColor: 'hover:qq-bg-red-200',
-            textColor: 'qq-text-red-200',
-            hoverTextColor: 'hover:qq-text-red-200',
-            borderColor: 'qq-border-red-200',
-            hoverBorderColor: 'hover:qq-border-red-200',
-            ringRolor: 'qq-ring-red-200',
-            ringColor: 'qq-ring-red-200',
-            hoverRingColor: 'hover:qq-ring-red-200',
-            divideColor: 'qq-divide-red-200',
-            outlineColor: 'qq-outline-red-200',
-            focusRingColor: 'focus:qq-ring-red-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-red-300',
-            hoverBgColor: 'hover:qq-bg-red-300',
-            textColor: 'qq-text-red-300',
-            hoverTextColor: 'hover:qq-text-red-300',
-            borderColor: 'qq-border-red-300',
-            hoverBorderColor: 'hover:qq-border-red-300',
-            ringRolor: 'qq-ring-red-300',
-            ringColor: 'qq-ring-red-300',
-            hoverRingColor: 'hover:qq-ring-red-300',
-            divideColor: 'qq-divide-red-300',
-            outlineColor: 'qq-outline-red-300',
-            focusRingColor: 'focus:qq-ring-red-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-red-400',
-            hoverBgColor: 'hover:qq-bg-red-400',
-            textColor: 'qq-text-red-400',
-            hoverTextColor: 'hover:qq-text-red-400',
-            borderColor: 'qq-border-red-400',
-            hoverBorderColor: 'hover:qq-border-red-400',
-            ringColor: 'qq-ring-red-400',
-            ringRolor: 'qq-ring-red-400',
-            hoverRingColor: 'hover:qq-ring-red-400',
-            divideColor: 'qq-divide-red-400',
-            outlineColor: 'qq-outline-red-400',
-            focusRingColor: 'focus:qq-ring-red-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-red-500',
-            hoverBgColor: 'hover:qq-bg-red-500',
-            textColor: 'qq-text-red-500',
-            hoverTextColor: 'hover:qq-text-red-500',
-            borderColor: 'qq-border-red-500',
-            hoverBorderColor: 'hover:qq-border-red-500',
-            ringColor: 'qq-ring-red-500',
-            ringRolor: 'qq-ring-red-500',
-            hoverRingColor: 'hover:qq-ring-red-500',
-            divideColor: 'qq-divide-red-500',
-            outlineColor: 'qq-outline-red-500',
-            focusRingColor: 'focus:qq-ring-red-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-red-600',
-            hoverBgColor: 'hover:qq-bg-red-600',
-            textColor: 'qq-text-red-600',
-            hoverTextColor: 'hover:qq-text-red-600',
-            borderColor: 'qq-border-red-600',
-            hoverBorderColor: 'hover:qq-border-red-600',
-            ringColor: 'qq-ring-red-600',
-            ringRolor: 'qq-ring-red-600',
-            hoverRingColor: 'hover:qq-ring-red-600',
-            divideColor: 'qq-divide-red-600',
-            outlineColor: 'qq-outline-red-600',
-            focusRingColor: 'focus:qq-ring-red-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-red-700',
-            hoverBgColor: 'hover:qq-bg-red-700',
-            textColor: 'qq-text-red-700',
-            hoverTextColor: 'hover:qq-text-red-700',
-            borderColor: 'qq-border-red-700',
-            hoverBorderColor: 'hover:qq-border-red-700',
-            ringColor: 'qq-ring-red-700',
-            ringRolor: 'qq-ring-red-700',
-            hoverRingColor: 'hover:qq-ring-red-700',
-            divideColor: 'qq-divide-red-700',
-            outlineColor: 'qq-outline-red-700',
-            focusRingColor: 'focus:qq-ring-red-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-red-800',
-            hoverBgColor: 'hover:qq-bg-red-800',
-            textColor: 'qq-text-red-800',
-            hoverTextColor: 'hover:qq-text-red-800',
-            borderColor: 'qq-border-red-800',
-            hoverBorderColor: 'hover:qq-border-red-800',
-            ringRolor: 'qq-ring-red-800',
-            ringColor: 'qq-ring-red-800',
-            hoverRingColor: 'hover:qq-ring-red-800',
-            divideColor: 'qq-divide-red-800',
-            outlineColor: 'qq-outline-red-800',
-            focusRingColor: 'focus:qq-ring-red-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-red-900',
-            hoverBgColor: 'hover:qq-bg-red-900',
-            textColor: 'qq-text-red-900',
-            hoverTextColor: 'hover:qq-text-red-900',
-            borderColor: 'qq-border-red-900',
-            hoverBorderColor: 'hover:qq-border-red-900',
-            ringRolor: 'qq-ring-red-900',
-            ringColor: 'qq-ring-red-900',
-            hoverRingColor: 'hover:qq-ring-red-900',
-            divideColor: 'qq-divide-red-900',
-            outlineColor: 'qq-outline-red-900',
-            focusRingColor: 'focus:qq-ring-red-900',
-        },
-    },
-    orange: {
-        '50': {
-            bgColor: 'qq-bg-orange-50',
-            hoverBgColor: 'hover:qq-bg-orange-50',
-            textColor: 'qq-text-orange-50',
-            hoverTextColor: 'hover:qq-text-orange-50',
-            borderColor: 'qq-border-orange-50',
-            hoverBorderColor: 'hover:qq-border-orange-50',
-            ringColor: 'qq-ring-orange-50',
-            ringRolor: 'qq-ring-orange-50',
-            hoverRingColor: 'hover:qq-ring-orange-50',
-            divideColor: 'qq-divide-orange-50',
-            outlineColor: 'qq-outline-orange-50',
-            focusRingColor: 'focus:qq-ring-orange-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-orange-100',
-            hoverBgColor: 'hover:qq-bg-orange-100',
-            textColor: 'qq-text-orange-100',
-            hoverTextColor: 'hover:qq-text-orange-100',
-            borderColor: 'qq-border-orange-100',
-            hoverBorderColor: 'hover:qq-border-orange-100',
-            ringColor: 'qq-ring-orange-100',
-            ringRolor: 'qq-ring-orange-100',
-            hoverRingColor: 'hover:qq-ring-orange-100',
-            divideColor: 'qq-divide-orange-100',
-            outlineColor: 'qq-outline-orange-100',
-            focusRingColor: 'focus:qq-ring-orange-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-orange-200',
-            hoverBgColor: 'hover:qq-bg-orange-200',
-            textColor: 'qq-text-orange-200',
-            hoverTextColor: 'hover:qq-text-orange-200',
-            borderColor: 'qq-border-orange-200',
-            hoverBorderColor: 'hover:qq-border-orange-200',
-            ringColor: 'qq-ring-orange-200',
-            ringRolor: 'qq-ring-orange-200',
-            hoverRingColor: 'hover:qq-ring-orange-200',
-            divideColor: 'qq-divide-orange-200',
-            outlineColor: 'qq-outline-orange-200',
-            focusRingColor: 'focus:qq-ring-orange-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-orange-300',
-            hoverBgColor: 'hover:qq-bg-orange-300',
-            textColor: 'qq-text-orange-300',
-            hoverTextColor: 'hover:qq-text-orange-300',
-            borderColor: 'qq-border-orange-300',
-            hoverBorderColor: 'hover:qq-border-orange-300',
-            ringColor: 'qq-ring-orange-300',
-            ringRolor: 'qq-ring-orange-300',
-            hoverRingColor: 'hover:qq-ring-orange-300',
-            divideColor: 'qq-divide-orange-300',
-            outlineColor: 'qq-outline-orange-300',
-            focusRingColor: 'focus:qq-ring-orange-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-orange-400',
-            hoverBgColor: 'hover:qq-bg-orange-400',
-            textColor: 'qq-text-orange-400',
-            hoverTextColor: 'hover:qq-text-orange-400',
-            borderColor: 'qq-border-orange-400',
-            hoverBorderColor: 'hover:qq-border-orange-400',
-            ringColor: 'qq-ring-orange-400',
-            ringRolor: 'qq-ring-orange-400',
-            hoverRingColor: 'hover:qq-ring-orange-400',
-            divideColor: 'qq-divide-orange-400',
-            outlineColor: 'qq-outline-orange-400',
-            focusRingColor: 'focus:qq-ring-orange-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-orange-500',
-            hoverBgColor: 'hover:qq-bg-orange-500',
-            textColor: 'qq-text-orange-500',
-            hoverTextColor: 'hover:qq-text-orange-500',
-            borderColor: 'qq-border-orange-500',
-            hoverBorderColor: 'hover:qq-border-orange-500',
-            ringColor: 'qq-ring-orange-500',
-            ringRolor: 'qq-ring-orange-500',
-            hoverRingColor: 'hover:qq-ring-orange-500',
-            divideColor: 'qq-divide-orange-500',
-            outlineColor: 'qq-outline-orange-500',
-            focusRingColor: 'focus:qq-ring-orange-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-orange-600',
-            hoverBgColor: 'hover:qq-bg-orange-600',
-            textColor: 'qq-text-orange-600',
-            hoverTextColor: 'hover:qq-text-orange-600',
-            borderColor: 'qq-border-orange-600',
-            hoverBorderColor: 'hover:qq-border-orange-600',
-            ringColor: 'qq-ring-orange-600',
-            ringRolor: 'qq-ring-orange-600',
-            hoverRingColor: 'hover:qq-ring-orange-600',
-            divideColor: 'qq-divide-orange-600',
-            outlineColor: 'qq-outline-orange-600',
-            focusRingColor: 'focus:qq-ring-orange-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-orange-700',
-            hoverBgColor: 'hover:qq-bg-orange-700',
-            textColor: 'qq-text-orange-700',
-            hoverTextColor: 'hover:qq-text-orange-700',
-            borderColor: 'qq-border-orange-700',
-            hoverBorderColor: 'hover:qq-border-orange-700',
-            ringColor: 'qq-ring-orange-700',
-            ringRolor: 'qq-ring-orange-700',
-            hoverRingColor: 'hover:qq-ring-orange-700',
-            divideColor: 'qq-divide-orange-700',
-            outlineColor: 'qq-outline-orange-700',
-            focusRingColor: 'focus:qq-ring-orange-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-orange-800',
-            hoverBgColor: 'hover:qq-bg-orange-800',
-            textColor: 'qq-text-orange-800',
-            hoverTextColor: 'hover:qq-text-orange-800',
-            borderColor: 'qq-border-orange-800',
-            hoverBorderColor: 'hover:qq-border-orange-800',
-            ringColor: 'qq-ring-orange-800',
-            ringRolor: 'qq-ring-orange-800',
-            hoverRingColor: 'hover:qq-ring-orange-800',
-            divideColor: 'qq-divide-orange-800',
-            outlineColor: 'qq-outline-orange-800',
-            focusRingColor: 'focus:qq-ring-orange-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-orange-900',
-            hoverBgColor: 'hover:qq-bg-orange-900',
-            textColor: 'qq-text-orange-900',
-            hoverTextColor: 'hover:qq-text-orange-900',
-            borderColor: 'qq-border-orange-900',
-            hoverBorderColor: 'hover:qq-border-orange-900',
-            ringColor: 'qq-ring-orange-900',
-            ringRolor: 'qq-ring-orange-900',
-            hoverRingColor: 'hover:qq-ring-orange-900',
-            divideColor: 'qq-divide-orange-900',
-            outlineColor: 'qq-outline-orange-900',
-            focusRingColor: 'focus:qq-ring-orange-900',
-        },
-    },
-    amber: {
-        '50': {
-            bgColor: 'qq-bg-amber-50',
-            hoverBgColor: 'hover:qq-bg-amber-50',
-            textColor: 'qq-text-amber-50',
-            hoverTextColor: 'hover:qq-text-amber-50',
-            borderColor: 'qq-border-amber-50',
-            hoverBorderColor: 'hover:qq-border-amber-50',
-            ringColor: 'qq-ring-amber-50',
-            ringRolor: 'qq-ring-amber-50',
-            hoverRingColor: 'hover:qq-ring-amber-50',
-            divideColor: 'qq-divide-amber-50',
-            outlineColor: 'qq-outline-amber-50',
-            focusRingColor: 'focus:qq-ring-amber-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-amber-100',
-            hoverBgColor: 'hover:qq-bg-amber-100',
-            textColor: 'qq-text-amber-100',
-            hoverTextColor: 'hover:qq-text-amber-100',
-            borderColor: 'qq-border-amber-100',
-            hoverBorderColor: 'hover:qq-border-amber-100',
-            ringColor: 'qq-ring-amber-100',
-            ringRolor: 'qq-ring-amber-100',
-            hoverRingColor: 'hover:qq-ring-amber-100',
-            divideColor: 'qq-divide-amber-100',
-            outlineColor: 'qq-outline-amber-100',
-            focusRingColor: 'focus:qq-ring-amber-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-amber-200',
-            hoverBgColor: 'hover:qq-bg-amber-200',
-            textColor: 'qq-text-amber-200',
-            hoverTextColor: 'hover:qq-text-amber-200',
-            borderColor: 'qq-border-amber-200',
-            hoverBorderColor: 'hover:qq-border-amber-200',
-            ringColor: 'qq-ring-amber-200',
-            ringRolor: 'qq-ring-amber-200',
-            hoverRingColor: 'hover:qq-ring-amber-200',
-            divideColor: 'qq-divide-amber-200',
-            outlineColor: 'qq-outline-amber-200',
-            focusRingColor: 'focus:qq-ring-amber-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-amber-300',
-            hoverBgColor: 'hover:qq-bg-amber-300',
-            textColor: 'qq-text-amber-300',
-            hoverTextColor: 'hover:qq-text-amber-300',
-            borderColor: 'qq-border-amber-300',
-            hoverBorderColor: 'hover:qq-border-amber-300',
-            ringColor: 'qq-ring-amber-300',
-            ringRolor: 'qq-ring-amber-300',
-            hoverRingColor: 'hover:qq-ring-amber-300',
-            divideColor: 'qq-divide-amber-300',
-            outlineColor: 'qq-outline-amber-300',
-            focusRingColor: 'focus:qq-ring-amber-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-amber-400',
-            hoverBgColor: 'hover:qq-bg-amber-400',
-            textColor: 'qq-text-amber-400',
-            hoverTextColor: 'hover:qq-text-amber-400',
-            borderColor: 'qq-border-amber-400',
-            hoverBorderColor: 'hover:qq-border-amber-400',
-            ringColor: 'qq-ring-amber-400',
-            ringRolor: 'qq-ring-amber-400',
-            hoverRingColor: 'hover:qq-ring-amber-400',
-            divideColor: 'qq-divide-amber-400',
-            outlineColor: 'qq-outline-amber-400',
-            focusRingColor: 'focus:qq-ring-amber-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-amber-500',
-            hoverBgColor: 'hover:qq-bg-amber-500',
-            textColor: 'qq-text-amber-500',
-            hoverTextColor: 'hover:qq-text-amber-500',
-            borderColor: 'qq-border-amber-500',
-            hoverBorderColor: 'hover:qq-border-amber-500',
-            ringColor: 'qq-ring-amber-500',
-            ringRolor: 'qq-ring-amber-500',
-            hoverRingColor: 'hover:qq-ring-amber-500',
-            divideColor: 'qq-divide-amber-500',
-            outlineColor: 'qq-outline-amber-500',
-            focusRingColor: 'focus:qq-ring-amber-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-amber-600',
-            hoverBgColor: 'hover:qq-bg-amber-600',
-            textColor: 'qq-text-amber-600',
-            hoverTextColor: 'hover:qq-text-amber-600',
-            borderColor: 'qq-border-amber-600',
-            hoverBorderColor: 'hover:qq-border-amber-600',
-            ringColor: 'qq-ring-amber-600',
-            ringRolor: 'qq-ring-amber-600',
-            hoverRingColor: 'hover:qq-ring-amber-600',
-            divideColor: 'qq-divide-amber-600',
-            outlineColor: 'qq-outline-amber-600',
-            focusRingColor: 'focus:qq-ring-amber-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-orange-700',
-            hoverBgColor: 'hover:qq-bg-orange-700',
-            textColor: 'qq-text-orange-700',
-            hoverTextColor: 'hover:qq-text-orange-700',
-            borderColor: 'qq-border-orange-700',
-            hoverBorderColor: 'hover:qq-border-orange-700',
-            ringColor: 'qq-ring-orange-700',
-            hoverRingColor: 'hover:qq-ring-orange-700',
-            divideColor: 'qq-divide-orange-700',
-            outlineColor: 'qq-outline-orange-700',
-            focusRingColor: 'focus:qq-ring-orange-700',
-            ringRolor: 'qq-ring-orange-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-orange-800',
-            hoverBgColor: 'hover:qq-bg-orange-800',
-            textColor: 'qq-text-orange-800',
-            hoverTextColor: 'hover:qq-text-orange-800',
-            borderColor: 'qq-border-orange-800',
-            hoverBorderColor: 'hover:qq-border-orange-800',
-            ringColor: 'qq-ring-orange-800',
-            hoverRingColor: 'hover:qq-ring-orange-800',
-            divideColor: 'qq-divide-orange-800',
-            outlineColor: 'qq-outline-orange-800',
-            focusRingColor: 'focus:qq-ring-orange-800',
-            ringRolor: 'qq-ring-orange-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-orange-900',
-            hoverBgColor: 'hover:qq-bg-orange-900',
-            textColor: 'qq-text-orange-900',
-            hoverTextColor: 'hover:qq-text-orange-900',
-            borderColor: 'qq-border-orange-900',
-            hoverBorderColor: 'hover:qq-border-orange-900',
-            ringColor: 'qq-ring-orange-900',
-            hoverRingColor: 'hover:qq-ring-orange-900',
-            divideColor: 'qq-divide-orange-900',
-            outlineColor: 'qq-outline-orange-900',
-            focusRingColor: 'focus:qq-ring-orange-900',
-            ringRolor: 'qq-ring-orange-900',
-        },
-    },
-    yellow: {
-        '50': {
-            bgColor: 'qq-bg-yellow-50',
-            hoverBgColor: 'hover:qq-bg-yellow-50',
-            textColor: 'qq-text-yellow-50',
-            hoverTextColor: 'hover:qq-text-yellow-50',
-            borderColor: 'qq-border-yellow-50',
-            hoverBorderColor: 'hover:qq-border-yellow-50',
-            ringColor: 'qq-ring-yellow-50',
-            hoverRingColor: 'hover:qq-ring-yellow-50',
-            divideColor: 'qq-divide-yellow-50',
-            outlineColor: 'qq-outline-yellow-50',
-            focusRingColor: 'focus:qq-ring-yellow-50',
-            ringRolor: 'qq-ring-yellow-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-yellow-100',
-            hoverBgColor: 'hover:qq-bg-yellow-100',
-            textColor: 'qq-text-yellow-100',
-            hoverTextColor: 'hover:qq-text-yellow-100',
-            borderColor: 'qq-border-yellow-100',
-            hoverBorderColor: 'hover:qq-border-yellow-100',
-            ringColor: 'qq-ring-yellow-100',
-            hoverRingColor: 'hover:qq-ring-yellow-100',
-            ringRolor: 'qq-ring-yellow-100',
-            divideColor: 'qq-divide-yellow-100',
-            outlineColor: 'qq-outline-yellow-100',
-            focusRingColor: 'focus:qq-ring-yellow-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-yellow-200',
-            hoverBgColor: 'hover:qq-bg-yellow-200',
-            textColor: 'qq-text-yellow-200',
-            hoverTextColor: 'hover:qq-text-yellow-200',
-            borderColor: 'qq-border-yellow-200',
-            hoverBorderColor: 'hover:qq-border-yellow-200',
-            ringColor: 'qq-ring-yellow-200',
-            hoverRingColor: 'hover:qq-ring-yellow-200',
-            ringRolor: 'qq-ring-yellow-200',
-            divideColor: 'qq-divide-yellow-200',
-            outlineColor: 'qq-outline-yellow-200',
-            focusRingColor: 'focus:qq-ring-yellow-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-yellow-300',
-            hoverBgColor: 'hover:qq-bg-yellow-300',
-            textColor: 'qq-text-yellow-300',
-            hoverTextColor: 'hover:qq-text-yellow-300',
-            borderColor: 'qq-border-yellow-300',
-            hoverBorderColor: 'hover:qq-border-yellow-300',
-            ringRolor: 'qq-ring-yellow-300',
-            ringColor: 'qq-ring-yellow-300',
-            hoverRingColor: 'hover:qq-ring-yellow-300',
-            divideColor: 'qq-divide-yellow-300',
-            outlineColor: 'qq-outline-yellow-300',
-            focusRingColor: 'focus:qq-ring-yellow-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-yellow-400',
-            hoverBgColor: 'hover:qq-bg-yellow-400',
-            textColor: 'qq-text-yellow-400',
-            hoverTextColor: 'hover:qq-text-yellow-400',
-            borderColor: 'qq-border-yellow-400',
-            hoverBorderColor: 'hover:qq-border-yellow-400',
-            ringRolor: 'qq-ring-yellow-400',
-            ringColor: 'qq-ring-yellow-400',
-            hoverRingColor: 'hover:qq-ring-yellow-400',
-            divideColor: 'qq-divide-yellow-400',
-            outlineColor: 'qq-outline-yellow-400',
-            focusRingColor: 'focus:qq-ring-yellow-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-yellow-500',
-            hoverBgColor: 'hover:qq-bg-yellow-500',
-            textColor: 'qq-text-yellow-500',
-            hoverTextColor: 'hover:qq-text-yellow-500',
-            borderColor: 'qq-border-yellow-500',
-            hoverBorderColor: 'hover:qq-border-yellow-500',
-            ringRolor: 'qq-ring-yellow-500',
-            ringColor: 'qq-ring-yellow-500',
-            hoverRingColor: 'hover:qq-ring-yellow-500',
-            divideColor: 'qq-divide-yellow-500',
-            outlineColor: 'qq-outline-yellow-500',
-            focusRingColor: 'focus:qq-ring-yellow-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-yellow-600',
-            hoverBgColor: 'hover:qq-bg-yellow-600',
-            textColor: 'qq-text-yellow-600',
-            hoverTextColor: 'hover:qq-text-yellow-600',
-            borderColor: 'qq-border-yellow-600',
-            hoverBorderColor: 'hover:qq-border-yellow-600',
-            ringRolor: 'qq-ring-yellow-600',
-            ringColor: 'qq-ring-yellow-600',
-            hoverRingColor: 'hover:qq-ring-yellow-600',
-            divideColor: 'qq-divide-yellow-600',
-            outlineColor: 'qq-outline-yellow-600',
-            focusRingColor: 'focus:qq-ring-yellow-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-yellow-700',
-            hoverBgColor: 'hover:qq-bg-yellow-700',
-            textColor: 'qq-text-yellow-700',
-            hoverTextColor: 'hover:qq-text-yellow-700',
-            borderColor: 'qq-border-yellow-700',
-            hoverBorderColor: 'hover:qq-border-yellow-700',
-            ringRolor: 'qq-ring-yellow-700',
-            ringColor: 'qq-ring-yellow-700',
-            hoverRingColor: 'hover:qq-ring-yellow-700',
-            divideColor: 'qq-divide-yellow-700',
-            outlineColor: 'qq-outline-yellow-700',
-            focusRingColor: 'focus:qq-ring-yellow-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-yellow-800',
-            hoverBgColor: 'hover:qq-bg-yellow-800',
-            textColor: 'qq-text-yellow-800',
-            hoverTextColor: 'hover:qq-text-yellow-800',
-            borderColor: 'qq-border-yellow-800',
-            hoverBorderColor: 'hover:qq-border-yellow-800',
-            ringRolor: 'qq-ring-yellow-800',
-            ringColor: 'qq-ring-yellow-800',
-            hoverRingColor: 'hover:qq-ring-yellow-800',
-            divideColor: 'qq-divide-yellow-800',
-            outlineColor: 'qq-outline-yellow-800',
-            focusRingColor: 'focus:qq-ring-yellow-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-yellow-900',
-            hoverBgColor: 'hover:qq-bg-yellow-900',
-            textColor: 'qq-text-yellow-900',
-            hoverTextColor: 'hover:qq-text-yellow-900',
-            borderColor: 'qq-border-yellow-900',
-            hoverBorderColor: 'hover:qq-border-yellow-900',
-            ringRolor: 'qq-ring-yellow-900',
-            ringColor: 'qq-ring-yellow-900',
-            hoverRingColor: 'hover:qq-ring-yellow-900',
-            divideColor: 'qq-divide-yellow-900',
-            outlineColor: 'qq-outline-yellow-900',
-            focusRingColor: 'focus:qq-ring-yellow-900',
-        },
-    },
-    lime: {
-        '50': {
-            bgColor: 'qq-bg-lime-50',
-            hoverBgColor: 'hover:qq-bg-lime-50',
-            textColor: 'qq-text-lime-50',
-            hoverTextColor: 'hover:qq-text-lime-50',
-            borderColor: 'qq-border-lime-50',
-            hoverBorderColor: 'hover:qq-border-lime-50',
-            ringRolor: 'qq-ring-lime-50',
-            ringColor: 'qq-ring-lime-50',
-            hoverRingColor: 'hover:qq-ring-lime-50',
-            divideColor: 'qq-divide-lime-50',
-            outlineColor: 'qq-outline-lime-50',
-            focusRingColor: 'focus:qq-ring-lime-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-lime-100',
-            hoverBgColor: 'hover:qq-bg-lime-100',
-            textColor: 'qq-text-lime-100',
-            hoverTextColor: 'hover:qq-text-lime-100',
-            borderColor: 'qq-border-lime-100',
-            hoverBorderColor: 'hover:qq-border-lime-100',
-            ringRolor: 'qq-ring-lime-100',
-            ringColor: 'qq-ring-lime-100',
-            hoverRingColor: 'hover:qq-ring-lime-100',
-            divideColor: 'qq-divide-lime-100',
-            outlineColor: 'qq-outline-lime-100',
-            focusRingColor: 'focus:qq-ring-lime-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-lime-200',
-            hoverBgColor: 'hover:qq-bg-lime-200',
-            textColor: 'qq-text-lime-200',
-            hoverTextColor: 'hover:qq-text-lime-200',
-            borderColor: 'qq-border-lime-200',
-            hoverBorderColor: 'hover:qq-border-lime-200',
-            ringRolor: 'qq-ring-lime-200',
-            ringColor: 'qq-ring-lime-200',
-            hoverRingColor: 'hover:qq-ring-lime-200',
-            divideColor: 'qq-divide-lime-200',
-            outlineColor: 'qq-outline-lime-200',
-            focusRingColor: 'focus:qq-ring-lime-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-lime-300',
-            hoverBgColor: 'hover:qq-bg-lime-300',
-            textColor: 'qq-text-lime-300',
-            hoverTextColor: 'hover:qq-text-lime-300',
-            borderColor: 'qq-border-lime-300',
-            hoverBorderColor: 'hover:qq-border-lime-300',
-            ringRolor: 'qq-ring-lime-300',
-            ringColor: 'qq-ring-lime-300',
-            hoverRingColor: 'hover:qq-ring-lime-300',
-            divideColor: 'qq-divide-lime-300',
-            outlineColor: 'qq-outline-lime-300',
-            focusRingColor: 'focus:qq-ring-lime-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-lime-400',
-            hoverBgColor: 'hover:qq-bg-lime-400',
-            textColor: 'qq-text-lime-400',
-            hoverTextColor: 'hover:qq-text-lime-400',
-            borderColor: 'qq-border-lime-400',
-            hoverBorderColor: 'hover:qq-border-lime-400',
-            ringRolor: 'qq-ring-lime-400',
-            ringColor: 'qq-ring-lime-400',
-            hoverRingColor: 'hover:qq-ring-lime-400',
-            divideColor: 'qq-divide-lime-400',
-            outlineColor: 'qq-outline-lime-400',
-            focusRingColor: 'focus:qq-ring-lime-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-lime-500',
-            hoverBgColor: 'hover:qq-bg-lime-500',
-            textColor: 'qq-text-lime-500',
-            hoverTextColor: 'hover:qq-text-lime-500',
-            borderColor: 'qq-border-lime-500',
-            hoverBorderColor: 'hover:qq-border-lime-500',
-            ringRolor: 'qq-ring-lime-500',
-            ringColor: 'qq-ring-lime-500',
-            hoverRingColor: 'hover:qq-ring-lime-500',
-            divideColor: 'qq-divide-lime-500',
-            outlineColor: 'qq-outline-lime-500',
-            focusRingColor: 'focus:qq-ring-lime-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-lime-600',
-            hoverBgColor: 'hover:qq-bg-lime-600',
-            textColor: 'qq-text-lime-600',
-            hoverTextColor: 'hover:qq-text-lime-600',
-            borderColor: 'qq-border-lime-600',
-            hoverBorderColor: 'hover:qq-border-lime-600',
-            ringRolor: 'qq-ring-lime-600',
-            ringColor: 'qq-ring-lime-600',
-            hoverRingColor: 'hover:qq-ring-lime-600',
-            divideColor: 'qq-divide-lime-600',
-            outlineColor: 'qq-outline-lime-600',
-            focusRingColor: 'focus:qq-ring-lime-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-lime-700',
-            hoverBgColor: 'hover:qq-bg-lime-700',
-            textColor: 'qq-text-lime-700',
-            hoverTextColor: 'hover:qq-text-lime-700',
-            borderColor: 'qq-border-lime-700',
-            hoverBorderColor: 'hover:qq-border-lime-700',
-            ringRolor: 'qq-ring-lime-700',
-            ringColor: 'qq-ring-lime-700',
-            hoverRingColor: 'hover:qq-ring-lime-700',
-            divideColor: 'qq-divide-lime-700',
-            outlineColor: 'qq-outline-lime-700',
-            focusRingColor: 'focus:qq-ring-lime-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-lime-800',
-            hoverBgColor: 'hover:qq-bg-lime-800',
-            textColor: 'qq-text-lime-800',
-            hoverTextColor: 'hover:qq-text-lime-800',
-            borderColor: 'qq-border-lime-800',
-            hoverBorderColor: 'hover:qq-border-lime-800',
-            ringRolor: 'qq-ring-lime-800',
-            ringColor: 'qq-ring-lime-800',
-            hoverRingColor: 'hover:qq-ring-lime-800',
-            divideColor: 'qq-divide-lime-800',
-            outlineColor: 'qq-outline-lime-800',
-            focusRingColor: 'focus:qq-ring-lime-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-lime-900',
-            hoverBgColor: 'hover:qq-bg-lime-900',
-            textColor: 'qq-text-lime-900',
-            hoverTextColor: 'hover:qq-text-lime-900',
-            borderColor: 'qq-border-lime-900',
-            hoverBorderColor: 'hover:qq-border-lime-900',
-            ringRolor: 'qq-ring-lime-900',
-            ringColor: 'qq-ring-lime-900',
-            hoverRingColor: 'hover:qq-ring-lime-900',
-            divideColor: 'qq-divide-lime-900',
-            outlineColor: 'qq-outline-lime-900',
-            focusRingColor: 'focus:qq-ring-lime-900',
-        },
-    },
-    green: {
-        '50': {
-            bgColor: 'qq-bg-green-50',
-            hoverBgColor: 'hover:qq-bg-green-50',
-            textColor: 'qq-text-green-50',
-            hoverTextColor: 'hover:qq-text-green-50',
-            borderColor: 'qq-border-green-50',
-            hoverBorderColor: 'hover:qq-border-green-50',
-            ringRolor: 'qq-ring-green-50',
-            ringColor: 'qq-ring-green-50',
-            hoverRingColor: 'hover:qq-ring-green-50',
-            divideColor: 'qq-divide-green-50',
-            outlineColor: 'qq-outline-green-50',
-            focusRingColor: 'focus:qq-ring-green-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-green-100',
-            hoverBgColor: 'hover:qq-bg-green-100',
-            textColor: 'qq-text-green-100',
-            hoverTextColor: 'hover:qq-text-green-100',
-            borderColor: 'qq-border-green-100',
-            hoverBorderColor: 'hover:qq-border-green-100',
-            ringRolor: 'qq-ring-green-100',
-            ringColor: 'qq-ring-green-100',
-            hoverRingColor: 'hover:qq-ring-green-100',
-            divideColor: 'qq-divide-green-100',
-            outlineColor: 'qq-outline-green-100',
-            focusRingColor: 'focus:qq-ring-green-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-green-200',
-            hoverBgColor: 'hover:qq-bg-green-200',
-            textColor: 'qq-text-green-200',
-            hoverTextColor: 'hover:qq-text-green-200',
-            borderColor: 'qq-border-green-200',
-            hoverBorderColor: 'hover:qq-border-green-200',
-            ringRolor: 'qq-ring-green-200',
-            ringColor: 'qq-ring-green-200',
-            hoverRingColor: 'hover:qq-ring-green-200',
-            divideColor: 'qq-divide-green-200',
-            outlineColor: 'qq-outline-green-200',
-            focusRingColor: 'focus:qq-ring-green-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-green-300',
-            hoverBgColor: 'hover:qq-bg-green-300',
-            textColor: 'qq-text-green-300',
-            hoverTextColor: 'hover:qq-text-green-300',
-            borderColor: 'qq-border-green-300',
-            hoverBorderColor: 'hover:qq-border-green-300',
-            ringRolor: 'qq-ring-green-300',
-            ringColor: 'qq-ring-green-300',
-            hoverRingColor: 'hover:qq-ring-green-300',
-            divideColor: 'qq-divide-green-300',
-            outlineColor: 'qq-outline-green-300',
-            focusRingColor: 'focus:qq-ring-green-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-green-400',
-            hoverBgColor: 'hover:qq-bg-green-400',
-            textColor: 'qq-text-green-400',
-            hoverTextColor: 'hover:qq-text-green-400',
-            borderColor: 'qq-border-green-400',
-            hoverBorderColor: 'hover:qq-border-green-400',
-            ringRolor: 'qq-ring-green-400',
-            ringColor: 'qq-ring-green-400',
-            hoverRingColor: 'hover:qq-ring-green-400',
-            divideColor: 'qq-divide-green-400',
-            outlineColor: 'qq-outline-green-400',
-            focusRingColor: 'focus:qq-ring-green-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-green-500',
-            hoverBgColor: 'hover:qq-bg-green-500',
-            textColor: 'qq-text-green-500',
-            hoverTextColor: 'hover:qq-text-green-500',
-            borderColor: 'qq-border-green-500',
-            hoverBorderColor: 'hover:qq-border-green-500',
-            ringRolor: 'qq-ring-green-500',
-            ringColor: 'qq-ring-green-500',
-            hoverRingColor: 'hover:qq-ring-green-500',
-            divideColor: 'qq-divide-green-500',
-            outlineColor: 'qq-outline-green-500',
-            focusRingColor: 'focus:qq-ring-green-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-green-600',
-            hoverBgColor: 'hover:qq-bg-green-600',
-            textColor: 'qq-text-green-600',
-            hoverTextColor: 'hover:qq-text-green-600',
-            borderColor: 'qq-border-green-600',
-            hoverBorderColor: 'hover:qq-border-green-600',
-            ringRolor: 'qq-ring-green-600',
-            ringColor: 'qq-ring-green-600',
-            hoverRingColor: 'hover:qq-ring-green-600',
-            divideColor: 'qq-divide-green-600',
-            outlineColor: 'qq-outline-green-600',
-            focusRingColor: 'focus:qq-ring-green-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-green-700',
-            hoverBgColor: 'hover:qq-bg-green-700',
-            textColor: 'qq-text-green-700',
-            hoverTextColor: 'hover:qq-text-green-700',
-            borderColor: 'qq-border-green-700',
-            hoverBorderColor: 'hover:qq-border-green-700',
-            ringRolor: 'qq-ring-green-700',
-            ringColor: 'qq-ring-green-700',
-            hoverRingColor: 'hover:qq-ring-green-700',
-            divideColor: 'qq-divide-green-700',
-            outlineColor: 'qq-outline-green-700',
-            focusRingColor: 'focus:qq-ring-green-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-green-800',
-            hoverBgColor: 'hover:qq-bg-green-800',
-            textColor: 'qq-text-green-800',
-            hoverTextColor: 'hover:qq-text-green-800',
-            borderColor: 'qq-border-green-800',
-            hoverBorderColor: 'hover:qq-border-green-800',
-            ringRolor: 'qq-ring-green-800',
-            ringColor: 'qq-ring-green-800',
-            hoverRingColor: 'hover:qq-ring-green-800',
-            divideColor: 'qq-divide-green-800',
-            outlineColor: 'qq-outline-green-800',
-            focusRingColor: 'focus:qq-ring-green-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-green-900',
-            hoverBgColor: 'hover:qq-bg-green-900',
-            textColor: 'qq-text-green-900',
-            hoverTextColor: 'hover:qq-text-green-900',
-            borderColor: 'qq-border-green-900',
-            hoverBorderColor: 'hover:qq-border-green-900',
-            ringRolor: 'qq-ring-green-900',
-            ringColor: 'qq-ring-green-900',
-            hoverRingColor: 'hover:qq-ring-green-900',
-            divideColor: 'qq-divide-green-900',
-            outlineColor: 'qq-outline-green-900',
-            focusRingColor: 'focus:qq-ring-green-900',
-        },
-    },
-    emerald: {
-        '50': {
-            bgColor: 'qq-bg-emerald-50',
-            hoverBgColor: 'hover:qq-bg-emerald-50',
-            textColor: 'qq-text-emerald-50',
-            hoverTextColor: 'hover:qq-text-emerald-50',
-            borderColor: 'qq-border-emerald-50',
-            hoverBorderColor: 'hover:qq-border-emerald-50',
-            ringRolor: 'qq-ring-emerald-50',
-            ringColor: 'qq-ring-emerald-50',
-            hoverRingColor: 'hover:qq-ring-emerald-50',
-            divideColor: 'qq-divide-emerald-50',
-            outlineColor: 'qq-outline-emerald-50',
-            focusRingColor: 'focus:qq-ring-emerald-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-emerald-100',
-            hoverBgColor: 'hover:qq-bg-emerald-100',
-            textColor: 'qq-text-emerald-100',
-            hoverTextColor: 'hover:qq-text-emerald-100',
-            borderColor: 'qq-border-emerald-100',
-            hoverBorderColor: 'hover:qq-border-emerald-100',
-            ringRolor: 'qq-ring-emerald-100',
-            ringColor: 'qq-ring-emerald-100',
-            hoverRingColor: 'hover:qq-ring-emerald-100',
-            divideColor: 'qq-divide-emerald-100',
-            outlineColor: 'qq-outline-emerald-100',
-            focusRingColor: 'focus:qq-ring-emerald-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-emerald-200',
-            hoverBgColor: 'hover:qq-bg-emerald-200',
-            textColor: 'qq-text-emerald-200',
-            hoverTextColor: 'hover:qq-text-emerald-200',
-            borderColor: 'qq-border-emerald-200',
-            hoverBorderColor: 'hover:qq-border-emerald-200',
-            ringRolor: 'qq-ring-emerald-200',
-            ringColor: 'qq-ring-emerald-200',
-            hoverRingColor: 'hover:qq-ring-emerald-200',
-            divideColor: 'qq-divide-emerald-200',
-            outlineColor: 'qq-outline-emerald-200',
-            focusRingColor: 'focus:qq-ring-emerald-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-emerald-300',
-            hoverBgColor: 'hover:qq-bg-emerald-300',
-            textColor: 'qq-text-emerald-300',
-            hoverTextColor: 'hover:qq-text-emerald-300',
-            borderColor: 'qq-border-emerald-300',
-            hoverBorderColor: 'hover:qq-border-emerald-300',
-            ringRolor: 'qq-ring-emerald-300',
-            ringColor: 'qq-ring-emerald-300',
-            hoverRingColor: 'hover:qq-ring-emerald-300',
-            divideColor: 'qq-divide-emerald-300',
-            outlineColor: 'qq-outline-emerald-300',
-            focusRingColor: 'focus:qq-ring-emerald-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-emerald-400',
-            hoverBgColor: 'hover:qq-bg-emerald-400',
-            textColor: 'qq-text-emerald-400',
-            hoverTextColor: 'hover:qq-text-emerald-400',
-            borderColor: 'qq-border-emerald-400',
-            hoverBorderColor: 'hover:qq-border-emerald-400',
-            ringRolor: 'qq-ring-emerald-400',
-            ringColor: 'qq-ring-emerald-400',
-            hoverRingColor: 'hover:qq-ring-emerald-400',
-            divideColor: 'qq-divide-emerald-400',
-            outlineColor: 'qq-outline-emerald-400',
-            focusRingColor: 'focus:qq-ring-emerald-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-emerald-500',
-            hoverBgColor: 'hover:qq-bg-emerald-500',
-            textColor: 'qq-text-emerald-500',
-            hoverTextColor: 'hover:qq-text-emerald-500',
-            borderColor: 'qq-border-emerald-500',
-            hoverBorderColor: 'hover:qq-border-emerald-500',
-            ringRolor: 'qq-ring-emerald-500',
-            ringColor: 'qq-ring-emerald-500',
-            hoverRingColor: 'hover:qq-ring-emerald-500',
-            divideColor: 'qq-divide-emerald-500',
-            outlineColor: 'qq-outline-emerald-500',
-            focusRingColor: 'focus:qq-ring-emerald-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-emerald-600',
-            hoverBgColor: 'hover:qq-bg-emerald-600',
-            textColor: 'qq-text-emerald-600',
-            hoverTextColor: 'hover:qq-text-emerald-600',
-            borderColor: 'qq-border-emerald-600',
-            hoverBorderColor: 'hover:qq-border-emerald-600',
-            ringRolor: 'qq-ring-emerald-600',
-            ringColor: 'qq-ring-emerald-600',
-            hoverRingColor: 'hover:qq-ring-emerald-600',
-            divideColor: 'qq-divide-emerald-600',
-            outlineColor: 'qq-outline-emerald-600',
-            focusRingColor: 'focus:qq-ring-emerald-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-emerald-700',
-            hoverBgColor: 'hover:qq-bg-emerald-700',
-            textColor: 'qq-text-emerald-700',
-            hoverTextColor: 'hover:qq-text-emerald-700',
-            borderColor: 'qq-border-emerald-700',
-            hoverBorderColor: 'hover:qq-border-emerald-700',
-            ringRolor: 'qq-ring-emerald-700',
-            ringColor: 'qq-ring-emerald-700',
-            hoverRingColor: 'hover:qq-ring-emerald-700',
-            divideColor: 'qq-divide-emerald-700',
-            outlineColor: 'qq-outline-emerald-700',
-            focusRingColor: 'focus:qq-ring-emerald-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-emerald-800',
-            hoverBgColor: 'hover:qq-bg-emerald-800',
-            textColor: 'qq-text-emerald-800',
-            hoverTextColor: 'hover:qq-text-emerald-800',
-            borderColor: 'qq-border-emerald-800',
-            hoverBorderColor: 'hover:qq-border-emerald-800',
-            ringRolor: 'qq-ring-emerald-800',
-            ringColor: 'qq-ring-emerald-800',
-            hoverRingColor: 'hover:qq-ring-emerald-800',
-            divideColor: 'qq-divide-emerald-800',
-            outlineColor: 'qq-outline-emerald-800',
-            focusRingColor: 'focus:qq-ring-emerald-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-emerald-900',
-            hoverBgColor: 'hover:qq-bg-emerald-900',
-            textColor: 'qq-text-emerald-900',
-            hoverTextColor: 'hover:qq-text-emerald-900',
-            borderColor: 'qq-border-emerald-900',
-            hoverBorderColor: 'hover:qq-border-emerald-900',
-            ringRolor: 'qq-ring-emerald-900',
-            ringColor: 'qq-ring-emerald-900',
-            hoverRingColor: 'hover:qq-ring-emerald-900',
-            divideColor: 'qq-divide-emerald-900',
-            outlineColor: 'qq-outline-emerald-900',
-            focusRingColor: 'focus:qq-ring-emerald-900',
-        },
-    },
-    teal: {
-        '50': {
-            bgColor: 'qq-bg-teal-50',
-            hoverBgColor: 'hover:qq-bg-teal-50',
-            textColor: 'qq-text-teal-50',
-            hoverTextColor: 'hover:qq-text-teal-50',
-            borderColor: 'qq-border-teal-50',
-            hoverBorderColor: 'hover:qq-border-teal-50',
-            ringRolor: 'qq-ring-teal-50',
-            ringColor: 'qq-ring-teal-50',
-            hoverRingColor: 'hover:qq-ring-teal-50',
-            divideColor: 'qq-divide-teal-50',
-            outlineColor: 'qq-outline-teal-50',
-            focusRingColor: 'focus:qq-ring-teal-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-teal-100',
-            hoverBgColor: 'hover:qq-bg-teal-100',
-            textColor: 'qq-text-teal-100',
-            hoverTextColor: 'hover:qq-text-teal-100',
-            borderColor: 'qq-border-teal-100',
-            hoverBorderColor: 'hover:qq-border-teal-100',
-            ringRolor: 'qq-ring-teal-100',
-            ringColor: 'qq-ring-teal-100',
-            hoverRingColor: 'hover:qq-ring-teal-100',
-            divideColor: 'qq-divide-teal-100',
-            outlineColor: 'qq-outline-teal-100',
-            focusRingColor: 'focus:qq-ring-teal-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-teal-200',
-            hoverBgColor: 'hover:qq-bg-teal-200',
-            textColor: 'qq-text-teal-200',
-            hoverTextColor: 'hover:qq-text-teal-200',
-            borderColor: 'qq-border-teal-200',
-            hoverBorderColor: 'hover:qq-border-teal-200',
-            ringRolor: 'qq-ring-teal-200',
-            ringColor: 'qq-ring-teal-200',
-            hoverRingColor: 'hover:qq-ring-teal-200',
-            divideColor: 'qq-divide-teal-200',
-            outlineColor: 'qq-outline-teal-200',
-            focusRingColor: 'focus:qq-ring-teal-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-teal-300',
-            hoverBgColor: 'hover:qq-bg-teal-300',
-            textColor: 'qq-text-teal-300',
-            hoverTextColor: 'hover:qq-text-teal-300',
-            borderColor: 'qq-border-teal-300',
-            hoverBorderColor: 'hover:qq-border-teal-300',
-            ringRolor: 'qq-ring-teal-300',
-            ringColor: 'qq-ring-teal-300',
-            hoverRingColor: 'hover:qq-ring-teal-300',
-            divideColor: 'qq-divide-teal-300',
-            outlineColor: 'qq-outline-teal-300',
-            focusRingColor: 'focus:qq-ring-teal-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-teal-400',
-            hoverBgColor: 'hover:qq-bg-teal-400',
-            textColor: 'qq-text-teal-400',
-            hoverTextColor: 'hover:qq-text-teal-400',
-            borderColor: 'qq-border-teal-400',
-            hoverBorderColor: 'hover:qq-border-teal-400',
-            ringRolor: 'qq-ring-teal-400',
-            ringColor: 'qq-ring-teal-400',
-            hoverRingColor: 'hover:qq-ring-teal-400',
-            divideColor: 'qq-divide-teal-400',
-            outlineColor: 'qq-outline-teal-400',
-            focusRingColor: 'focus:qq-ring-teal-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-teal-500',
-            hoverBgColor: 'hover:qq-bg-teal-500',
-            textColor: 'qq-text-teal-500',
-            hoverTextColor: 'hover:qq-text-teal-500',
-            borderColor: 'qq-border-teal-500',
-            hoverBorderColor: 'hover:qq-border-teal-500',
-            ringRolor: 'qq-ring-teal-500',
-            ringColor: 'qq-ring-teal-500',
-            hoverRingColor: 'hover:qq-ring-teal-500',
-            divideColor: 'qq-divide-teal-500',
-            outlineColor: 'qq-outline-teal-500',
-            focusRingColor: 'focus:qq-ring-teal-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-teal-600',
-            hoverBgColor: 'hover:qq-bg-teal-600',
-            textColor: 'qq-text-teal-600',
-            hoverTextColor: 'hover:qq-text-teal-600',
-            borderColor: 'qq-border-teal-600',
-            hoverBorderColor: 'hover:qq-border-teal-600',
-            ringRolor: 'qq-ring-teal-600',
-            ringColor: 'qq-ring-teal-600',
-            hoverRingColor: 'hover:qq-ring-teal-600',
-            divideColor: 'qq-divide-teal-600',
-            outlineColor: 'qq-outline-teal-600',
-            focusRingColor: 'focus:qq-ring-teal-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-teal-700',
-            hoverBgColor: 'hover:qq-bg-teal-700',
-            textColor: 'qq-text-teal-700',
-            hoverTextColor: 'hover:qq-text-teal-700',
-            borderColor: 'qq-border-teal-700',
-            hoverBorderColor: 'hover:qq-border-teal-700',
-            ringRolor: 'qq-ring-teal-700',
-            ringColor: 'qq-ring-teal-700',
-            hoverRingColor: 'hover:qq-ring-teal-700',
-            divideColor: 'qq-divide-teal-700',
-            outlineColor: 'qq-outline-teal-700',
-            focusRingColor: 'focus:qq-ring-teal-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-teal-800',
-            hoverBgColor: 'hover:qq-bg-teal-800',
-            textColor: 'qq-text-teal-800',
-            hoverTextColor: 'hover:qq-text-teal-800',
-            borderColor: 'qq-border-teal-800',
-            hoverBorderColor: 'hover:qq-border-teal-800',
-            ringRolor: 'qq-ring-teal-800',
-            ringColor: 'qq-ring-teal-800',
-            hoverRingColor: 'hover:qq-ring-teal-800',
-            divideColor: 'qq-divide-teal-800',
-            outlineColor: 'qq-outline-teal-800',
-            focusRingColor: 'focus:qq-ring-teal-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-teal-900',
-            hoverBgColor: 'hover:qq-bg-teal-900',
-            textColor: 'qq-text-teal-900',
-            hoverTextColor: 'hover:qq-text-teal-900',
-            borderColor: 'qq-border-teal-900',
-            hoverBorderColor: 'hover:qq-border-teal-900',
-            ringRolor: 'qq-ring-teal-900',
-            ringColor: 'qq-ring-teal-900',
-            hoverRingColor: 'hover:qq-ring-teal-900',
-            divideColor: 'qq-divide-teal-900',
-            outlineColor: 'qq-outline-teal-900',
-            focusRingColor: 'focus:qq-ring-teal-900',
-        },
-    },
-    cyan: {
-        '50': {
-            bgColor: 'qq-bg-cyan-50',
-            hoverBgColor: 'hover:qq-bg-cyan-50',
-            textColor: 'qq-text-cyan-50',
-            hoverTextColor: 'hover:qq-text-cyan-50',
-            borderColor: 'qq-border-cyan-50',
-            hoverBorderColor: 'hover:qq-border-cyan-50',
-            ringRolor: 'qq-ring-cyan-50',
-            ringColor: 'qq-ring-cyan-50',
-            hoverRingColor: 'hover:qq-ring-cyan-50',
-            divideColor: 'qq-divide-cyan-50',
-            outlineColor: 'qq-outline-cyan-50',
-            focusRingColor: 'focus:qq-ring-cyan-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-cyan-100',
-            hoverBgColor: 'hover:qq-bg-cyan-100',
-            textColor: 'qq-text-cyan-100',
-            hoverTextColor: 'hover:qq-text-cyan-100',
-            borderColor: 'qq-border-cyan-100',
-            hoverBorderColor: 'hover:qq-border-cyan-100',
-            ringRolor: 'qq-ring-cyan-100',
-            ringColor: 'qq-ring-cyan-100',
-            hoverRingColor: 'hover:qq-ring-cyan-100',
-            divideColor: 'qq-divide-cyan-100',
-            outlineColor: 'qq-outline-cyan-100',
-            focusRingColor: 'focus:qq-ring-cyan-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-cyan-200',
-            hoverBgColor: 'hover:qq-bg-cyan-200',
-            textColor: 'qq-text-cyan-200',
-            hoverTextColor: 'hover:qq-text-cyan-200',
-            borderColor: 'qq-border-cyan-200',
-            hoverBorderColor: 'hover:qq-border-cyan-200',
-            ringRolor: 'qq-ring-cyan-200',
-            ringColor: 'qq-ring-cyan-200',
-            hoverRingColor: 'hover:qq-ring-cyan-200',
-            divideColor: 'qq-divide-cyan-200',
-            outlineColor: 'qq-outline-cyan-200',
-            focusRingColor: 'focus:qq-ring-cyan-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-cyan-300',
-            hoverBgColor: 'hover:qq-bg-cyan-300',
-            textColor: 'qq-text-cyan-300',
-            hoverTextColor: 'hover:qq-text-cyan-300',
-            borderColor: 'qq-border-cyan-300',
-            hoverBorderColor: 'hover:qq-border-cyan-300',
-            ringRolor: 'qq-ring-cyan-300',
-            ringColor: 'qq-ring-cyan-300',
-            hoverRingColor: 'hover:qq-ring-cyan-300',
-            divideColor: 'qq-divide-cyan-300',
-            outlineColor: 'qq-outline-cyan-300',
-            focusRingColor: 'focus:qq-ring-cyan-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-cyan-400',
-            hoverBgColor: 'hover:qq-bg-cyan-400',
-            textColor: 'qq-text-cyan-400',
-            hoverTextColor: 'hover:qq-text-cyan-400',
-            borderColor: 'qq-border-cyan-400',
-            hoverBorderColor: 'hover:qq-border-cyan-400',
-            ringRolor: 'qq-ring-cyan-400',
-            ringColor: 'qq-ring-cyan-400',
-            hoverRingColor: 'hover:qq-ring-cyan-400',
-            divideColor: 'qq-divide-cyan-400',
-            outlineColor: 'qq-outline-cyan-400',
-            focusRingColor: 'focus:qq-ring-cyan-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-cyan-500',
-            hoverBgColor: 'hover:qq-bg-cyan-500',
-            textColor: 'qq-text-cyan-500',
-            hoverTextColor: 'hover:qq-text-cyan-500',
-            borderColor: 'qq-border-cyan-500',
-            hoverBorderColor: 'hover:qq-border-cyan-500',
-            ringRolor: 'qq-ring-cyan-500',
-            ringColor: 'qq-ring-cyan-500',
-            hoverRingColor: 'hover:qq-ring-cyan-500',
-            divideColor: 'qq-divide-cyan-500',
-            outlineColor: 'qq-outline-cyan-500',
-            focusRingColor: 'focus:qq-ring-cyan-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-cyan-600',
-            hoverBgColor: 'hover:qq-bg-cyan-600',
-            textColor: 'qq-text-cyan-600',
-            hoverTextColor: 'hover:qq-text-cyan-600',
-            borderColor: 'qq-border-cyan-600',
-            hoverBorderColor: 'hover:qq-border-cyan-600',
-            ringRolor: 'qq-ring-cyan-600',
-            ringColor: 'qq-ring-cyan-600',
-            hoverRingColor: 'hover:qq-ring-cyan-600',
-            divideColor: 'qq-divide-cyan-600',
-            outlineColor: 'qq-outline-cyan-600',
-            focusRingColor: 'focus:qq-ring-cyan-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-cyan-700',
-            hoverBgColor: 'hover:qq-bg-cyan-700',
-            textColor: 'qq-text-cyan-700',
-            hoverTextColor: 'hover:qq-text-cyan-700',
-            borderColor: 'qq-border-cyan-700',
-            hoverBorderColor: 'hover:qq-border-cyan-700',
-            ringRolor: 'qq-ring-cyan-700',
-            ringColor: 'qq-ring-cyan-700',
-            hoverRingColor: 'hover:qq-ring-cyan-700',
-            divideColor: 'qq-divide-cyan-700',
-            outlineColor: 'qq-outline-cyan-700',
-            focusRingColor: 'focus:qq-ring-cyan-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-cyan-800',
-            hoverBgColor: 'hover:qq-bg-cyan-800',
-            textColor: 'qq-text-cyan-800',
-            hoverTextColor: 'hover:qq-text-cyan-800',
-            borderColor: 'qq-border-cyan-800',
-            hoverBorderColor: 'hover:qq-border-cyan-800',
-            ringRolor: 'qq-ring-cyan-800',
-            ringColor: 'qq-ring-cyan-800',
-            hoverRingColor: 'hover:qq-ring-cyan-800',
-            divideColor: 'qq-divide-cyan-800',
-            outlineColor: 'qq-outline-cyan-800',
-            focusRingColor: 'focus:qq-ring-cyan-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-cyan-900',
-            hoverBgColor: 'hover:qq-bg-cyan-900',
-            textColor: 'qq-text-cyan-900',
-            hoverTextColor: 'hover:qq-text-cyan-900',
-            borderColor: 'qq-border-cyan-900',
-            hoverBorderColor: 'hover:qq-border-cyan-900',
-            ringRolor: 'qq-ring-cyan-900',
-            ringColor: 'qq-ring-cyan-900',
-            hoverRingColor: 'hover:qq-ring-cyan-900',
-            divideColor: 'qq-divide-cyan-900',
-            outlineColor: 'qq-outline-cyan-900',
-            focusRingColor: 'focus:qq-ring-cyan-900',
-        },
-    },
-    sky: {
-        '50': {
-            bgColor: 'qq-bg-sky-50',
-            hoverBgColor: 'hover:qq-bg-sky-50',
-            textColor: 'qq-text-sky-50',
-            hoverTextColor: 'hover:qq-text-sky-50',
-            borderColor: 'qq-border-sky-50',
-            hoverBorderColor: 'hover:qq-border-sky-50',
-            ringRolor: 'qq-ring-sky-50',
-            ringColor: 'qq-ring-sky-50',
-            hoverRingColor: 'hover:qq-ring-sky-50',
-            divideColor: 'qq-divide-sky-50',
-            outlineColor: 'qq-outline-sky-50',
-            focusRingColor: 'focus:qq-ring-sky-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-sky-100',
-            hoverBgColor: 'hover:qq-bg-sky-100',
-            textColor: 'qq-text-sky-100',
-            hoverTextColor: 'hover:qq-text-sky-100',
-            borderColor: 'qq-border-sky-100',
-            hoverBorderColor: 'hover:qq-border-sky-100',
-            ringRolor: 'qq-ring-sky-100',
-            ringColor: 'qq-ring-sky-100',
-            hoverRingColor: 'hover:qq-ring-sky-100',
-            divideColor: 'qq-divide-sky-100',
-            outlineColor: 'qq-outline-sky-100',
-            focusRingColor: 'focus:qq-ring-sky-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-sky-200',
-            hoverBgColor: 'hover:qq-bg-sky-200',
-            textColor: 'qq-text-sky-200',
-            hoverTextColor: 'hover:qq-text-sky-200',
-            borderColor: 'qq-border-sky-200',
-            hoverBorderColor: 'hover:qq-border-sky-200',
-            ringRolor: 'qq-ring-sky-200',
-            ringColor: 'qq-ring-sky-200',
-            hoverRingColor: 'hover:qq-ring-sky-200',
-            divideColor: 'qq-divide-sky-200',
-            outlineColor: 'qq-outline-sky-200',
-            focusRingColor: 'focus:qq-ring-sky-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-sky-300',
-            hoverBgColor: 'hover:qq-bg-sky-300',
-            textColor: 'qq-text-sky-300',
-            hoverTextColor: 'hover:qq-text-sky-300',
-            borderColor: 'qq-border-sky-300',
-            hoverBorderColor: 'hover:qq-border-sky-300',
-            ringRolor: 'qq-ring-sky-300',
-            ringColor: 'qq-ring-sky-300',
-            hoverRingColor: 'hover:qq-ring-sky-300',
-            divideColor: 'qq-divide-sky-300',
-            outlineColor: 'qq-outline-sky-300',
-            focusRingColor: 'focus:qq-ring-sky-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-sky-400',
-            hoverBgColor: 'hover:qq-bg-sky-400',
-            textColor: 'qq-text-sky-400',
-            hoverTextColor: 'hover:qq-text-sky-400',
-            borderColor: 'qq-border-sky-400',
-            hoverBorderColor: 'hover:qq-border-sky-400',
-            ringRolor: 'qq-ring-sky-400',
-            ringColor: 'qq-ring-sky-400',
-            hoverRingColor: 'hover:qq-ring-sky-400',
-            divideColor: 'qq-divide-sky-400',
-            outlineColor: 'qq-outline-sky-400',
-            focusRingColor: 'focus:qq-ring-sky-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-sky-500',
-            hoverBgColor: 'hover:qq-bg-sky-500',
-            textColor: 'qq-text-sky-500',
-            hoverTextColor: 'hover:qq-text-sky-500',
-            borderColor: 'qq-border-sky-500',
-            hoverBorderColor: 'hover:qq-border-sky-500',
-            ringRolor: 'qq-ring-sky-500',
-            ringColor: 'qq-ring-sky-500',
-            hoverRingColor: 'hover:qq-ring-sky-500',
-            divideColor: 'qq-divide-sky-500',
-            outlineColor: 'qq-outline-sky-500',
-            focusRingColor: 'focus:qq-ring-sky-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-sky-600',
-            hoverBgColor: 'hover:qq-bg-sky-600',
-            textColor: 'qq-text-sky-600',
-            hoverTextColor: 'hover:qq-text-sky-600',
-            borderColor: 'qq-border-sky-600',
-            hoverBorderColor: 'hover:qq-border-sky-600',
-            ringRolor: 'qq-ring-sky-600',
-            ringColor: 'qq-ring-sky-600',
-            hoverRingColor: 'hover:qq-ring-sky-600',
-            divideColor: 'qq-divide-sky-600',
-            outlineColor: 'qq-outline-sky-600',
-            focusRingColor: 'focus:qq-ring-sky-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-sky-700',
-            hoverBgColor: 'hover:qq-bg-sky-700',
-            textColor: 'qq-text-sky-700',
-            hoverTextColor: 'hover:qq-text-sky-700',
-            borderColor: 'qq-border-sky-700',
-            hoverBorderColor: 'hover:qq-border-sky-700',
-            ringRolor: 'qq-ring-sky-700',
-            ringColor: 'qq-ring-sky-700',
-            hoverRingColor: 'hover:qq-ring-sky-700',
-            divideColor: 'qq-divide-sky-700',
-            outlineColor: 'qq-outline-sky-700',
-            focusRingColor: 'focus:qq-ring-sky-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-sky-800',
-            hoverBgColor: 'hover:qq-bg-sky-800',
-            textColor: 'qq-text-sky-800',
-            hoverTextColor: 'hover:qq-text-sky-800',
-            borderColor: 'qq-border-sky-800',
-            hoverBorderColor: 'hover:qq-border-sky-800',
-            ringRolor: 'qq-ring-sky-800',
-            ringColor: 'qq-ring-sky-800',
-            hoverRingColor: 'hover:qq-ring-sky-800',
-            divideColor: 'qq-divide-sky-800',
-            outlineColor: 'qq-outline-sky-800',
-            focusRingColor: 'focus:qq-ring-sky-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-sky-900',
-            hoverBgColor: 'hover:qq-bg-sky-900',
-            textColor: 'qq-text-sky-900',
-            hoverTextColor: 'hover:qq-text-sky-900',
-            borderColor: 'qq-border-sky-900',
-            hoverBorderColor: 'hover:qq-border-sky-900',
-            ringRolor: 'qq-ring-sky-900',
-            ringColor: 'qq-ring-sky-900',
-            hoverRingColor: 'hover:qq-ring-sky-900',
-            divideColor: 'qq-divide-sky-900',
-            outlineColor: 'qq-outline-sky-900',
-            focusRingColor: 'focus:qq-ring-sky-900',
-        },
-    },
-    blue: {
-        '50': {
-            bgColor: 'qq-bg-blue-50',
-            hoverBgColor: 'hover:qq-bg-blue-50',
-            textColor: 'qq-text-blue-50',
-            hoverTextColor: 'hover:qq-text-blue-50',
-            borderColor: 'qq-border-blue-50',
-            hoverBorderColor: 'hover:qq-border-blue-50',
-            ringRolor: 'qq-ring-blue-50',
-            ringColor: 'qq-ring-blue-50',
-            hoverRingColor: 'hover:qq-ring-blue-50',
-            divideColor: 'qq-divide-blue-50',
-            outlineColor: 'qq-outline-blue-50',
-            focusRingColor: 'focus:qq-ring-blue-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-blue-100',
-            hoverBgColor: 'hover:qq-bg-blue-100',
-            textColor: 'qq-text-blue-100',
-            hoverTextColor: 'hover:qq-text-blue-100',
-            borderColor: 'qq-border-blue-100',
-            hoverBorderColor: 'hover:qq-border-blue-100',
-            ringRolor: 'qq-ring-blue-100',
-            ringColor: 'qq-ring-blue-100',
-            hoverRingColor: 'hover:qq-ring-blue-100',
-            divideColor: 'qq-divide-blue-100',
-            outlineColor: 'qq-outline-blue-100',
-            focusRingColor: 'focus:qq-ring-blue-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-blue-200',
-            hoverBgColor: 'hover:qq-bg-blue-200',
-            textColor: 'qq-text-blue-200',
-            hoverTextColor: 'hover:qq-text-blue-200',
-            borderColor: 'qq-border-blue-200',
-            hoverBorderColor: 'hover:qq-border-blue-200',
-            ringRolor: 'qq-ring-blue-200',
-            ringColor: 'qq-ring-blue-200',
-            hoverRingColor: 'hover:qq-ring-blue-200',
-            divideColor: 'qq-divide-blue-200',
-            outlineColor: 'qq-outline-blue-200',
-            focusRingColor: 'focus:qq-ring-blue-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-blue-300',
-            hoverBgColor: 'hover:qq-bg-blue-300',
-            textColor: 'qq-text-blue-300',
-            hoverTextColor: 'hover:qq-text-blue-300',
-            borderColor: 'qq-border-blue-300',
-            hoverBorderColor: 'hover:qq-border-blue-300',
-            ringRolor: 'qq-ring-blue-300',
-            ringColor: 'qq-ring-blue-300',
-            hoverRingColor: 'hover:qq-ring-blue-300',
-            divideColor: 'qq-divide-blue-300',
-            outlineColor: 'qq-outline-blue-300',
-            focusRingColor: 'focus:qq-ring-blue-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-blue-400',
-            hoverBgColor: 'hover:qq-bg-blue-400',
-            textColor: 'qq-text-blue-400',
-            hoverTextColor: 'hover:qq-text-blue-400',
-            borderColor: 'qq-border-blue-400',
-            hoverBorderColor: 'hover:qq-border-blue-400',
-            ringRolor: 'qq-ring-blue-400',
-            ringColor: 'qq-ring-blue-400',
-            hoverRingColor: 'hover:qq-ring-blue-400',
-            divideColor: 'qq-divide-blue-400',
-            outlineColor: 'qq-outline-blue-400',
-            focusRingColor: 'focus:qq-ring-blue-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-blue-500',
-            hoverBgColor: 'hover:qq-bg-blue-500',
-            textColor: 'qq-text-blue-500',
-            hoverTextColor: 'hover:qq-text-blue-500',
-            borderColor: 'qq-border-blue-500',
-            hoverBorderColor: 'hover:qq-border-blue-500',
-            ringRolor: 'qq-ring-blue-500',
-            ringColor: 'qq-ring-blue-500',
-            hoverRingColor: 'hover:qq-ring-blue-500',
-            divideColor: 'qq-divide-blue-500',
-            outlineColor: 'qq-outline-blue-500',
-            focusRingColor: 'focus:qq-ring-blue-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-blue-600',
-            hoverBgColor: 'hover:qq-bg-blue-600',
-            textColor: 'qq-text-blue-600',
-            hoverTextColor: 'hover:qq-text-blue-600',
-            borderColor: 'qq-border-blue-600',
-            hoverBorderColor: 'hover:qq-border-blue-600',
-            ringRolor: 'qq-ring-blue-600',
-            ringColor: 'qq-ring-blue-600',
-            hoverRingColor: 'hover:qq-ring-blue-600',
-            divideColor: 'qq-divide-blue-600',
-            outlineColor: 'qq-outline-blue-600',
-            focusRingColor: 'focus:qq-ring-blue-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-blue-700',
-            hoverBgColor: 'hover:qq-bg-blue-700',
-            textColor: 'qq-text-blue-700',
-            hoverTextColor: 'hover:qq-text-blue-700',
-            borderColor: 'qq-border-blue-700',
-            hoverBorderColor: 'hover:qq-border-blue-700',
-            ringRolor: 'qq-ring-blue-700',
-            ringColor: 'qq-ring-blue-700',
-            hoverRingColor: 'hover:qq-ring-blue-700',
-            divideColor: 'qq-divide-blue-700',
-            outlineColor: 'qq-outline-blue-700',
-            focusRingColor: 'focus:qq-ring-blue-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-blue-800',
-            hoverBgColor: 'hover:qq-bg-blue-800',
-            textColor: 'qq-text-blue-800',
-            hoverTextColor: 'hover:qq-text-blue-800',
-            borderColor: 'qq-border-blue-800',
-            hoverBorderColor: 'hover:qq-border-blue-800',
-            ringRolor: 'qq-ring-blue-800',
-            ringColor: 'qq-ring-blue-800',
-            hoverRingColor: 'hover:qq-ring-blue-800',
-            divideColor: 'qq-divide-blue-800',
-            outlineColor: 'qq-outline-blue-800',
-            focusRingColor: 'focus:qq-ring-blue-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-blue-900',
-            hoverBgColor: 'hover:qq-bg-blue-900',
-            textColor: 'qq-text-blue-900',
-            hoverTextColor: 'hover:qq-text-blue-900',
-            borderColor: 'qq-border-blue-900',
-            hoverBorderColor: 'hover:qq-border-blue-900',
-            ringRolor: 'qq-ring-blue-900',
-            ringColor: 'qq-ring-blue-900',
-            hoverRingColor: 'hover:qq-ring-blue-900',
-            divideColor: 'qq-divide-blue-900',
-            outlineColor: 'qq-outline-blue-900',
-            focusRingColor: 'focus:qq-ring-blue-900',
-        },
-    },
-    indigo: {
-        '50': {
-            bgColor: 'qq-bg-indigo-50',
-            hoverBgColor: 'hover:qq-bg-indigo-50',
-            textColor: 'qq-text-indigo-50',
-            hoverTextColor: 'hover:qq-text-indigo-50',
-            borderColor: 'qq-border-indigo-50',
-            hoverBorderColor: 'hover:qq-border-indigo-50',
-            ringRolor: 'qq-ring-indigo-50',
-            ringColor: 'qq-ring-indigo-50',
-            hoverRingColor: 'hover:qq-ring-indigo-50',
-            divideColor: 'qq-divide-indigo-50',
-            outlineColor: 'qq-outline-indigo-50',
-            focusRingColor: 'focus:qq-ring-indigo-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-indigo-100',
-            hoverBgColor: 'hover:qq-bg-indigo-100',
-            textColor: 'qq-text-indigo-100',
-            hoverTextColor: 'hover:qq-text-indigo-100',
-            borderColor: 'qq-border-indigo-100',
-            hoverBorderColor: 'hover:qq-border-indigo-100',
-            ringRolor: 'qq-ring-indigo-100',
-            ringColor: 'qq-ring-indigo-100',
-            hoverRingColor: 'hover:qq-ring-indigo-100',
-            divideColor: 'qq-divide-indigo-100',
-            outlineColor: 'qq-outline-indigo-100',
-            focusRingColor: 'focus:qq-ring-indigo-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-indigo-200',
-            hoverBgColor: 'hover:qq-bg-indigo-200',
-            textColor: 'qq-text-indigo-200',
-            hoverTextColor: 'hover:qq-text-indigo-200',
-            borderColor: 'qq-border-indigo-200',
-            hoverBorderColor: 'hover:qq-border-indigo-200',
-            ringRolor: 'qq-ring-indigo-200',
-            ringColor: 'qq-ring-indigo-200',
-            hoverRingColor: 'hover:qq-ring-indigo-200',
-            divideColor: 'qq-divide-indigo-200',
-            outlineColor: 'qq-outline-indigo-200',
-            focusRingColor: 'focus:qq-ring-indigo-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-indigo-300',
-            hoverBgColor: 'hover:qq-bg-indigo-300',
-            textColor: 'qq-text-indigo-300',
-            hoverTextColor: 'hover:qq-text-indigo-300',
-            borderColor: 'qq-border-indigo-300',
-            hoverBorderColor: 'hover:qq-border-indigo-300',
-            ringRolor: 'qq-ring-indigo-300',
-            ringColor: 'qq-ring-indigo-300',
-            hoverRingColor: 'hover:qq-ring-indigo-300',
-            divideColor: 'qq-divide-indigo-300',
-            outlineColor: 'qq-outline-indigo-300',
-            focusRingColor: 'focus:qq-ring-indigo-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-indigo-400',
-            hoverBgColor: 'hover:qq-bg-indigo-400',
-            textColor: 'qq-text-indigo-400',
-            hoverTextColor: 'hover:qq-text-indigo-400',
-            borderColor: 'qq-border-indigo-400',
-            hoverBorderColor: 'hover:qq-border-indigo-400',
-            ringRolor: 'qq-ring-indigo-400',
-            ringColor: 'qq-ring-indigo-400',
-            hoverRingColor: 'hover:qq-ring-indigo-400',
-            divideColor: 'qq-divide-indigo-400',
-            outlineColor: 'qq-outline-indigo-400',
-            focusRingColor: 'focus:qq-ring-indigo-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-indigo-500',
-            hoverBgColor: 'hover:qq-bg-indigo-500',
-            textColor: 'qq-text-indigo-500',
-            hoverTextColor: 'hover:qq-text-indigo-500',
-            borderColor: 'qq-border-indigo-500',
-            hoverBorderColor: 'hover:qq-border-indigo-500',
-            ringRolor: 'qq-ring-indigo-500',
-            ringColor: 'qq-ring-indigo-500',
-            hoverRingColor: 'hover:qq-ring-indigo-500',
-            divideColor: 'qq-divide-indigo-500',
-            outlineColor: 'qq-outline-indigo-500',
-            focusRingColor: 'focus:qq-ring-indigo-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-indigo-600',
-            hoverBgColor: 'hover:qq-bg-indigo-600',
-            textColor: 'qq-text-indigo-600',
-            hoverTextColor: 'hover:qq-text-indigo-600',
-            borderColor: 'qq-border-indigo-600',
-            hoverBorderColor: 'hover:qq-border-indigo-600',
-            ringRolor: 'qq-ring-indigo-600',
-            ringColor: 'qq-ring-indigo-600',
-            hoverRingColor: 'hover:qq-ring-indigo-600',
-            divideColor: 'qq-divide-indigo-600',
-            outlineColor: 'qq-outline-indigo-600',
-            focusRingColor: 'focus:qq-ring-indigo-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-indigo-700',
-            hoverBgColor: 'hover:qq-bg-indigo-700',
-            textColor: 'qq-text-indigo-700',
-            hoverTextColor: 'hover:qq-text-indigo-700',
-            borderColor: 'qq-border-indigo-700',
-            hoverBorderColor: 'hover:qq-border-indigo-700',
-            ringRolor: 'qq-ring-indigo-700',
-            ringColor: 'qq-ring-indigo-700',
-            hoverRingColor: 'hover:qq-ring-indigo-700',
-            divideColor: 'qq-divide-indigo-700',
-            outlineColor: 'qq-outline-indigo-700',
-            focusRingColor: 'focus:qq-ring-indigo-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-indigo-800',
-            hoverBgColor: 'hover:qq-bg-indigo-800',
-            textColor: 'qq-text-indigo-800',
-            hoverTextColor: 'hover:qq-text-indigo-800',
-            borderColor: 'qq-border-indigo-800',
-            hoverBorderColor: 'hover:qq-border-indigo-800',
-            ringRolor: 'qq-ring-indigo-800',
-            ringColor: 'qq-ring-indigo-800',
-            hoverRingColor: 'hover:qq-ring-indigo-800',
-            divideColor: 'qq-divide-indigo-800',
-            outlineColor: 'qq-outline-indigo-800',
-            focusRingColor: 'focus:qq-ring-indigo-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-indigo-900',
-            hoverBgColor: 'hover:qq-bg-indigo-900',
-            textColor: 'qq-text-indigo-900',
-            hoverTextColor: 'hover:qq-text-indigo-900',
-            borderColor: 'qq-border-indigo-900',
-            hoverBorderColor: 'hover:qq-border-indigo-900',
-            ringRolor: 'qq-ring-indigo-900',
-            ringColor: 'qq-ring-indigo-900',
-            hoverRingColor: 'hover:qq-ring-indigo-900',
-            divideColor: 'qq-divide-indigo-900',
-            outlineColor: 'qq-outline-indigo-900',
-            focusRingColor: 'focus:qq-ring-indigo-900',
-        },
-    },
-    violet: {
-        '50': {
-            bgColor: 'qq-bg-violet-50',
-            hoverBgColor: 'hover:qq-bg-violet-50',
-            textColor: 'qq-text-violet-50',
-            hoverTextColor: 'hover:qq-text-violet-50',
-            borderColor: 'qq-border-violet-50',
-            hoverBorderColor: 'hover:qq-border-violet-50',
-            ringRolor: 'qq-ring-violet-50',
-            ringColor: 'qq-ring-violet-50',
-            hoverRingColor: 'hover:qq-ring-violet-50',
-            divideColor: 'qq-divide-violet-50',
-            outlineColor: 'qq-outline-violet-50',
-            focusRingColor: 'focus:qq-ring-violet-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-violet-100',
-            hoverBgColor: 'hover:qq-bg-violet-100',
-            textColor: 'qq-text-violet-100',
-            hoverTextColor: 'hover:qq-text-violet-100',
-            borderColor: 'qq-border-violet-100',
-            hoverBorderColor: 'hover:qq-border-violet-100',
-            ringRolor: 'qq-ring-violet-100',
-            ringColor: 'qq-ring-violet-100',
-            hoverRingColor: 'hover:qq-ring-violet-100',
-            divideColor: 'qq-divide-violet-100',
-            outlineColor: 'qq-outline-violet-100',
-            focusRingColor: 'focus:qq-ring-violet-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-violet-200',
-            hoverBgColor: 'hover:qq-bg-violet-200',
-            textColor: 'qq-text-violet-200',
-            hoverTextColor: 'hover:qq-text-violet-200',
-            borderColor: 'qq-border-violet-200',
-            hoverBorderColor: 'hover:qq-border-violet-200',
-            ringRolor: 'qq-ring-violet-200',
-            ringColor: 'qq-ring-violet-200',
-            hoverRingColor: 'hover:qq-ring-violet-200',
-            divideColor: 'qq-divide-violet-200',
-            outlineColor: 'qq-outline-violet-200',
-            focusRingColor: 'focus:qq-ring-violet-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-violet-300',
-            hoverBgColor: 'hover:qq-bg-violet-300',
-            textColor: 'qq-text-violet-300',
-            hoverTextColor: 'hover:qq-text-violet-300',
-            borderColor: 'qq-border-violet-300',
-            hoverBorderColor: 'hover:qq-border-violet-300',
-            ringRolor: 'qq-ring-violet-300',
-            ringColor: 'qq-ring-violet-300',
-            hoverRingColor: 'hover:qq-ring-violet-300',
-            divideColor: 'qq-divide-violet-300',
-            outlineColor: 'qq-outline-violet-300',
-            focusRingColor: 'focus:qq-ring-violet-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-violet-400',
-            hoverBgColor: 'hover:qq-bg-violet-400',
-            textColor: 'qq-text-violet-400',
-            hoverTextColor: 'hover:qq-text-violet-400',
-            borderColor: 'qq-border-violet-400',
-            hoverBorderColor: 'hover:qq-border-violet-400',
-            ringRolor: 'qq-ring-violet-400',
-            ringColor: 'qq-ring-violet-400',
-            hoverRingColor: 'hover:qq-ring-violet-400',
-            divideColor: 'qq-divide-violet-400',
-            outlineColor: 'qq-outline-violet-400',
-            focusRingColor: 'focus:qq-ring-violet-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-violet-500',
-            hoverBgColor: 'hover:qq-bg-violet-500',
-            textColor: 'qq-text-violet-500',
-            hoverTextColor: 'hover:qq-text-violet-500',
-            borderColor: 'qq-border-violet-500',
-            hoverBorderColor: 'hover:qq-border-violet-500',
-            ringRolor: 'qq-ring-violet-500',
-            ringColor: 'qq-ring-violet-500',
-            hoverRingColor: 'hover:qq-ring-violet-500',
-            divideColor: 'qq-divide-violet-500',
-            outlineColor: 'qq-outline-violet-500',
-            focusRingColor: 'focus:qq-ring-violet-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-violet-600',
-            hoverBgColor: 'hover:qq-bg-violet-600',
-            textColor: 'qq-text-violet-600',
-            hoverTextColor: 'hover:qq-text-violet-600',
-            borderColor: 'qq-border-violet-600',
-            hoverBorderColor: 'hover:qq-border-violet-600',
-            ringRolor: 'qq-ring-violet-600',
-            ringColor: 'qq-ring-violet-600',
-            hoverRingColor: 'hover:qq-ring-violet-600',
-            divideColor: 'qq-divide-violet-600',
-            outlineColor: 'qq-outline-violet-600',
-            focusRingColor: 'focus:qq-ring-violet-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-violet-700',
-            hoverBgColor: 'hover:qq-bg-violet-700',
-            textColor: 'qq-text-violet-700',
-            hoverTextColor: 'hover:qq-text-violet-700',
-            borderColor: 'qq-border-violet-700',
-            hoverBorderColor: 'hover:qq-border-violet-700',
-            ringRolor: 'qq-ring-violet-700',
-            ringColor: 'qq-ring-violet-700',
-            hoverRingColor: 'hover:qq-ring-violet-700',
-            divideColor: 'qq-divide-violet-700',
-            outlineColor: 'qq-outline-violet-700',
-            focusRingColor: 'focus:qq-ring-violet-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-violet-800',
-            hoverBgColor: 'hover:qq-bg-violet-800',
-            textColor: 'qq-text-violet-800',
-            hoverTextColor: 'hover:qq-text-violet-800',
-            borderColor: 'qq-border-violet-800',
-            hoverBorderColor: 'hover:qq-border-violet-800',
-            ringRolor: 'qq-ring-violet-800',
-            ringColor: 'qq-ring-violet-800',
-            hoverRingColor: 'hover:qq-ring-violet-800',
-            divideColor: 'qq-divide-violet-800',
-            outlineColor: 'qq-outline-violet-800',
-            focusRingColor: 'focus:qq-ring-violet-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-violet-900',
-            hoverBgColor: 'hover:qq-bg-violet-900',
-            textColor: 'qq-text-violet-900',
-            hoverTextColor: 'hover:qq-text-violet-900',
-            borderColor: 'qq-border-violet-900',
-            hoverBorderColor: 'hover:qq-border-violet-900',
-            ringRolor: 'qq-ring-violet-900',
-            ringColor: 'qq-ring-violet-900',
-            hoverRingColor: 'hover:qq-ring-violet-900',
-            divideColor: 'qq-divide-violet-900',
-            outlineColor: 'qq-outline-violet-900',
-            focusRingColor: 'focus:qq-ring-violet-900',
-        },
-    },
-    purple: {
-        '50': {
-            bgColor: 'qq-bg-purple-50',
-            hoverBgColor: 'hover:qq-bg-purple-50',
-            textColor: 'qq-text-purple-50',
-            hoverTextColor: 'hover:qq-text-purple-50',
-            borderColor: 'qq-border-purple-50',
-            hoverBorderColor: 'hover:qq-border-purple-50',
-            ringRolor: 'qq-ring-purple-50',
-            ringColor: 'qq-ring-purple-50',
-            hoverRingColor: 'hover:qq-ring-purple-50',
-            divideColor: 'qq-divide-purple-50',
-            outlineColor: 'qq-outline-purple-50',
-            focusRingColor: 'focus:qq-ring-purple-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-purple-100',
-            hoverBgColor: 'hover:qq-bg-purple-100',
-            textColor: 'qq-text-purple-100',
-            hoverTextColor: 'hover:qq-text-purple-100',
-            borderColor: 'qq-border-purple-100',
-            hoverBorderColor: 'hover:qq-border-purple-100',
-            ringRolor: 'qq-ring-purple-100',
-            ringColor: 'qq-ring-purple-100',
-            hoverRingColor: 'hover:qq-ring-purple-100',
-            divideColor: 'qq-divide-purple-100',
-            outlineColor: 'qq-outline-purple-100',
-            focusRingColor: 'focus:qq-ring-purple-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-purple-200',
-            hoverBgColor: 'hover:qq-bg-purple-200',
-            textColor: 'qq-text-purple-200',
-            hoverTextColor: 'hover:qq-text-purple-200',
-            borderColor: 'qq-border-purple-200',
-            hoverBorderColor: 'hover:qq-border-purple-200',
-            ringRolor: 'qq-ring-purple-200',
-            ringColor: 'qq-ring-purple-200',
-            hoverRingColor: 'hover:qq-ring-purple-200',
-            divideColor: 'qq-divide-purple-200',
-            outlineColor: 'qq-outline-purple-200',
-            focusRingColor: 'focus:qq-ring-purple-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-purple-300',
-            hoverBgColor: 'hover:qq-bg-purple-300',
-            textColor: 'qq-text-purple-300',
-            hoverTextColor: 'hover:qq-text-purple-300',
-            borderColor: 'qq-border-purple-300',
-            hoverBorderColor: 'hover:qq-border-purple-300',
-            ringRolor: 'qq-ring-purple-300',
-            ringColor: 'qq-ring-purple-300',
-            hoverRingColor: 'hover:qq-ring-purple-300',
-            divideColor: 'qq-divide-purple-300',
-            outlineColor: 'qq-outline-purple-300',
-            focusRingColor: 'focus:qq-ring-purple-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-purple-400',
-            hoverBgColor: 'hover:qq-bg-purple-400',
-            textColor: 'qq-text-purple-400',
-            hoverTextColor: 'hover:qq-text-purple-400',
-            borderColor: 'qq-border-purple-400',
-            hoverBorderColor: 'hover:qq-border-purple-400',
-            ringRolor: 'qq-ring-purple-400',
-            ringColor: 'qq-ring-purple-400',
-            hoverRingColor: 'hover:qq-ring-purple-400',
-            divideColor: 'qq-divide-purple-400',
-            outlineColor: 'qq-outline-purple-400',
-            focusRingColor: 'focus:qq-ring-purple-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-purple-500',
-            hoverBgColor: 'hover:qq-bg-purple-500',
-            textColor: 'qq-text-purple-500',
-            hoverTextColor: 'hover:qq-text-purple-500',
-            borderColor: 'qq-border-purple-500',
-            hoverBorderColor: 'hover:qq-border-purple-500',
-            ringRolor: 'qq-ring-purple-500',
-            ringColor: 'qq-ring-purple-500',
-            hoverRingColor: 'hover:qq-ring-purple-500',
-            divideColor: 'qq-divide-purple-500',
-            outlineColor: 'qq-outline-purple-500',
-            focusRingColor: 'focus:qq-ring-purple-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-purple-600',
-            hoverBgColor: 'hover:qq-bg-purple-600',
-            textColor: 'qq-text-purple-600',
-            hoverTextColor: 'hover:qq-text-purple-600',
-            borderColor: 'qq-border-purple-600',
-            hoverBorderColor: 'hover:qq-border-purple-600',
-            ringRolor: 'qq-ring-purple-600',
-            ringColor: 'qq-ring-purple-600',
-            hoverRingColor: 'hover:qq-ring-purple-600',
-            divideColor: 'qq-divide-purple-600',
-            outlineColor: 'qq-outline-purple-600',
-            focusRingColor: 'focus:qq-ring-purple-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-purple-700',
-            hoverBgColor: 'hover:qq-bg-purple-700',
-            textColor: 'qq-text-purple-700',
-            hoverTextColor: 'hover:qq-text-purple-700',
-            borderColor: 'qq-border-purple-700',
-            hoverBorderColor: 'hover:qq-border-purple-700',
-            ringRolor: 'qq-ring-purple-700',
-            ringColor: 'qq-ring-purple-700',
-            hoverRingColor: 'hover:qq-ring-purple-700',
-            divideColor: 'qq-divide-purple-700',
-            outlineColor: 'qq-outline-purple-700',
-            focusRingColor: 'focus:qq-ring-purple-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-purple-800',
-            hoverBgColor: 'hover:qq-bg-purple-800',
-            textColor: 'qq-text-purple-800',
-            hoverTextColor: 'hover:qq-text-purple-800',
-            borderColor: 'qq-border-purple-800',
-            hoverBorderColor: 'hover:qq-border-purple-800',
-            ringRolor: 'qq-ring-purple-800',
-            ringColor: 'qq-ring-purple-800',
-            hoverRingColor: 'hover:qq-ring-purple-800',
-            divideColor: 'qq-divide-purple-800',
-            outlineColor: 'qq-outline-purple-800',
-            focusRingColor: 'focus:qq-ring-purple-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-purple-900',
-            hoverBgColor: 'hover:qq-bg-purple-900',
-            textColor: 'qq-text-purple-900',
-            hoverTextColor: 'hover:qq-text-purple-900',
-            borderColor: 'qq-border-purple-900',
-            hoverBorderColor: 'hover:qq-border-purple-900',
-            ringRolor: 'qq-ring-purple-900',
-            ringColor: 'qq-ring-purple-900',
-            hoverRingColor: 'hover:qq-ring-purple-900',
-            divideColor: 'qq-divide-purple-900',
-            outlineColor: 'qq-outline-purple-900',
-            focusRingColor: 'focus:qq-ring-purple-900',
-        },
-    },
-    fuchsia: {
-        '50': {
-            bgColor: 'qq-bg-fuchsia-50',
-            hoverBgColor: 'hover:qq-bg-fuchsia-50',
-            textColor: 'qq-text-fuchsia-50',
-            hoverTextColor: 'hover:qq-text-fuchsia-50',
-            borderColor: 'qq-border-fuchsia-50',
-            hoverBorderColor: 'hover:qq-border-fuchsia-50',
-            ringRolor: 'qq-ring-fuchsia-50',
-            ringColor: 'qq-ring-fuchsia-50',
-            hoverRingColor: 'hover:qq-ring-fuchsia-50',
-            divideColor: 'qq-divide-fuchsia-50',
-            outlineColor: 'qq-outline-fuchsia-50',
-            focusRingColor: 'focus:qq-ring-fuchsia-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-fuchsia-100',
-            hoverBgColor: 'hover:qq-bg-fuchsia-100',
-            textColor: 'qq-text-fuchsia-100',
-            hoverTextColor: 'hover:qq-text-fuchsia-100',
-            borderColor: 'qq-border-fuchsia-100',
-            hoverBorderColor: 'hover:qq-border-fuchsia-100',
-            ringRolor: 'qq-ring-fuchsia-100',
-            ringColor: 'qq-ring-fuchsia-100',
-            hoverRingColor: 'hover:qq-ring-fuchsia-100',
-            divideColor: 'qq-divide-fuchsia-100',
-            outlineColor: 'qq-outline-fuchsia-100',
-            focusRingColor: 'focus:qq-ring-fuchsia-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-fuchsia-200',
-            hoverBgColor: 'hover:qq-bg-fuchsia-200',
-            textColor: 'qq-text-fuchsia-200',
-            hoverTextColor: 'hover:qq-text-fuchsia-200',
-            borderColor: 'qq-border-fuchsia-200',
-            hoverBorderColor: 'hover:qq-border-fuchsia-200',
-            ringRolor: 'qq-ring-fuchsia-200',
-            ringColor: 'qq-ring-fuchsia-200',
-            hoverRingColor: 'hover:qq-ring-fuchsia-200',
-            divideColor: 'qq-divide-fuchsia-200',
-            outlineColor: 'qq-outline-fuchsia-200',
-            focusRingColor: 'focus:qq-ring-fuchsia-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-fuchsia-300',
-            hoverBgColor: 'hover:qq-bg-fuchsia-300',
-            textColor: 'qq-text-fuchsia-300',
-            hoverTextColor: 'hover:qq-text-fuchsia-300',
-            borderColor: 'qq-border-fuchsia-300',
-            hoverBorderColor: 'hover:qq-border-fuchsia-300',
-            ringRolor: 'qq-ring-fuchsia-300',
-            ringColor: 'qq-ring-fuchsia-300',
-            hoverRingColor: 'hover:qq-ring-fuchsia-300',
-            divideColor: 'qq-divide-fuchsia-300',
-            outlineColor: 'qq-outline-fuchsia-300',
-            focusRingColor: 'focus:qq-ring-fuchsia-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-fuchsia-400',
-            hoverBgColor: 'hover:qq-bg-fuchsia-400',
-            textColor: 'qq-text-fuchsia-400',
-            hoverTextColor: 'hover:qq-text-fuchsia-400',
-            borderColor: 'qq-border-fuchsia-400',
-            hoverBorderColor: 'hover:qq-border-fuchsia-400',
-            ringRolor: 'qq-ring-fuchsia-400',
-            ringColor: 'qq-ring-fuchsia-400',
-            hoverRingColor: 'hover:qq-ring-fuchsia-400',
-            divideColor: 'qq-divide-fuchsia-400',
-            outlineColor: 'qq-outline-fuchsia-400',
-            focusRingColor: 'focus:qq-ring-fuchsia-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-fuchsia-500',
-            hoverBgColor: 'hover:qq-bg-fuchsia-500',
-            textColor: 'qq-text-fuchsia-500',
-            hoverTextColor: 'hover:qq-text-fuchsia-500',
-            borderColor: 'qq-border-fuchsia-500',
-            hoverBorderColor: 'hover:qq-border-fuchsia-500',
-            ringRolor: 'qq-ring-fuchsia-500',
-            ringColor: 'qq-ring-fuchsia-500',
-            hoverRingColor: 'hover:qq-ring-fuchsia-500',
-            divideColor: 'qq-divide-fuchsia-500',
-            outlineColor: 'qq-outline-fuchsia-500',
-            focusRingColor: 'focus:qq-ring-fuchsia-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-fuchsia-600',
-            hoverBgColor: 'hover:qq-bg-fuchsia-600',
-            textColor: 'qq-text-fuchsia-600',
-            hoverTextColor: 'hover:qq-text-fuchsia-600',
-            borderColor: 'qq-border-fuchsia-600',
-            hoverBorderColor: 'hover:qq-border-fuchsia-600',
-            ringRolor: 'qq-ring-fuchsia-600',
-            ringColor: 'qq-ring-fuchsia-600',
-            hoverRingColor: 'hover:qq-ring-fuchsia-600',
-            divideColor: 'qq-divide-fuchsia-600',
-            outlineColor: 'qq-outline-fuchsia-600',
-            focusRingColor: 'focus:qq-ring-fuchsia-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-fuchsia-700',
-            hoverBgColor: 'hover:qq-bg-fuchsia-700',
-            textColor: 'qq-text-fuchsia-700',
-            hoverTextColor: 'hover:qq-text-fuchsia-700',
-            borderColor: 'qq-border-fuchsia-700',
-            hoverBorderColor: 'hover:qq-border-fuchsia-700',
-            ringRolor: 'qq-ring-fuchsia-700',
-            ringColor: 'qq-ring-fuchsia-700',
-            hoverRingColor: 'hover:qq-ring-fuchsia-700',
-            divideColor: 'qq-divide-fuchsia-700',
-            outlineColor: 'qq-outline-fuchsia-700',
-            focusRingColor: 'focus:qq-ring-fuchsia-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-fuchsia-800',
-            hoverBgColor: 'hover:qq-bg-fuchsia-800',
-            textColor: 'qq-text-fuchsia-800',
-            hoverTextColor: 'hover:qq-text-fuchsia-800',
-            borderColor: 'qq-border-fuchsia-800',
-            hoverBorderColor: 'hover:qq-border-fuchsia-800',
-            ringRolor: 'qq-ring-fuchsia-800',
-            ringColor: 'qq-ring-fuchsia-800',
-            hoverRingColor: 'hover:qq-ring-fuchsia-800',
-            divideColor: 'qq-divide-fuchsia-800',
-            outlineColor: 'qq-outline-fuchsia-800',
-            focusRingColor: 'focus:qq-ring-fuchsia-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-fuchsia-900',
-            hoverBgColor: 'hover:qq-bg-fuchsia-900',
-            textColor: 'qq-text-fuchsia-900',
-            hoverTextColor: 'hover:qq-text-fuchsia-900',
-            borderColor: 'qq-border-fuchsia-900',
-            hoverBorderColor: 'hover:qq-border-fuchsia-900',
-            ringRolor: 'qq-ring-fuchsia-900',
-            ringColor: 'qq-ring-fuchsia-900',
-            hoverRingColor: 'hover:qq-ring-fuchsia-900',
-            divideColor: 'qq-divide-fuchsia-900',
-            outlineColor: 'qq-outline-fuchsia-900',
-            focusRingColor: 'focus:qq-ring-fuchsia-900',
-        },
-    },
-    pink: {
-        '50': {
-            bgColor: 'qq-bg-pink-50',
-            hoverBgColor: 'hover:qq-bg-pink-50',
-            textColor: 'qq-text-pink-50',
-            hoverTextColor: 'hover:qq-text-pink-50',
-            borderColor: 'qq-border-pink-50',
-            hoverBorderColor: 'hover:qq-border-pink-50',
-            ringRolor: 'qq-ring-pink-50',
-            ringColor: 'qq-ring-pink-50',
-            hoverRingColor: 'hover:qq-ring-pink-50',
-            divideColor: 'qq-divide-pink-50',
-            outlineColor: 'qq-outline-pink-50',
-            focusRingColor: 'focus:qq-ring-pink-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-pink-100',
-            hoverBgColor: 'hover:qq-bg-pink-100',
-            textColor: 'qq-text-pink-100',
-            hoverTextColor: 'hover:qq-text-pink-100',
-            borderColor: 'qq-border-pink-100',
-            hoverBorderColor: 'hover:qq-border-pink-100',
-            ringRolor: 'qq-ring-pink-100',
-            ringColor: 'qq-ring-pink-100',
-            hoverRingColor: 'hover:qq-ring-pink-100',
-            divideColor: 'qq-divide-pink-100',
-            outlineColor: 'qq-outline-pink-100',
-            focusRingColor: 'focus:qq-ring-pink-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-pink-200',
-            hoverBgColor: 'hover:qq-bg-pink-200',
-            textColor: 'qq-text-pink-200',
-            hoverTextColor: 'hover:qq-text-pink-200',
-            borderColor: 'qq-border-pink-200',
-            hoverBorderColor: 'hover:qq-border-pink-200',
-            ringRolor: 'qq-ring-pink-200',
-            ringColor: 'qq-ring-pink-200',
-            hoverRingColor: 'hover:qq-ring-pink-200',
-            divideColor: 'qq-divide-pink-200',
-            outlineColor: 'qq-outline-pink-200',
-            focusRingColor: 'focus:qq-ring-pink-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-pink-300',
-            hoverBgColor: 'hover:qq-bg-pink-300',
-            textColor: 'qq-text-pink-300',
-            hoverTextColor: 'hover:qq-text-pink-300',
-            borderColor: 'qq-border-pink-300',
-            hoverBorderColor: 'hover:qq-border-pink-300',
-            ringRolor: 'qq-ring-pink-300',
-            ringColor: 'qq-ring-pink-300',
-            hoverRingColor: 'hover:qq-ring-pink-300',
-            divideColor: 'qq-divide-pink-300',
-            outlineColor: 'qq-outline-pink-300',
-            focusRingColor: 'focus:qq-ring-pink-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-pink-400',
-            hoverBgColor: 'hover:qq-bg-pink-400',
-            textColor: 'qq-text-pink-400',
-            hoverTextColor: 'hover:qq-text-pink-400',
-            borderColor: 'qq-border-pink-400',
-            hoverBorderColor: 'hover:qq-border-pink-400',
-            ringRolor: 'qq-ring-pink-400',
-            ringColor: 'qq-ring-pink-400',
-            hoverRingColor: 'hover:qq-ring-pink-400',
-            divideColor: 'qq-divide-pink-400',
-            outlineColor: 'qq-outline-pink-400',
-            focusRingColor: 'focus:qq-ring-pink-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-pink-500',
-            hoverBgColor: 'hover:qq-bg-pink-500',
-            textColor: 'qq-text-pink-500',
-            hoverTextColor: 'hover:qq-text-pink-500',
-            borderColor: 'qq-border-pink-500',
-            hoverBorderColor: 'hover:qq-border-pink-500',
-            ringRolor: 'qq-ring-pink-500',
-            ringColor: 'qq-ring-pink-500',
-            hoverRingColor: 'hover:qq-ring-pink-500',
-            divideColor: 'qq-divide-pink-500',
-            outlineColor: 'qq-outline-pink-500',
-            focusRingColor: 'focus:qq-ring-pink-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-pink-600',
-            hoverBgColor: 'hover:qq-bg-pink-600',
-            textColor: 'qq-text-pink-600',
-            hoverTextColor: 'hover:qq-text-pink-600',
-            borderColor: 'qq-border-pink-600',
-            hoverBorderColor: 'hover:qq-border-pink-600',
-            ringRolor: 'qq-ring-pink-600',
-            ringColor: 'qq-ring-pink-600',
-            hoverRingColor: 'hover:qq-ring-pink-600',
-            divideColor: 'qq-divide-pink-600',
-            outlineColor: 'qq-outline-pink-600',
-            focusRingColor: 'focus:qq-ring-pink-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-pink-700',
-            hoverBgColor: 'hover:qq-bg-pink-700',
-            textColor: 'qq-text-pink-700',
-            hoverTextColor: 'hover:qq-text-pink-700',
-            borderColor: 'qq-border-pink-700',
-            hoverBorderColor: 'hover:qq-border-pink-700',
-            ringRolor: 'qq-ring-pink-700',
-            ringColor: 'qq-ring-pink-700',
-            hoverRingColor: 'hover:qq-ring-pink-700',
-            divideColor: 'qq-divide-pink-700',
-            outlineColor: 'qq-outline-pink-700',
-            focusRingColor: 'focus:qq-ring-pink-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-pink-700',
-            hoverBgColor: 'hover:qq-bg-pink-700',
-            textColor: 'qq-text-pink-700',
-            hoverTextColor: 'hover:qq-text-pink-700',
-            borderColor: 'qq-border-pink-700',
-            hoverBorderColor: 'hover:qq-border-pink-700',
-            ringRolor: 'qq-ring-pink-700',
-            ringColor: 'qq-ring-pink-700',
-            hoverRingColor: 'hover:qq-ring-pink-700',
-            divideColor: 'qq-divide-pink-700',
-            outlineColor: 'qq-outline-pink-700',
-            focusRingColor: 'focus:qq-ring-pink-700',
-        },
-        '900': {
-            bgColor: 'qq-bg-pink-900',
-            hoverBgColor: 'hover:qq-bg-pink-900',
-            textColor: 'qq-text-pink-900',
-            hoverTextColor: 'hover:qq-text-pink-900',
-            borderColor: 'qq-border-pink-900',
-            hoverBorderColor: 'hover:qq-border-pink-900',
-            ringRolor: 'qq-ring-pink-900',
-            ringColor: 'qq-ring-pink-900',
-            hoverRingColor: 'hover:qq-ring-pink-900',
-            divideColor: 'qq-divide-pink-900',
-            outlineColor: 'qq-outline-pink-900',
-            focusRingColor: 'focus:qq-ring-pink-900',
-        },
-    },
-    rose: {
-        '50': {
-            bgColor: 'qq-bg-rose-50',
-            hoverBgColor: 'hover:qq-bg-rose-50',
-            textColor: 'qq-text-rose-50',
-            hoverTextColor: 'hover:qq-text-rose-50',
-            borderColor: 'qq-border-rose-50',
-            hoverBorderColor: 'hover:qq-border-rose-50',
-            ringRolor: 'qq-ring-rose-50',
-            ringColor: 'qq-ring-rose-50',
-            hoverRingColor: 'hover:qq-ring-rose-50',
-            divideColor: 'qq-divide-rose-50',
-            outlineColor: 'qq-outline-rose-50',
-            focusRingColor: 'focus:qq-ring-rose-50',
-        },
-        '100': {
-            bgColor: 'qq-bg-rose-100',
-            hoverBgColor: 'hover:qq-bg-rose-100',
-            textColor: 'qq-text-rose-100',
-            hoverTextColor: 'hover:qq-text-rose-100',
-            borderColor: 'qq-border-rose-100',
-            hoverBorderColor: 'hover:qq-border-rose-100',
-            ringRolor: 'qq-ring-rose-100',
-            ringColor: 'qq-ring-rose-100',
-            hoverRingColor: 'hover:qq-ring-rose-100',
-            divideColor: 'qq-divide-rose-100',
-            outlineColor: 'qq-outline-rose-100',
-            focusRingColor: 'focus:qq-ring-rose-100',
-        },
-        '200': {
-            bgColor: 'qq-bg-rose-200',
-            hoverBgColor: 'hover:qq-bg-rose-200',
-            textColor: 'qq-text-rose-200',
-            hoverTextColor: 'hover:qq-text-rose-200',
-            borderColor: 'qq-border-rose-200',
-            hoverBorderColor: 'hover:qq-border-rose-200',
-            ringRolor: 'qq-ring-rose-200',
-            ringColor: 'qq-ring-rose-200',
-            hoverRingColor: 'hover:qq-ring-rose-200',
-            divideColor: 'qq-divide-rose-200',
-            outlineColor: 'qq-outline-rose-200',
-            focusRingColor: 'focus:qq-ring-rose-200',
-        },
-        '300': {
-            bgColor: 'qq-bg-rose-300',
-            hoverBgColor: 'hover:qq-bg-rose-300',
-            textColor: 'qq-text-rose-300',
-            hoverTextColor: 'hover:qq-text-rose-300',
-            borderColor: 'qq-border-rose-300',
-            hoverBorderColor: 'hover:qq-border-rose-300',
-            ringRolor: 'qq-ring-rose-300',
-            ringColor: 'qq-ring-rose-300',
-            hoverRingColor: 'hover:qq-ring-rose-300',
-            divideColor: 'qq-divide-rose-300',
-            outlineColor: 'qq-outline-rose-300',
-            focusRingColor: 'focus:qq-ring-rose-300',
-        },
-        '400': {
-            bgColor: 'qq-bg-rose-400',
-            hoverBgColor: 'hover:qq-bg-rose-400',
-            textColor: 'qq-text-rose-400',
-            hoverTextColor: 'hover:qq-text-rose-400',
-            borderColor: 'qq-border-rose-400',
-            hoverBorderColor: 'hover:qq-border-rose-400',
-            ringRolor: 'qq-ring-rose-400',
-            ringColor: 'qq-ring-rose-400',
-            hoverRingColor: 'hover:qq-ring-rose-400',
-            divideColor: 'qq-divide-rose-400',
-            outlineColor: 'qq-outline-rose-400',
-            focusRingColor: 'focus:qq-ring-rose-400',
-        },
-        '500': {
-            bgColor: 'qq-bg-rose-500',
-            hoverBgColor: 'hover:qq-bg-rose-500',
-            textColor: 'qq-text-rose-500',
-            hoverTextColor: 'hover:qq-text-rose-500',
-            borderColor: 'qq-border-rose-500',
-            hoverBorderColor: 'hover:qq-border-rose-500',
-            ringRolor: 'qq-ring-rose-500',
-            ringColor: 'qq-ring-rose-500',
-            hoverRingColor: 'hover:qq-ring-rose-500',
-            divideColor: 'qq-divide-rose-500',
-            outlineColor: 'qq-outline-rose-500',
-            focusRingColor: 'focus:qq-ring-rose-500',
-        },
-        '600': {
-            bgColor: 'qq-bg-rose-600',
-            hoverBgColor: 'hover:qq-bg-rose-600',
-            textColor: 'qq-text-rose-600',
-            hoverTextColor: 'hover:qq-text-rose-600',
-            borderColor: 'qq-border-rose-600',
-            hoverBorderColor: 'hover:qq-border-rose-600',
-            ringRolor: 'qq-ring-rose-600',
-            ringColor: 'qq-ring-rose-600',
-            hoverRingColor: 'hover:qq-ring-rose-600',
-            divideColor: 'qq-divide-rose-600',
-            outlineColor: 'qq-outline-rose-600',
-            focusRingColor: 'focus:qq-ring-rose-600',
-        },
-        '700': {
-            bgColor: 'qq-bg-rose-700',
-            hoverBgColor: 'hover:qq-bg-rose-700',
-            textColor: 'qq-text-rose-700',
-            hoverTextColor: 'hover:qq-text-rose-700',
-            borderColor: 'qq-border-rose-700',
-            hoverBorderColor: 'hover:qq-border-rose-700',
-            ringRolor: 'qq-ring-rose-700',
-            ringColor: 'qq-ring-rose-700',
-            hoverRingColor: 'hover:qq-ring-rose-700',
-            divideColor: 'qq-divide-rose-700',
-            outlineColor: 'qq-outline-rose-700',
-            focusRingColor: 'focus:qq-ring-rose-700',
-        },
-        '800': {
-            bgColor: 'qq-bg-rose-800',
-            hoverBgColor: 'hover:qq-bg-rose-800',
-            textColor: 'qq-text-rose-800',
-            hoverTextColor: 'hover:qq-text-rose-800',
-            borderColor: 'qq-border-rose-800',
-            hoverBorderColor: 'hover:qq-border-rose-800',
-            ringRolor: 'qq-ring-rose-800',
-            ringColor: 'qq-ring-rose-800',
-            hoverRingColor: 'hover:qq-ring-rose-800',
-            divideColor: 'qq-divide-rose-800',
-            outlineColor: 'qq-outline-rose-800',
-            focusRingColor: 'focus:qq-ring-rose-800',
-        },
-        '900': {
-            bgColor: 'qq-bg-rose-900',
-            hoverBgColor: 'hover:qq-bg-rose-900',
-            textColor: 'qq-text-rose-900',
-            hoverTextColor: 'hover:qq-text-rose-900',
-            borderColor: 'qq-border-rose-900',
-            hoverBorderColor: 'hover:qq-border-rose-900',
-            ringRolor: 'qq-ring-rose-900',
-            ringColor: 'qq-ring-rose-900',
-            hoverRingColor: 'hover:qq-ring-rose-900',
-            divideColor: 'qq-divide-rose-900',
-            outlineColor: 'qq-outline-rose-900',
-            focusRingColor: 'focus:qq-ring-rose-900',
-        },
-    },
-};
-//# sourceMappingURL=colorClassNames.js.map