@lobehub/ui/es/ThemeProvider/GlobalStyle/essential.mjs.map

Lobe UI is an open-source UI component library for building AIGC web apps

{"version":3,"file":"essential.mjs","names":[],"sources":["../../../src/ThemeProvider/GlobalStyle/essential.ts"],"sourcesContent":["import { css, type Theme } from 'antd-style';\n\nimport { CLASSNAMES } from '@/styles/classNames';\n\n/**\n * Styles that library components rely on to render correctly (Flex layout,\n * popup trigger states, brand animations). Always injected by ThemeProvider,\n * independent of `enableGlobalStyle`, which only gates document-level resets.\n */\nexport default (token: Theme) => css`\n  @layer lobe-popup {\n    .${CLASSNAMES.ContextTrigger}[data-popup-open],\n      .${CLASSNAMES.DropdownMenuTrigger}[data-popup-open] {\n      background: ${token.colorFillTertiary};\n    }\n  }\n\n  @layer lobe-base {\n    :where(.lobe-flex) {\n      /* Define defaults on the element itself to avoid CSS variable inheritance leaking to nested Flex */\n      --lobe-flex: 0 1 auto;\n      --lobe-flex-direction: column;\n      --lobe-flex-wrap: nowrap;\n      --lobe-flex-justify: flex-start;\n      --lobe-flex-align: stretch;\n      --lobe-flex-width: auto;\n      --lobe-flex-height: auto;\n      --lobe-flex-padding: 0;\n\n      /* Keep padding-inline/block aligned with padding by default, and prevent inheriting from parent */\n      --lobe-flex-padding-inline: var(--lobe-flex-padding);\n      --lobe-flex-padding-block: var(--lobe-flex-padding);\n      --lobe-flex-gap: 0;\n\n      display: flex;\n      flex: var(--lobe-flex);\n      flex-flow: var(--lobe-flex-direction) var(--lobe-flex-wrap);\n      gap: var(--lobe-flex-gap);\n      align-items: var(--lobe-flex-align);\n      justify-content: var(--lobe-flex-justify);\n\n      width: var(--lobe-flex-width);\n      height: var(--lobe-flex-height);\n      padding: var(--lobe-flex-padding);\n      padding-block: var(--lobe-flex-padding-block);\n      padding-inline: var(--lobe-flex-padding-inline);\n    }\n\n    .lobe-flex-hidden {\n      display: none;\n    }\n  }\n\n  /* Brand Loading */\n  @keyframes draw {\n    0% {\n      stroke-dashoffset: 1000;\n    }\n\n    100% {\n      stroke-dashoffset: 0;\n    }\n  }\n\n  @keyframes fill {\n    30% {\n      fill-opacity: 0.05;\n    }\n\n    100% {\n      fill-opacity: 1;\n    }\n  }\n\n  .lobe-brand-loading path {\n    fill: currentcolor;\n    fill-opacity: 0;\n    stroke: currentcolor;\n    stroke-dasharray: 1000;\n    stroke-dashoffset: 1000;\n    stroke-width: 0.25em;\n\n    animation:\n      draw 2s cubic-bezier(0.4, 0, 0.2, 1) infinite,\n      fill 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n  }\n`;\n"],"mappings":";;;;;;;;AASA,IAAA,qBAAgB,UAAiB,GAAG;;OAE7B,WAAW,eAAe;SACxB,WAAW,oBAAoB;oBACpB,MAAM,kBAAkB"}