@lobehub/ui
Version:
Lobe UI is an open-source UI component library for building AIGC web apps
31 lines • 7.73 kB
JavaScript
var _templateObject;
function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
import { css, useTheme } from 'antd-style';
import { readableColor, rgba } from 'polished';
import { useMemo } from 'react';
export var useStyles = function useStyles() {
var theme = useTheme();
var colorText = theme.colorText;
var colorTextSecondary = theme.colorTextSecondary;
var colorTextTertiary = theme.colorTextTertiary;
var colorRed = theme.colorError;
var colorOrange = theme.colorWarning;
var colorGreen = theme.colorSuccess;
var colorBlue = theme.colorInfo;
var loaderContainer = theme.isDarkMode ? 'https://github.com/images/modules/pulls/progressive-disclosure-line-dark.svg' : 'https://github.com/images/modules/pulls/progressive-disclosure-line.svg';
var loadingImage = theme.isDarkMode ? 'https://github.githubassets.com/images/mona-loading-dark.gif' : 'https://github.githubassets.com/images/mona-loading-default.gif';
var _ref = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n main {\n --color-prettylights-syntax-comment: ", ";\n --color-prettylights-syntax-constant: ", ";\n --color-prettylights-syntax-entity: ", ";\n --color-prettylights-syntax-storage-modifier-import: ", ";\n --color-prettylights-syntax-entity-tag: ", ";\n --color-prettylights-syntax-keyword: ", ";\n --color-prettylights-syntax-string: ", ";\n --color-prettylights-syntax-variable: ", ";\n --color-prettylights-syntax-brackethighlighter-unmatched: ", ";\n --color-prettylights-syntax-invalid-illegal-text: ", ";\n --color-prettylights-syntax-invalid-illegal-bg: ", ";\n --color-prettylights-syntax-carriage-return-text: ", ";\n --color-prettylights-syntax-carriage-return-bg: ", ";\n --color-prettylights-syntax-string-regexp: ", ";\n --color-prettylights-syntax-markup-list: ", ";\n --color-prettylights-syntax-markup-heading: ", ";\n --color-prettylights-syntax-markup-italic: ", ";\n --color-prettylights-syntax-markup-bold: ", ";\n --color-prettylights-syntax-markup-deleted-text: ", ";\n --color-prettylights-syntax-markup-deleted-bg: ", ";\n --color-prettylights-syntax-markup-inserted-text: ", ";\n --color-prettylights-syntax-markup-inserted-bg: ", ";\n --color-prettylights-syntax-markup-changed-text: ", ";\n --color-prettylights-syntax-markup-changed-bg: ", ";\n --color-prettylights-syntax-markup-ignored-text: ", ";\n --color-prettylights-syntax-markup-ignored-bg: ", ";\n --color-prettylights-syntax-meta-diff-range: ", ";\n --color-prettylights-syntax-brackethighlighter-angle: ", ";\n --color-prettylights-syntax-sublimelinter-gutter-mark: ", ";\n --color-prettylights-syntax-constant-other-reference-link: ", ";\n --color-btn-text: ", ";\n --color-btn-bg: ", ";\n --color-btn-border: ", ";\n --color-btn-shadow: 0 0 transparent;\n --color-btn-inset-shadow: 0 0 transparent;\n --color-btn-hover-bg: ", ";\n --color-btn-hover-border: ", ";\n --color-btn-active-bg: ", ";\n --color-btn-active-border: ", ";\n --color-btn-selected-bg: ", ";\n --color-btn-primary-text: ", ";\n --color-btn-primary-bg: ", ";\n --color-btn-primary-border: ", ";\n --color-btn-primary-shadow: 0 0 transparent;\n --color-btn-primary-inset-shadow: 0 0 transparent;\n --color-btn-primary-hover-bg: ", ";\n --color-btn-primary-hover-border: ", ";\n --color-btn-primary-selected-bg: ", ";\n --color-btn-primary-selected-shadow: 0 0 transparent;\n --color-btn-primary-disabled-text: ", ";\n --color-btn-primary-disabled-bg: ", ";\n --color-btn-primary-disabled-border: ", ";\n --color-action-list-item-default-hover-bg: ", ";\n --color-segmented-control-bg: ", ";\n --color-segmented-control-button-bg: transparent;\n --color-segmented-control-button-selected-border: ", ";\n --color-fg-default: ", ";\n --color-fg-muted: ", ";\n --color-fg-subtle: ", ";\n --color-canvas-default: transparent;\n --color-canvas-overlay: ", ";\n --color-canvas-inset: transparent;\n --color-canvas-subtle: ", ";\n --color-border-default: ", ";\n --color-border-muted: ", ";\n --color-neutral-muted: ", ";\n --color-neutral-subtle: ", ";\n --color-accent-fg: ", ";\n --color-accent-emphasis: ", ";\n --color-accent-muted: ", ";\n --color-accent-subtle: ", ";\n --color-success-fg: ", ";\n --color-attention-fg: ", ";\n --color-attention-muted: ", ";\n --color-attention-subtle: ", ";\n --color-danger-fg: ", ";\n --color-danger-muted: ", ";\n --color-danger-subtle: ", ";\n --color-primer-shadow-inset: 0 0 transparent;\n --color-scale-gray-7: ", ";\n --color-scale-blue-8: ", ";\n --color-social-reaction-bg-hover: ", ";\n --color-social-reaction-bg-reacted-hover: ", ";\n\n .markdown pre {\n color: ", ";\n }\n\n .pagination-loader-container {\n background-image: url(", ");\n }\n\n .gsc-pagination-button {\n background-color: var(--color-btn-bg);\n }\n\n .gsc-reactions-popover {\n width: 170px;\n\n > .m-2 {\n display: flex;\n flex-wrap: wrap;\n gap: 8px;\n }\n }\n\n .gsc-emoji-button.has-reacted {\n border-color: ", ";\n border-radius: ", "px;\n }\n\n .gsc-loading-image {\n background-image: url(", ");\n }\n }\n "])), colorTextTertiary, colorGreen, colorOrange, colorRed, colorBlue, colorBlue, colorGreen, colorRed, colorRed, colorTextSecondary, rgba(colorRed, 0.4), colorTextSecondary, rgba(colorRed, 0.6), colorGreen, colorOrange, colorBlue, colorTextSecondary, colorTextSecondary, colorTextSecondary, rgba(colorRed, 0.2), colorGreen, rgba(colorGreen, 0.2), colorOrange, rgba(colorRed, 0.2), colorTextSecondary, rgba(colorBlue, 0.2), colorOrange, colorTextSecondary, colorTextTertiary, colorBlue, theme.colorText, theme.colorFillTertiary, theme.colorBorderSecondary, theme.colorFillSecondary, theme.colorBorder, theme.colorFillSecondary, theme.colorBorder, theme.colorFillSecondary, readableColor(theme.colorPrimary), theme.colorPrimary, theme.colorPrimaryBorder, theme.colorPrimaryHover, theme.colorPrimaryBorderHover, theme.colorPrimaryActive, rgba(readableColor(theme.colorPrimary), 0.5), rgba(theme.colorPrimary, 0.5), rgba(theme.colorPrimaryBorder, 0.5), theme.colorFillQuaternary, theme.colorFillTertiary, theme.colorBorder, theme.colorText, theme.colorTextSecondary, theme.colorTextQuaternary, theme.colorBgElevated, theme.colorFillQuaternary, theme.colorBorder, theme.colorBorderSecondary, theme.colorFillQuaternary, theme.colorFillTertiary, theme.colorInfo, theme.colorInfoBorderHover, theme.colorInfoBorder, theme.colorInfoBg, theme.colorSuccess, theme.colorWarning, theme.colorWarningBorder, theme.colorWarningBg, theme.colorError, theme.colorErrorBorder, theme.colorErrorBg, theme.colorBgContainer, theme.colorInfoBg, theme.colorFillSecondary, theme.colorInfoBgHover, colorText, loaderContainer, theme.colorInfoBorderHover, theme.borderRadius, loadingImage),
styles = _ref.styles;
return useMemo(function () {
return "data:text/css;base64,".concat(btoa(styles));
}, [styles]);
};
export var formatLang = function formatLang(lang) {
if (['zh_CN', 'zh_TW'].includes(lang)) {
return lang.replace('_', '-');
} else if (lang === 'zh_HK') {
return 'zh-TW';
} else {
return lang.split('_')[0];
}
};